admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

- rename entries hooks

Browse Source 
- tests
- move useeffects to sub components
This commit is contained in:
brendanlaschke
2023-08-14 23:52:36 +02:00
parent a7f4326419
commit cbd0d0a724
21 changed files with 235 additions and 223 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
front/src/modules/companies/components/HooksCompanyBoard.tsx
View File

@ -27,8 +27,12 @@ import { CompanyBoardContext } from '../states/CompanyBoardContext';
export function HooksCompanyBoard({
orderBy,
setActionBar,
setContextMenu,
}: {
orderBy: PipelineProgresses_Order_By[];
setActionBar?: () => void;
setContextMenu?: () => void;
}) {
const setFieldsDefinitionsState = useSetRecoilState(
viewFieldsDefinitionsState,
@ -110,6 +114,13 @@ export function HooksCompanyBoard({
const loading =
loadingGetPipelines || loadingGetPipelineProgress || loadingGetCompanies;
if (setActionBar) {
setActionBar();
}
if (setContextMenu) {
setContextMenu();
}
useEffect(() => {
if (!loading && pipeline && pipelineProgresses && companiesData) {
updateCompanyBoard(pipeline, pipelineProgresses, companiesData.companies);

46
front/src/modules/companies/hooks/useActionBarEntries.tsx Normal file
View File

@ -0,0 +1,46 @@
import { useSetRecoilState } from 'recoil';
import { useOpenCreateActivityDrawerForSelectedRowIds } from '@/activities/hooks/useOpenCreateActivityDrawerForSelectedRowIds';
import { ActivityTargetableEntityType } from '@/activities/types/ActivityTargetableEntity';
import { ActionBarEntry } from '@/ui/action-bar/components/ActionBarEntry';
import { actionBarEntriesState } from '@/ui/action-bar/states/ActionBarEntriesState';
import { IconCheckbox, IconNotes, IconTrash } from '@/ui/icon';
import { ActivityType } from '~/generated/graphql';
import { useDeleteSelectedComapnies } from './useDeleteCompanies';
export function useActionBarEntries() {
const setActionBarEntries = useSetRecoilState(actionBarEntriesState);
const openCreateActivityRightDrawer =
useOpenCreateActivityDrawerForSelectedRowIds();
async function handleActivityClick(type: ActivityType) {
openCreateActivityRightDrawer(type, ActivityTargetableEntityType.Company);
}
const deleteSelectedCompanies = useDeleteSelectedComapnies();
return () => {
setActionBarEntries([
<ActionBarEntry
label="Note"
icon={<IconNotes size={16} />}
onClick={() => handleActivityClick(ActivityType.Note)}
key="note"
/>,
<ActionBarEntry
label="Task"
icon={<IconCheckbox size={16} />}
onClick={() => handleActivityClick(ActivityType.Task)}
key="task"
/>,
<ActionBarEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={() => deleteSelectedCompanies()}
key="delete"
/>,
]);
};
}

47
front/src/modules/companies/hooks/useContextMenuEntries.tsx Normal file
View File

@ -0,0 +1,47 @@
import { IconCheckbox, IconNotes, IconTrash } from '@tabler/icons-react';
import { useSetRecoilState } from 'recoil';
import { useOpenCreateActivityDrawerForSelectedRowIds } from '@/activities/hooks/useOpenCreateActivityDrawerForSelectedRowIds';
import { ActivityTargetableEntityType } from '@/activities/types/ActivityTargetableEntity';
import { ContextMenuEntry } from '@/ui/context-menu/components/ContextMenuEntry';
import { contextMenuEntriesState } from '@/ui/context-menu/states/ContextMenuEntriesState';
import { ActivityType } from '~/generated/graphql';
import { useDeleteSelectedComapnies } from './useDeleteCompanies';
export function useContextMenuEntries() {
const setContextMenuEntries = useSetRecoilState(contextMenuEntriesState);
const openCreateActivityRightDrawer =
useOpenCreateActivityDrawerForSelectedRowIds();
async function handleButtonClick(type: ActivityType) {
openCreateActivityRightDrawer(type, ActivityTargetableEntityType.Company);
}
const deleteSelectedCompanies = useDeleteSelectedComapnies();
return () => {
setContextMenuEntries([
<ContextMenuEntry
label="Note"
icon={<IconNotes size={16} />}
onClick={() => handleButtonClick(ActivityType.Note)}
key="note"
/>,
<ContextMenuEntry
label="Task"
icon={<IconCheckbox size={16} />}
onClick={() => handleButtonClick(ActivityType.Task)}
key="task"
/>,
<ContextMenuEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={() => deleteSelectedCompanies()}
key="delete"
/>,
]);
};
}

15
front/src/modules/companies/hooks/TableContextMenuEntryDeleteCompanies.tsx → front/src/modules/companies/hooks/useDeleteCompanies.ts
View File

@ -2,14 +2,12 @@ import { getOperationName } from '@apollo/client/utilities';
import { useRecoilState, useRecoilValue } from 'recoil';
import { GET_PIPELINES } from '@/pipeline/queries';
import { ContextMenuEntry } from '@/ui/context-menu/components/ContextMenuEntry';
import { IconTrash } from '@/ui/icon/index';
import { useResetTableRowSelection } from '@/ui/table/hooks/useResetTableRowSelection';
import { selectedRowIdsSelector } from '@/ui/table/states/selectedRowIdsSelector';
import { tableRowIdsState } from '@/ui/table/states/tableRowIdsState';
import { useDeleteManyCompaniesMutation } from '~/generated/graphql';
export function TableContextMenuEntryDeleteCompanies() {
export function useDeleteSelectedComapnies() {
const selectedRowIds = useRecoilValue(selectedRowIdsSelector);
const resetRowSelection = useResetTableRowSelection();
@ -20,7 +18,7 @@ export function TableContextMenuEntryDeleteCompanies() {
const [tableRowIds, setTableRowIds] = useRecoilState(tableRowIdsState);
async function handleDeleteClick() {
async function deleteSelectedCompanies() {
const rowIdsToDelete = selectedRowIds;
resetRowSelection();
@ -43,12 +41,5 @@ export function TableContextMenuEntryDeleteCompanies() {
});
}
return (
<ContextMenuEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={handleDeleteClick}
/>
);
return deleteSelectedCompanies;
}

81
front/src/modules/companies/hooks/useOpenActionBar.tsx
View File

@ -1,81 +0,0 @@
import { getOperationName } from '@apollo/client/utilities';
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
import { useOpenCreateActivityDrawerForSelectedRowIds } from '@/activities/hooks/useOpenCreateActivityDrawerForSelectedRowIds';
import { ActivityTargetableEntityType } from '@/activities/types/ActivityTargetableEntity';
import { GET_PIPELINES } from '@/pipeline/queries';
import { ActionBarEntry } from '@/ui/action-bar/components/ActionBarEntry';
import { actionBarEntriesState } from '@/ui/action-bar/states/ActionBarEntriesState';
import { IconCheckbox, IconNotes, IconTrash } from '@/ui/icon';
import { useResetTableRowSelection } from '@/ui/table/hooks/useResetTableRowSelection';
import { selectedRowIdsSelector } from '@/ui/table/states/selectedRowIdsSelector';
import { tableRowIdsState } from '@/ui/table/states/tableRowIdsState';
import {
ActivityType,
useDeleteManyCompaniesMutation,
} from '~/generated/graphql';
export function useOpenActionBar() {
const setActionBarEntries = useSetRecoilState(actionBarEntriesState);
const openCreateActivityRightDrawer =
useOpenCreateActivityDrawerForSelectedRowIds();
async function handleActivityClick(type: ActivityType) {
openCreateActivityRightDrawer(type, ActivityTargetableEntityType.Company);
}
const selectedRowIds = useRecoilValue(selectedRowIdsSelector);
const resetRowSelection = useResetTableRowSelection();
const [deleteCompanies] = useDeleteManyCompaniesMutation({
refetchQueries: [getOperationName(GET_PIPELINES) ?? ''],
});
const [tableRowIds, setTableRowIds] = useRecoilState(tableRowIdsState);
async function handleDeleteClick() {
const rowIdsToDelete = selectedRowIds;
resetRowSelection();
await deleteCompanies({
variables: {
ids: rowIdsToDelete,
},
optimisticResponse: {
__typename: 'Mutation',
deleteManyCompany: {
count: rowIdsToDelete.length,
},
},
update: () => {
setTableRowIds(
tableRowIds.filter((id) => !rowIdsToDelete.includes(id)),
);
},
});
}
return () => {
setActionBarEntries([
<ActionBarEntry
label="Note"
icon={<IconNotes size={16} />}
onClick={() => handleActivityClick(ActivityType.Note)}
/>,
<ActionBarEntry
label="Task"
icon={<IconCheckbox size={16} />}
onClick={() => handleActivityClick(ActivityType.Task)}
/>,
<ActionBarEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={handleDeleteClick}
/>,
]);
};
}

81
front/src/modules/companies/hooks/useOpenContextMenu.tsx
View File

@ -1,81 +0,0 @@
import { getOperationName } from '@apollo/client/utilities';
import { IconCheckbox, IconNotes, IconTrash } from '@tabler/icons-react';
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
import { useOpenCreateActivityDrawerForSelectedRowIds } from '@/activities/hooks/useOpenCreateActivityDrawerForSelectedRowIds';
import { ActivityTargetableEntityType } from '@/activities/types/ActivityTargetableEntity';
import { GET_PIPELINES } from '@/pipeline/queries';
import { ContextMenuEntry } from '@/ui/context-menu/components/ContextMenuEntry';
import { contextMenuEntriesState } from '@/ui/context-menu/states/ContextMenuEntriesState';
import { useResetTableRowSelection } from '@/ui/table/hooks/useResetTableRowSelection';
import { selectedRowIdsSelector } from '@/ui/table/states/selectedRowIdsSelector';
import { tableRowIdsState } from '@/ui/table/states/tableRowIdsState';
import {
ActivityType,
useDeleteManyCompaniesMutation,
} from '~/generated/graphql';
export function useOpenContextMenu() {
const setContextMenuEntries = useSetRecoilState(contextMenuEntriesState);
const openCreateActivityRightDrawer =
useOpenCreateActivityDrawerForSelectedRowIds();
async function handleButtonClick(type: ActivityType) {
openCreateActivityRightDrawer(type, ActivityTargetableEntityType.Company);
}
const selectedRowIds = useRecoilValue(selectedRowIdsSelector);
const resetRowSelection = useResetTableRowSelection();
const [deleteCompanies] = useDeleteManyCompaniesMutation({
refetchQueries: [getOperationName(GET_PIPELINES) ?? ''],
});
const [tableRowIds, setTableRowIds] = useRecoilState(tableRowIdsState);
async function handleDeleteClick() {
const rowIdsToDelete = selectedRowIds;
resetRowSelection();
await deleteCompanies({
variables: {
ids: rowIdsToDelete,
},
optimisticResponse: {
__typename: 'Mutation',
deleteManyCompany: {
count: rowIdsToDelete.length,
},
},
update: () => {
setTableRowIds(
tableRowIds.filter((id) => !rowIdsToDelete.includes(id)),
);
},
});
}
return () => {
setContextMenuEntries([
<ContextMenuEntry
label="Note"
icon={<IconNotes size={16} />}
onClick={() => handleButtonClick(ActivityType.Note)}
/>,
<ContextMenuEntry
label="Task"
icon={<IconCheckbox size={16} />}
onClick={() => handleButtonClick(ActivityType.Task)}
/>,
<ContextMenuEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={handleDeleteClick}
/>,
]);
};
}

7
front/src/modules/companies/table/components/CompanyTable.tsx
View File

@ -2,6 +2,8 @@ import { useMemo } from 'react';
import { useRecoilValue } from 'recoil';
import { companyViewFields } from '@/companies/constants/companyViewFields';
import { useActionBarEntries } from '@/companies/hooks/useActionBarEntries';
import { useContextMenuEntries } from '@/companies/hooks/useContextMenuEntries';
import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
import { sortsOrderByScopedState } from '@/ui/filter-n-sort/states/sortScopedState';
import { turnFilterIntoWhereClause } from '@/ui/filter-n-sort/utils/turnFilterIntoWhereClause';
@ -45,6 +47,9 @@ export function CompanyTable() {
return { AND: filters.map(turnFilterIntoWhereClause) };
}, [filters]) as any;
const setContextMenu = useContextMenuEntries();
const setActionBar = useActionBarEntries();
return (
<>
<GenericEntityTableData
@ -53,6 +58,8 @@ export function CompanyTable() {
orderBy={orderBy.length ? orderBy : defaultOrderBy}
whereFilters={whereFilters}
filterDefinitionArray={companiesFilters}
setContextMenu={setContextMenu}
setActionBar={setActionBar}
/>
<EntityTable
viewName="All Companies"

5
front/src/modules/people/hooks/useOpenActionBar.tsx → front/src/modules/people/hooks/useActionBarEntries.tsx
View File

@ -13,7 +13,7 @@ import { ActivityType, useDeleteManyPersonMutation } from '~/generated/graphql';
import { GET_PEOPLE } from '../queries';
export function useOpenActionBar() {
export function useActionBarEntries() {
const setActionBarEntries = useSetRecoilState(actionBarEntriesState);
const openCreateActivityRightDrawer =
@ -61,17 +61,20 @@ export function useOpenActionBar() {
label="Note"
icon={<IconNotes size={16} />}
onClick={() => handleActivityClick(ActivityType.Note)}
key="note"
/>,
<ActionBarEntry
label="Task"
icon={<IconCheckbox size={16} />}
onClick={() => handleActivityClick(ActivityType.Task)}
key="task"
/>,
<ActionBarEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={handleDeleteClick}
key="delte"
/>,
]);
};

5
front/src/modules/people/hooks/useOpenContextMenu.tsx → front/src/modules/people/hooks/useContextMenuEntries.tsx
View File

@ -13,7 +13,7 @@ import { ActivityType, useDeleteManyPersonMutation } from '~/generated/graphql';
import { GET_PEOPLE } from '../queries';
export function useOpenContextMenu() {
export function useContextMenuEntries() {
const setContextMenuEntries = useSetRecoilState(contextMenuEntriesState);
const openCreateActivityRightDrawer =
@ -61,17 +61,20 @@ export function useOpenContextMenu() {
label="Note"
icon={<IconNotes size={16} />}
onClick={() => handleActivityClick(ActivityType.Note)}
key="note"
/>,
<ContextMenuEntry
label="Task"
icon={<IconCheckbox size={16} />}
onClick={() => handleActivityClick(ActivityType.Task)}
key="task"
/>,
<ContextMenuEntry
label="Delete"
icon={<IconTrash size={16} />}
type="danger"
onClick={handleDeleteClick}
key="delete"
/>,
]);
};

7
front/src/modules/people/table/components/PeopleTable.tsx
View File

@ -1,6 +1,8 @@
import { useMemo } from 'react';
import { useRecoilValue } from 'recoil';
import { useActionBarEntries } from '@/companies/hooks/useActionBarEntries';
import { useContextMenuEntries } from '@/companies/hooks/useContextMenuEntries';
import { peopleViewFields } from '@/people/constants/peopleViewFields';
import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
import { sortsOrderByScopedState } from '@/ui/filter-n-sort/states/sortScopedState';
@ -45,6 +47,9 @@ export function PeopleTable() {
return { AND: filters.map(turnFilterIntoWhereClause) };
}, [filters]) as any;
const setContextMenu = useContextMenuEntries();
const setActionBar = useActionBarEntries();
return (
<>
<GenericEntityTableData
@ -53,6 +58,8 @@ export function PeopleTable() {
orderBy={orderBy.length ? orderBy : defaultOrderBy}
whereFilters={whereFilters}
filterDefinitionArray={peopleFilters}
setContextMenu={setContextMenu}
setActionBar={setActionBar}
/>
<EntityTable
viewName="All People"

33
front/src/modules/ui/action-bar/components/__stories__/ActionBar.stories.tsx
View File

@ -3,12 +3,39 @@ import type { Meta, StoryObj } from '@storybook/react';
import { ComponentDecorator } from '~/testing/decorators/ComponentDecorator';
import { ActionBar } from '../ActionBar';
import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
import { MemoryRouter } from 'react-router-dom';
import { CompanyTableMockMode } from '@/companies/table/components/CompanyTableMockMode';
import { EntityTableContextMenu } from '@/ui/table/context-menu/components/EntityTableContextMenu';
import { EntityTableActionBar } from '@/ui/table/action-bar/components/EntityTableActionBar';
import { TableContext } from '@/ui/table/states/TableContext';
import { useActionBarEntries } from '@/companies/hooks/useActionBarEntries';
import { useSetRecoilState } from 'recoil';
import { actionBarOpenState } from '../../states/ActionBarIsOpenState';
function FilledActionBar(props: { selectedIds: string[] }) {
const setActionBar = useActionBarEntries();
setActionBar();
const setActionBarOpenState = useSetRecoilState(actionBarOpenState);
setActionBarOpenState(true);
return <ActionBar selectedIds={props.selectedIds} />;
}
const meta: Meta<typeof ActionBar> = {
title: 'UI/ActionBar/ActionBar',
component: ActionBar,
decorators: [ComponentDecorator],
args: { selectedIds: [] },
component: FilledActionBar,
decorators: [
(Story) => (
<RecoilScope SpecificContext={TableContext}>
<CompanyTableMockMode></CompanyTableMockMode>
<MemoryRouter>
<Story />
</MemoryRouter>
</RecoilScope>
),
ComponentDecorator,
],
args: { selectedIds: ['TestId'] },
};
export default meta;

1
front/src/modules/ui/board/components/BoardActionBarButtonDeleteBoardCard.tsx
View File

@ -43,6 +43,7 @@ export function BoardActionBarButtonDeleteBoardCard() {
icon={<IconTrash size={16} />}
type="danger"
onClick={handleDelete}
key="delete"
/>
);
}

4
front/src/modules/ui/board/hooks/useActionBar.tsx → front/src/modules/ui/board/hooks/useActionBarEntries.tsx
View File

@ -4,10 +4,10 @@ import { actionBarEntriesState } from '@/ui/action-bar/states/ActionBarEntriesSt
import { BoardActionBarButtonDeleteBoardCard } from '../components/BoardActionBarButtonDeleteBoardCard';
export function useOpenActionBar() {
export function useActionBarEntries() {
const setActionBarEntries = useSetRecoilState(actionBarEntriesState);
return () => {
setActionBarEntries([<BoardActionBarButtonDeleteBoardCard />]);
setActionBarEntries([<BoardActionBarButtonDeleteBoardCard key="delete" />]);
};
}

6
front/src/modules/ui/board/hooks/useCurrentCardSelected.ts
View File

@ -1,5 +1,7 @@
import { useContext } from 'react';
import { useRecoilCallback, useRecoilState } from 'recoil';
import { useRecoilCallback, useRecoilState, useSetRecoilState } from 'recoil';
import { actionBarOpenState } from '@/ui/action-bar/states/ActionBarIsOpenState';
import { BoardCardIdContext } from '../states/BoardCardIdContext';
import { isCardSelectedFamilyState } from '../states/isCardSelectedFamilyState';
@ -10,6 +12,7 @@ export function useCurrentCardSelected() {
const [isCardSelected] = useRecoilState(
isCardSelectedFamilyState(currentCardId ?? ''),
);
const setActionBarOpenState = useSetRecoilState(actionBarOpenState);
const setCurrentCardSelected = useRecoilCallback(
({ set }) =>
@ -17,6 +20,7 @@ export function useCurrentCardSelected() {
if (!currentCardId) return;
set(isCardSelectedFamilyState(currentCardId), selected);
setActionBarOpenState(true);
},
[],
);

7
front/src/modules/ui/board/hooks/useSetCardSelected.ts
View File

@ -1,9 +1,14 @@
import { useRecoilCallback } from 'recoil';
import { useRecoilCallback, useSetRecoilState } from 'recoil';
import { actionBarOpenState } from '@/ui/action-bar/states/ActionBarIsOpenState';
import { isCardSelectedFamilyState } from '../states/isCardSelectedFamilyState';
export function useSetCardSelected() {
const setActionBarOpenState = useSetRecoilState(actionBarOpenState);
return useRecoilCallback(({ set }) => (cardId: string, selected: boolean) => {
set(isCardSelectedFamilyState(cardId), selected);
setActionBarOpenState(true);
});
}

17
front/src/modules/ui/context-menu/components/__stories__/ActionBar.stories.tsx
View File

@ -1,17 +0,0 @@
import type { Meta, StoryObj } from '@storybook/react';
import { ComponentDecorator } from '~/testing/decorators/ComponentDecorator';
import { ContextMenu } from '../ContextMenu';
const meta: Meta<typeof ContextMenu> = {
title: 'UI/ContextMenu/ContextMenu',
component: ContextMenu,
decorators: [ComponentDecorator],
args: { selectedIds: [] },
};
export default meta;
type Story = StoryObj<typeof ContextMenu>;
export const Default: Story = {};

48
front/src/modules/ui/context-menu/components/__stories__/ContextMenu.stories.tsx Normal file
View File

@ -0,0 +1,48 @@
import type { Meta, StoryObj } from '@storybook/react';
import { ComponentDecorator } from '~/testing/decorators/ComponentDecorator';
import { ContextMenu } from '../ContextMenu';
import { useContextMenuEntries } from '@/companies/hooks/useContextMenuEntries';
import { useSetRecoilState } from 'recoil';
import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
import { TableContext } from '@/ui/table/states/TableContext';
import { CompanyTableMockMode } from '@/companies/table/components/CompanyTableMockMode';
import { MemoryRouter } from 'react-router-dom';
import { contextMenuOpenState } from '../../states/ContextMenuIsOpenState';
import { contextMenuPositionState } from '../../states/ContextMenuPositionState';
function FilledContextMenu(props: { selectedIds: string[] }) {
const setContextMenu = useContextMenuEntries();
setContextMenu();
const setContextMenuPosition = useSetRecoilState(contextMenuPositionState);
setContextMenuPosition({
x: 100,
y: 10,
});
const setContextMenuOpenState = useSetRecoilState(contextMenuOpenState);
setContextMenuOpenState(true);
return <ContextMenu selectedIds={props.selectedIds} />;
}
const meta: Meta<typeof ContextMenu> = {
title: 'UI/ContextMenu/ContextMenu',
component: FilledContextMenu,
decorators: [
(Story) => (
<RecoilScope SpecificContext={TableContext}>
<CompanyTableMockMode></CompanyTableMockMode>
<MemoryRouter>
<Story />
</MemoryRouter>
</RecoilScope>
),
ComponentDecorator,
],
args: { selectedIds: ['TestId'] },
};
export default meta;
type Story = StoryObj<typeof ContextMenu>;
export const Default: Story = {};

10
front/src/modules/ui/table/components/GenericEntityTableData.tsx
View File

@ -8,12 +8,16 @@ export function GenericEntityTableData({
orderBy = defaultOrderBy,
whereFilters,
filterDefinitionArray,
setActionBar,
setContextMenu,
}: {
useGetRequest: any;
getRequestResultKey: string;
orderBy?: any;
whereFilters?: any;
filterDefinitionArray: FilterDefinition[];
setActionBar?: () => void;
setContextMenu?: () => void;
}) {
const setEntityTableData = useSetEntityTableData();
useGetRequest({
@ -24,5 +28,11 @@ export function GenericEntityTableData({
},
});
if (setActionBar) {
setActionBar();
}
if (setContextMenu) {
setContextMenu();
}
return <></>;
}

11
front/src/pages/companies/Companies.tsx
View File

@ -1,11 +1,8 @@
import { useEffect } from 'react';
import { getOperationName } from '@apollo/client/utilities';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { v4 } from 'uuid';
import { useOpenActionBar } from '@/companies/hooks/useOpenActionBar';
import { useOpenContextMenu } from '@/companies/hooks/useOpenContextMenu';
import { CompanyTable } from '@/companies/table/components/CompanyTable';
import { SEARCH_COMPANY_QUERY } from '@/search/queries/search';
import { IconBuildingSkyscraper } from '@/ui/icon';
@ -65,14 +62,6 @@ export function Companies() {
const theme = useTheme();
const setContextMenu = useOpenContextMenu();
const setActionBar = useOpenActionBar();
useEffect(() => {
setContextMenu();
setActionBar();
}, [setContextMenu, setActionBar]);
return (
<WithTopBarContainer
title="Companies"

5
front/src/pages/opportunities/Opportunities.tsx
View File

@ -9,6 +9,7 @@ import {
} from '@/pipeline/queries';
import { EntityBoard } from '@/ui/board/components/EntityBoard';
import { EntityBoardActionBar } from '@/ui/board/components/EntityBoardActionBar';
import { useActionBarEntries } from '@/ui/board/hooks/useActionBarEntries';
import { BoardOptionsContext } from '@/ui/board/states/BoardOptionsContext';
import { reduceSortsToOrderBy } from '@/ui/filter-n-sort/helpers';
import { IconTargetArrow } from '@/ui/icon/index';
@ -62,6 +63,8 @@ export function Opportunities() {
});
}
const setActionBar = useActionBarEntries();
return (
<WithTopBarContainer
title="Opportunities"
@ -69,7 +72,7 @@ export function Opportunities() {
>
<BoardOptionsContext.Provider value={opportunitiesBoardOptions}>
<RecoilScope SpecificContext={CompanyBoardContext}>
<HooksCompanyBoard orderBy={orderBy} />
<HooksCompanyBoard orderBy={orderBy} setActionBar={setActionBar} />
<EntityBoard
boardOptions={opportunitiesBoardOptions}
updateSorts={updateSorts}

11
front/src/pages/people/People.tsx
View File

@ -1,10 +1,7 @@
import { useEffect } from 'react';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { v4 } from 'uuid';
import { useOpenActionBar } from '@/people/hooks/useOpenActionBar';
import { useOpenContextMenu } from '@/people/hooks/useOpenContextMenu';
import { PeopleTable } from '@/people/table/components/PeopleTable';
import { IconUser } from '@/ui/icon';
import { WithTopBarContainer } from '@/ui/layout/components/WithTopBarContainer';
@ -58,14 +55,6 @@ export function People() {
const theme = useTheme();
const setContextMenu = useOpenContextMenu();
const setActionBar = useOpenActionBar();
useEffect(() => {
setContextMenu();
setActionBar();
}, [setContextMenu, setActionBar]);
return (
<RecoilScope SpecificContext={TableContext}>
<WithTopBarContainer