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

Uniformize folder structure (#693)

Browse Source 
* Uniformize folder structure

* Fix icons

* Fix icons

* Fix tests

* Fix tests
This commit is contained in:
Charles Bochet
2023-07-16 14:29:28 -07:00
committed by GitHub
parent 900ec5572f
commit 6ced8434bd
462 changed files with 931 additions and 960 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
front/src/modules/companies/__stories__/Board.stories.tsx
View File

@ -1,7 +1,7 @@
import { Meta, StoryObj } from '@storybook/react';
import { companyBoardOptions } from '@/companies/components/companyBoardOptions';
import { EntityBoard } from '@/pipeline-progress/components/EntityBoard';
import { EntityBoard } from '@/pipeline/components/EntityBoard';
import { BoardDecorator } from '~/testing/decorators';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { getRenderWrapperForComponent } from '~/testing/renderWrappers';

6
front/src/modules/companies/components/CompanyAccountOwnerCell.tsx
View File

@ -1,7 +1,7 @@
import { PersonChip } from '@/people/components/PersonChip';
import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope';
import { EditableCell } from '@/ui/components/editable-cell/EditableCell';
import { useEditableCell } from '@/ui/components/editable-cell/hooks/useEditableCell';
import { RelationPickerHotkeyScope } from '@/ui/relation-picker/types/RelationPickerHotkeyScope';
import { EditableCell } from '@/ui/table/editable-cell/components/EditableCell';
import { useEditableCell } from '@/ui/table/editable-cell/hooks/useEditableCell';
import { Company, User } from '~/generated/graphql';
import { CompanyAccountOwnerPicker } from './CompanyAccountOwnerPicker';

10
front/src/modules/companies/components/CompanyAccountOwnerPicker.tsx
View File

@ -1,9 +1,9 @@
import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState';
import { SingleEntitySelect } from '@/relation-picker/components/SingleEntitySelect';
import { relationPickerSearchFilterScopedState } from '@/relation-picker/states/relationPickerSearchFilterScopedState';
import { EntityForSelect } from '@/relation-picker/types/EntityForSelect';
import { Entity } from '@/relation-picker/types/EntityTypeForSelect';
import { useFilteredSearchEntityQuery } from '@/search/hooks/useFilteredSearchEntityQuery';
import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
import { SingleEntitySelect } from '@/ui/relation-picker/components/SingleEntitySelect';
import { relationPickerSearchFilterScopedState } from '@/ui/relation-picker/states/relationPickerSearchFilterScopedState';
import { EntityForSelect } from '@/ui/relation-picker/types/EntityForSelect';
import { Entity } from '@/ui/relation-picker/types/EntityTypeForSelect';
import {
Company,
User,

22
front/src/modules/companies/components/CompanyBoardCard.tsx
View File

@ -2,24 +2,24 @@ import { useCallback } from 'react';
import { getOperationName } from '@apollo/client/utilities';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { IconCurrencyDollar } from '@tabler/icons-react';
import { useRecoilState } from 'recoil';
import { companyProgressesFamilyState } from '@/companies/states/companyProgressesFamilyState';
import { GET_PIPELINES } from '@/pipeline-progress/services';
import { BoardCardContext } from '@/pipeline-progress/states/BoardCardContext';
import { pipelineProgressIdScopedState } from '@/pipeline-progress/states/pipelineProgressIdScopedState';
import { selectedBoardCardsState } from '@/pipeline-progress/states/selectedBoardCardsState';
import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState';
import { BoardCardEditableFieldDate } from '@/ui/board-card-field-inputs/components/BoardCardEditableFieldDate';
import { BoardCardEditableFieldText } from '@/ui/board-card-field-inputs/components/BoardCardEditableFieldText';
import { Checkbox } from '@/ui/components/form/Checkbox';
import { IconCalendarEvent } from '@/ui/icons';
import { getLogoUrlFromDomainName } from '@/utils/utils';
import { GET_PIPELINES } from '@/pipeline/queries';
import { BoardCardContext } from '@/pipeline/states/BoardCardContext';
import { pipelineProgressIdScopedState } from '@/pipeline/states/pipelineProgressIdScopedState';
import { selectedBoardCardsState } from '@/pipeline/states/selectedBoardCardsState';
import { BoardCardEditableFieldDate } from '@/ui/board/card-field/components/BoardCardEditableFieldDate';
import { BoardCardEditableFieldText } from '@/ui/board/card-field/components/BoardCardEditableFieldText';
import { IconCurrencyDollar } from '@/ui/icon';
import { IconCalendarEvent } from '@/ui/icon';
import { Checkbox } from '@/ui/input/components/Checkbox';
import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
import {
PipelineProgress,
useUpdateOnePipelineProgressMutation,
} from '~/generated/graphql';
import { getLogoUrlFromDomainName } from '~/utils';
const StyledBoardCard = styled.div<{ selected: boolean }>`
background-color: ${({ theme, selected }) =>

8
front/src/modules/companies/components/CompanyEditableNameCell.tsx
View File

@ -1,14 +1,14 @@
import { useEffect, useState } from 'react';
import { CellCommentChip } from '@/comments/components/table/CellCommentChip';
import { useOpenTimelineRightDrawer } from '@/comments/hooks/useOpenTimelineRightDrawer';
import { EditableCellChip } from '@/ui/components/editable-cell/types/EditableChip';
import { getLogoUrlFromDomainName } from '@/utils/utils';
import { useOpenTimelineRightDrawer } from '@/activities/hooks/useOpenTimelineRightDrawer';
import { CellCommentChip } from '@/activities/table/components/CellCommentChip';
import { EditableCellChip } from '@/ui/table/editable-cell/types/EditableChip';
import {
CommentableType,
GetCompaniesQuery,
useUpdateCompanyMutation,
} from '~/generated/graphql';
import { getLogoUrlFromDomainName } from '~/utils';
import { CompanyChip } from './CompanyChip';

12
front/src/modules/companies/components/FilterDropdownCompanySearchSelect.tsx
View File

@ -1,9 +1,9 @@
import { FilterDropdownEntitySearchSelect } from '@/lib/filters-and-sorts/components/FilterDropdownEntitySearchSelect';
import { filterDropdownSearchInputScopedState } from '@/lib/filters-and-sorts/states/filterDropdownSearchInputScopedState';
import { filterDropdownSelectedEntityIdScopedState } from '@/lib/filters-and-sorts/states/filterDropdownSelectedEntityIdScopedState';
import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState';
import { useRecoilScopedValue } from '@/recoil-scope/hooks/useRecoilScopedValue';
import { TableContext } from '@/ui/tables/states/TableContext';
import { FilterDropdownEntitySearchSelect } from '@/ui/filter-n-sort/components/FilterDropdownEntitySearchSelect';
import { filterDropdownSearchInputScopedState } from '@/ui/filter-n-sort/states/filterDropdownSearchInputScopedState';
import { filterDropdownSelectedEntityIdScopedState } from '@/ui/filter-n-sort/states/filterDropdownSelectedEntityIdScopedState';
import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
import { useRecoilScopedValue } from '@/ui/recoil-scope/hooks/useRecoilScopedValue';
import { TableContext } from '@/ui/table/states/TableContext';
import { useFilteredSearchCompanyQuery } from '../queries';

138
front/src/modules/companies/components/HookCompanyBoard.tsx Normal file
View File

@ -0,0 +1,138 @@
import { useEffect } from 'react';
import { useRecoilCallback, useRecoilState } from 'recoil';
import { companyProgressesFamilyState } from '@/companies/states/companyProgressesFamilyState';
import {
CompanyForBoard,
CompanyProgress,
PipelineProgressForBoard,
} from '@/companies/types/CompanyProgress';
import { boardState } from '@/pipeline/states/boardState';
import { currentPipelineState } from '@/pipeline/states/currentPipelineState';
import { isBoardLoadedState } from '@/pipeline/states/isBoardLoadedState';
import { BoardPipelineStageColumn } from '@/ui/board/components/Board';
import {
Pipeline,
PipelineStage,
useGetCompaniesQuery,
useGetPipelineProgressQuery,
useGetPipelinesQuery,
} from '~/generated/graphql';
export function HookCompanyBoard() {
const [currentPipeline, setCurrentPipeline] =
useRecoilState(currentPipelineState);
const [, setBoard] = useRecoilState(boardState);
const [, setIsBoardLoaded] = useRecoilState(isBoardLoadedState);
useGetPipelinesQuery({
onCompleted: async (data) => {
const pipeline = data?.findManyPipeline[0] as Pipeline;
setCurrentPipeline(pipeline);
const pipelineStages = pipeline?.pipelineStages;
const orderedPipelineStages = pipelineStages
? [...pipelineStages].sort((a, b) => {
if (!a.index || !b.index) return 0;
return a.index - b.index;
})
: [];
const initialBoard: BoardPipelineStageColumn[] =
orderedPipelineStages?.map((pipelineStage) => ({
pipelineStageId: pipelineStage.id,
title: pipelineStage.name,
colorCode: pipelineStage.color,
index: pipelineStage.index || 0,
pipelineProgressIds:
pipelineStage.pipelineProgresses?.map(
(item) => item.id as string,
) || [],
})) || [];
setBoard(initialBoard);
setIsBoardLoaded(true);
},
});
const pipelineProgressIds = currentPipeline?.pipelineStages
?.map((pipelineStage: PipelineStage) =>
(
pipelineStage.pipelineProgresses?.map((item) => item.id as string) || []
).flat(),
)
.flat();
const pipelineProgressesQuery = useGetPipelineProgressQuery({
variables: {
where: {
id: { in: pipelineProgressIds },
},
},
});
const pipelineProgresses =
pipelineProgressesQuery.data?.findManyPipelineProgress || [];
const entitiesQueryResult = useGetCompaniesQuery({
variables: {
where: {
id: {
in: pipelineProgresses.map((item) => item.progressableId),
},
},
},
});
const indexCompanyByIdReducer = (
acc: { [key: string]: CompanyForBoard },
company: CompanyForBoard,
) => ({
...acc,
[company.id]: company,
});
const companiesDict =
entitiesQueryResult.data?.companies.reduce(
indexCompanyByIdReducer,
{} as { [key: string]: CompanyForBoard },
) || {};
const indexPipelineProgressByIdReducer = (
acc: {
[key: string]: CompanyProgress;
},
pipelineProgress: PipelineProgressForBoard,
) => {
const company = companiesDict[pipelineProgress.progressableId];
return {
...acc,
[pipelineProgress.id]: {
pipelineProgress,
company,
},
};
};
const companyBoardIndex = pipelineProgresses.reduce(
indexPipelineProgressByIdReducer,
{} as { [key: string]: CompanyProgress },
);
const synchronizeCompanyProgresses = useRecoilCallback(
({ set }) =>
(companyBoardIndex: { [key: string]: CompanyProgress }) => {
Object.entries(companyBoardIndex).forEach(([id, companyProgress]) => {
set(companyProgressesFamilyState(id), companyProgress);
});
},
[],
);
const loading =
entitiesQueryResult.loading || pipelineProgressesQuery.loading;
useEffect(() => {
!loading && synchronizeCompanyProgresses(companyBoardIndex);
}, [loading, companyBoardIndex, synchronizeCompanyProgresses]);
return <></>;
}

20
front/src/modules/companies/components/NewCompanyProgressButton.tsx
View File

@ -3,18 +3,18 @@ import { getOperationName } from '@apollo/client/utilities';
import { useRecoilState } from 'recoil';
import { v4 as uuidv4 } from 'uuid';
import { usePreviousHotkeyScope } from '@/lib/hotkeys/hooks/usePreviousHotkeyScope';
import { GET_PIPELINES } from '@/pipeline-progress/services';
import { BoardColumnContext } from '@/pipeline-progress/states/BoardColumnContext';
import { boardState } from '@/pipeline-progress/states/boardState';
import { currentPipelineState } from '@/pipeline-progress/states/currentPipelineState';
import { pipelineStageIdScopedState } from '@/pipeline-progress/states/pipelineStageIdScopedState';
import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState';
import { SingleEntitySelect } from '@/relation-picker/components/SingleEntitySelect';
import { relationPickerSearchFilterScopedState } from '@/relation-picker/states/relationPickerSearchFilterScopedState';
import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope';
import { GET_PIPELINES } from '@/pipeline/queries';
import { BoardColumnContext } from '@/pipeline/states/BoardColumnContext';
import { boardState } from '@/pipeline/states/boardState';
import { currentPipelineState } from '@/pipeline/states/currentPipelineState';
import { pipelineStageIdScopedState } from '@/pipeline/states/pipelineStageIdScopedState';
import { BoardPipelineStageColumn } from '@/ui/board/components/Board';
import { NewButton } from '@/ui/board/components/NewButton';
import { usePreviousHotkeyScope } from '@/ui/hotkey/hooks/usePreviousHotkeyScope';
import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
import { SingleEntitySelect } from '@/ui/relation-picker/components/SingleEntitySelect';
import { relationPickerSearchFilterScopedState } from '@/ui/relation-picker/states/relationPickerSearchFilterScopedState';
import { RelationPickerHotkeyScope } from '@/ui/relation-picker/types/RelationPickerHotkeyScope';
import {
PipelineProgressableType,
useCreateOnePipelineProgressMutation,

5
front/src/modules/companies/components/companyBoardOptions.tsx
View File

@ -1,8 +1,7 @@
import { CompanyBoardCard } from '@/companies/components/CompanyBoardCard';
import { NewCompanyProgressButton } from '@/companies/components/NewCompanyProgressButton';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { BoardOptions } from '../../pipeline-progress/types/BoardOptions';
import { BoardOptions } from '@/pipeline/types/BoardOptions';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
export const companyBoardOptions: BoardOptions = {
newCardComponent: (

13
front/src/modules/companies/fields/components/CompanyAccountOwnerEditableField.tsx → front/src/modules/companies/editable-field/components/CompanyAccountOwnerEditableField.tsx
View File

@ -1,12 +1,11 @@
import { IconUserCircle } from '@tabler/icons-react';
import { PersonChip } from '@/people/components/PersonChip';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope';
import { EditableField } from '@/ui/editable-fields/components/EditableField';
import { FieldContext } from '@/ui/editable-fields/states/FieldContext';
import { PageHotkeyScope } from '@/types/PageHotkeyScope';
import { EditableField } from '@/ui/editable-field/components/EditableField';
import { FieldContext } from '@/ui/editable-field/states/FieldContext';
import { IconUserCircle } from '@/ui/icon';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
import { RelationPickerHotkeyScope } from '@/ui/relation-picker/types/RelationPickerHotkeyScope';
import { Company, User } from '~/generated/graphql';
import { PageHotkeyScope } from '~/sync-hooks/types/PageHotkeyScope';
import { CompanyAccountOwnerPickerFieldEditMode } from './CompanyAccountOwnerPickerFieldEditMode';

4
front/src/modules/companies/fields/components/CompanyAccountOwnerPickerFieldEditMode.tsx → front/src/modules/companies/editable-field/components/CompanyAccountOwnerPickerFieldEditMode.tsx
View File

@ -1,8 +1,8 @@
import styled from '@emotion/styled';
import { CompanyAccountOwnerPicker } from '@/companies/components/CompanyAccountOwnerPicker';
import { HotkeyScope } from '@/lib/hotkeys/types/HotkeyScope';
import { useEditableField } from '@/ui/editable-fields/hooks/useEditableField';
import { useEditableField } from '@/ui/editable-field/hooks/useEditableField';
import { HotkeyScope } from '@/ui/hotkey/types/HotkeyScope';
import { Company, User } from '~/generated/graphql';
const CompanyAccountOwnerPickerContainer = styled.div`

10
front/src/modules/companies/fields/components/CompanyAddressEditableField.tsx → front/src/modules/companies/editable-field/components/CompanyAddressEditableField.tsx
View File

@ -1,10 +1,10 @@
import { useEffect, useState } from 'react';
import { IconMap } from '@tabler/icons-react';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { EditableField } from '@/ui/editable-fields/components/EditableField';
import { FieldContext } from '@/ui/editable-fields/states/FieldContext';
import { InplaceInputText } from '@/ui/inplace-inputs/components/InplaceInputText';
import { EditableField } from '@/ui/editable-field/components/EditableField';
import { FieldContext } from '@/ui/editable-field/states/FieldContext';
import { IconMap } from '@/ui/icon';
import { InplaceInputText } from '@/ui/inplace-input/components/InplaceInputText';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
import { Company, useUpdateCompanyMutation } from '~/generated/graphql';
type OwnProps = {

14
front/src/modules/companies/fields/components/CompanyCreatedAtEditableField.tsx → front/src/modules/companies/editable-field/components/CompanyCreatedAtEditableField.tsx
View File

@ -1,13 +1,13 @@
import { useEffect, useState } from 'react';
import { IconCalendar } from '@tabler/icons-react';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { EditableField } from '@/ui/editable-fields/components/EditableField';
import { FieldContext } from '@/ui/editable-fields/states/FieldContext';
import { EditableFieldEditModeDate } from '@/ui/editable-fields/variants/components/EditableFieldEditModeDate';
import { parseDate } from '@/utils/datetime/date-utils';
import { formatToHumanReadableDate } from '@/utils/utils';
import { EditableField } from '@/ui/editable-field/components/EditableField';
import { FieldContext } from '@/ui/editable-field/states/FieldContext';
import { EditableFieldEditModeDate } from '@/ui/editable-field/variants/components/EditableFieldEditModeDate';
import { IconCalendar } from '@/ui/icon';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
import { Company, useUpdateCompanyMutation } from '~/generated/graphql';
import { formatToHumanReadableDate } from '~/utils';
import { parseDate } from '~/utils/date-utils';
type OwnProps = {
company: Pick<Company, 'id' | 'createdAt'>;

12
front/src/modules/companies/fields/components/CompanyDomainNameEditableField.tsx → front/src/modules/companies/editable-field/components/CompanyDomainNameEditableField.tsx
View File

@ -1,11 +1,11 @@
import { useEffect, useState } from 'react';
import { IconLink } from '@tabler/icons-react';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { EditableField } from '@/ui/editable-fields/components/EditableField';
import { FieldDisplayURL } from '@/ui/editable-fields/components/FieldDisplayURL';
import { FieldContext } from '@/ui/editable-fields/states/FieldContext';
import { InplaceInputText } from '@/ui/inplace-inputs/components/InplaceInputText';
import { EditableField } from '@/ui/editable-field/components/EditableField';
import { FieldDisplayURL } from '@/ui/editable-field/components/FieldDisplayURL';
import { FieldContext } from '@/ui/editable-field/states/FieldContext';
import { IconLink } from '@/ui/icon';
import { InplaceInputText } from '@/ui/inplace-input/components/InplaceInputText';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
import { Company, useUpdateCompanyMutation } from '~/generated/graphql';
type OwnProps = {

10
front/src/modules/companies/fields/components/CompanyEmployeesEditableField.tsx → front/src/modules/companies/editable-field/components/CompanyEmployeesEditableField.tsx
View File

@ -1,10 +1,10 @@
import { useEffect, useState } from 'react';
import { IconUsers } from '@tabler/icons-react';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { EditableField } from '@/ui/editable-fields/components/EditableField';
import { FieldContext } from '@/ui/editable-fields/states/FieldContext';
import { InplaceInputText } from '@/ui/inplace-inputs/components/InplaceInputText';
import { EditableField } from '@/ui/editable-field/components/EditableField';
import { FieldContext } from '@/ui/editable-field/states/FieldContext';
import { IconUsers } from '@/ui/icon';
import { InplaceInputText } from '@/ui/inplace-input/components/InplaceInputText';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
import { Company, useUpdateCompanyMutation } from '~/generated/graphql';
type OwnProps = {

2
front/src/modules/companies/queries/__tests__/select.test.ts
View File

@ -1,4 +1,4 @@
import { reduceSortsToOrderBy } from '@/lib/filters-and-sorts/helpers';
import { reduceSortsToOrderBy } from '@/ui/filter-n-sort/helpers';
import { CompaniesSelectedSortType } from '../select';

6
front/src/modules/companies/queries/select.ts
View File

@ -1,9 +1,8 @@
import { gql } from '@apollo/client';
import { CommentableEntityForSelect } from '@/comments/types/CommentableEntityForSelect';
import { SelectedSortType } from '@/lib/filters-and-sorts/interfaces/sorts/interface';
import { CommentableEntityForSelect } from '@/activities/types/CommentableEntityForSelect';
import { useFilteredSearchEntityQuery } from '@/search/hooks/useFilteredSearchEntityQuery';
import { getLogoUrlFromDomainName } from '@/utils/utils';
import { SelectedSortType } from '@/ui/filter-n-sort/types/interface';
import {
CommentableType,
CompanyOrderByWithRelationInput as Companies_Order_By,
@ -12,6 +11,7 @@ import {
useGetCompaniesQuery,
useSearchCompanyQuery,
} from '~/generated/graphql';
import { getLogoUrlFromDomainName } from '~/utils';
export type CompaniesSelectedSortType = SelectedSortType<Companies_Order_By>;

4
front/src/modules/companies/table/components/CompanyEntityTableData.tsx
View File

@ -1,8 +1,8 @@
import { useRecoilState } from 'recoil';
import { defaultOrderBy } from '@/companies/queries';
import { isFetchingEntityTableDataState } from '@/ui/tables/states/isFetchingEntityTableDataState';
import { tableRowIdsState } from '@/ui/tables/states/tableRowIdsState';
import { isFetchingEntityTableDataState } from '@/ui/table/states/isFetchingEntityTableDataState';
import { tableRowIdsState } from '@/ui/table/states/tableRowIdsState';
import {
PersonOrderByWithRelationInput,
useGetCompaniesQuery,

4
front/src/modules/companies/table/components/CompanyEntityTableDataMocked.tsx
View File

@ -1,8 +1,8 @@
import { useEffect } from 'react';
import { useRecoilState } from 'recoil';
import { isFetchingEntityTableDataState } from '@/ui/tables/states/isFetchingEntityTableDataState';
import { tableRowIdsState } from '@/ui/tables/states/tableRowIdsState';
import { isFetchingEntityTableDataState } from '@/ui/table/states/isFetchingEntityTableDataState';
import { tableRowIdsState } from '@/ui/table/states/tableRowIdsState';
import { mockedCompaniesData } from '~/testing/mock-data/companies';
import { useSetCompanyEntityTable } from '../hooks/useSetCompanyEntityTable';

48
front/src/modules/companies/table/components/CompanyTable.tsx Normal file
View File

@ -0,0 +1,48 @@
import { useCallback, useMemo, useState } from 'react';
import { CompaniesSelectedSortType, defaultOrderBy } from '@/companies/queries';
import { companyColumns } from '@/companies/table/components/companyColumns';
import { CompanyEntityTableData } from '@/companies/table/components/CompanyEntityTableData';
import { reduceSortsToOrderBy } from '@/ui/filter-n-sort/helpers';
import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
import { turnFilterIntoWhereClause } from '@/ui/filter-n-sort/utils/turnFilterIntoWhereClause';
import { IconList } from '@/ui/icon';
import { useRecoilScopedValue } from '@/ui/recoil-scope/hooks/useRecoilScopedValue';
import { EntityTable } from '@/ui/table/components/EntityTable';
import { HooksEntityTable } from '@/ui/table/components/HooksEntityTable';
import { TableContext } from '@/ui/table/states/TableContext';
import { CompanyOrderByWithRelationInput } from '~/generated/graphql';
import { companiesFilters } from '~/pages/companies/companies-filters';
import { availableSorts } from '~/pages/companies/companies-sorts';
export function CompanyTable() {
const [orderBy, setOrderBy] =
useState<CompanyOrderByWithRelationInput[]>(defaultOrderBy);
const updateSorts = useCallback((sorts: Array<CompaniesSelectedSortType>) => {
setOrderBy(sorts.length ? reduceSortsToOrderBy(sorts) : defaultOrderBy);
}, []);
const filters = useRecoilScopedValue(filtersScopedState, TableContext);
const whereFilters = useMemo(() => {
return { AND: filters.map(turnFilterIntoWhereClause) };
}, [filters]) as any;
return (
<>
<CompanyEntityTableData orderBy={orderBy} whereFilters={whereFilters} />
<HooksEntityTable
numberOfColumns={companyColumns.length}
availableFilters={companiesFilters}
/>
<EntityTable
columns={companyColumns}
viewName="All Companies"
viewIcon={<IconList size={16} />}
availableSorts={availableSorts}
onSortsUpdate={updateSorts}
/>
</>
);
}

25
front/src/modules/companies/table/components/CompanyTableMockMode.tsx Normal file
View File

@ -0,0 +1,25 @@
import { companyColumns } from '@/companies/table/components/companyColumns';
import { CompanyEntityTableDataMocked } from '@/companies/table/components/CompanyEntityTableDataMocked';
import { IconList } from '@/ui/icon';
import { EntityTable } from '@/ui/table/components/EntityTable';
import { HooksEntityTable } from '@/ui/table/components/HooksEntityTable';
import { companiesFilters } from '~/pages/companies/companies-filters';
import { availableSorts } from '~/pages/companies/companies-sorts';
export function CompanyTableMockMode() {
return (
<>
<CompanyEntityTableDataMocked />
<HooksEntityTable
numberOfColumns={companyColumns.length}
availableFilters={companiesFilters}
/>
<EntityTable
columns={companyColumns}
viewName="All Companies"
viewIcon={<IconList size={16} />}
availableSorts={availableSorts}
/>
</>
);
}

2
front/src/modules/companies/table/components/EditableCompanyAccountOwnerCell.tsx
View File

@ -2,7 +2,7 @@ import { useRecoilValue } from 'recoil';
import { CompanyAccountOwnerCell } from '@/companies/components/CompanyAccountOwnerCell';
import { companyAccountOwnerFamilyState } from '@/companies/states/companyAccountOwnerFamilyState';
import { useCurrentRowEntityId } from '@/ui/tables/hooks/useCurrentEntityId';
import { useCurrentRowEntityId } from '@/ui/table/hooks/useCurrentEntityId';
export function EditableCompanyAccountOwnerCell() {
const currentRowEntityId = useCurrentRowEntityId();

4
front/src/modules/companies/table/components/EditableCompanyAddressCell.tsx
View File

@ -2,8 +2,8 @@ import { useEffect, useState } from 'react';
import { useRecoilValue } from 'recoil';
import { companyAddressFamilyState } from '@/companies/states/companyAddressFamilyState';
import { EditableCellText } from '@/ui/components/editable-cell/types/EditableCellText';
import { useCurrentRowEntityId } from '@/ui/tables/hooks/useCurrentEntityId';
import { EditableCellText } from '@/ui/table/editable-cell/types/EditableCellText';
import { useCurrentRowEntityId } from '@/ui/table/hooks/useCurrentEntityId';
import { useUpdateCompanyMutation } from '~/generated/graphql';
export function EditableCompanyAddressCell() {

4
front/src/modules/companies/table/components/EditableCompanyCreatedAtCell.tsx
View File

@ -2,8 +2,8 @@ import { DateTime } from 'luxon';
import { useRecoilValue } from 'recoil';
import { companyCreatedAtFamilyState } from '@/companies/states/companyCreatedAtFamilyState';
import { EditableCellDate } from '@/ui/components/editable-cell/types/EditableCellDate';
import { useCurrentRowEntityId } from '@/ui/tables/hooks/useCurrentEntityId';
import { EditableCellDate } from '@/ui/table/editable-cell/types/EditableCellDate';
import { useCurrentRowEntityId } from '@/ui/table/hooks/useCurrentEntityId';
import { useUpdateCompanyMutation } from '~/generated/graphql';
export function EditableCompanyCreatedAtCell() {

4
front/src/modules/companies/table/components/EditableCompanyDomainNameCell.tsx
View File

@ -2,8 +2,8 @@ import { useEffect, useState } from 'react';
import { useRecoilValue } from 'recoil';
import { companyDomainNameFamilyState } from '@/companies/states/companyDomainNameFamilyState';
import { EditableCellText } from '@/ui/components/editable-cell/types/EditableCellText';
import { useCurrentRowEntityId } from '@/ui/tables/hooks/useCurrentEntityId';
import { EditableCellText } from '@/ui/table/editable-cell/types/EditableCellText';
import { useCurrentRowEntityId } from '@/ui/table/hooks/useCurrentEntityId';
import { useUpdateCompanyMutation } from '~/generated/graphql';
export function EditableCompanyDomainNameCell() {

4
front/src/modules/companies/table/components/EditableCompanyEmployeesCell.tsx
View File

@ -2,8 +2,8 @@ import { useEffect, useState } from 'react';
import { useRecoilValue } from 'recoil';
import { companyEmployeesFamilyState } from '@/companies/states/companyEmployeesFamilyState';
import { EditableCellText } from '@/ui/components/editable-cell/types/EditableCellText';
import { useCurrentRowEntityId } from '@/ui/tables/hooks/useCurrentEntityId';
import { EditableCellText } from '@/ui/table/editable-cell/types/EditableCellText';
import { useCurrentRowEntityId } from '@/ui/table/hooks/useCurrentEntityId';
import { useUpdateCompanyMutation } from '~/generated/graphql';
export function EditableCompanyEmployeesCell() {

2
front/src/modules/companies/table/components/EditableCompanyNameCell.tsx
View File

@ -4,7 +4,7 @@ import { CompanyEditableNameChipCell } from '@/companies/components/CompanyEdita
import { companyCommentCountFamilyState } from '@/companies/states/companyCommentCountFamilyState';
import { companyDomainNameFamilyState } from '@/companies/states/companyDomainNameFamilyState';
import { companyNameFamilyState } from '@/companies/states/companyNameFamilyState';
import { useCurrentRowEntityId } from '@/ui/tables/hooks/useCurrentEntityId';
import { useCurrentRowEntityId } from '@/ui/table/hooks/useCurrentEntityId';
export function EditableCompanyNameCell() {
const currentRowEntityId = useCurrentRowEntityId();

14
front/src/modules/companies/table/components/TableActionBarButtonCreateCommentThreadCompany.tsx Normal file
View File

@ -0,0 +1,14 @@
import { useOpenCreateCommentThreadDrawerForSelectedRowIds } from '@/activities/hooks/useOpenCreateCommentDrawerForSelectedRowIds';
import { TableActionBarButtonToggleComments } from '@/ui/table/action-bar/components/TableActionBarButtonOpenComments';
import { CommentableType } from '~/generated/graphql';
export function TableActionBarButtonCreateCommentThreadCompany() {
const openCreateCommentThreadRightDrawer =
useOpenCreateCommentThreadDrawerForSelectedRowIds();
async function handleButtonClick() {
openCreateCommentThreadRightDrawer(CommentableType.Company);
}
return <TableActionBarButtonToggleComments onClick={handleButtonClick} />;
}

40
front/src/modules/companies/table/components/TableActionBarButtonDeleteCompanies.tsx Normal file
View File

@ -0,0 +1,40 @@
import { getOperationName } from '@apollo/client/utilities';
import { useRecoilValue } from 'recoil';
import { GET_COMPANIES } from '@/companies/queries';
import { IconTrash } from '@/ui/icon/index';
import { EntityTableActionBarButton } from '@/ui/table/action-bar/components/EntityTableActionBarButton';
import { useResetTableRowSelection } from '@/ui/table/hooks/useResetTableRowSelection';
import { selectedRowIdsSelector } from '@/ui/table/states/selectedRowIdsSelector';
import { useDeleteCompaniesMutation } from '~/generated/graphql';
export function TableActionBarButtonDeleteCompanies() {
const selectedRowIds = useRecoilValue(selectedRowIdsSelector);
const resetRowSelection = useResetTableRowSelection();
const [deleteCompanies] = useDeleteCompaniesMutation({
refetchQueries: [getOperationName(GET_COMPANIES) ?? ''],
});
async function handleDeleteClick() {
const rowIdsToDelete = selectedRowIds;
resetRowSelection();
await deleteCompanies({
variables: {
ids: rowIdsToDelete,
},
});
}
return (
<EntityTableActionBarButton
label="Delete"
icon={<IconTrash size={16} />}
type="warning"
onClick={handleDeleteClick}
/>
);
}

2
front/src/modules/companies/table/components/companyColumns.tsx
View File

@ -6,7 +6,7 @@ import {
IconMap,
IconUser,
IconUsers,
} from '@/ui/icons/index';
} from '@/ui/icon/index';
import { EditableCompanyAccountOwnerCell } from './EditableCompanyAccountOwnerCell';
import { EditableCompanyAddressCell } from './EditableCompanyAddressCell';