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

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

@ -1,19 +1,23 @@
import { getOperationName } from '@apollo/client/utilities';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { v4 as uuidv4 } from 'uuid';
import { GET_PEOPLE } from '@/people/services';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { EntityTableActionBar } from '@/ui/components/table/action-bar/EntityTableActionBar';
import { IconBuildingSkyscraper } from '@/ui/icons/index';
import { FlexExpandingContainer } from '@/ui/layout/containers/FlexExpandingContainer';
import { WithTopBarContainer } from '@/ui/layout/containers/WithTopBarContainer';
import { TableContext } from '@/ui/tables/states/TableContext';
import { GET_PEOPLE } from '@/people/queries';
import { PeopleTable } from '@/people/table/components/PeopleTable';
import { TableActionBarButtonCreateCommentThreadPeople } from '@/people/table/components/TableActionBarButtonCreateCommentThreadPeople';
import { TableActionBarButtonDeletePeople } from '@/people/table/components/TableActionBarButtonDeletePeople';
import { IconBuildingSkyscraper } from '@/ui/icon';
import { WithTopBarContainer } from '@/ui/layout/components/WithTopBarContainer';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
import { EntityTableActionBar } from '@/ui/table/action-bar/components/EntityTableActionBar';
import { TableContext } from '@/ui/table/states/TableContext';
import { useInsertPersonMutation } from '~/generated/graphql';
import { TableActionBarButtonCreateCommentThreadPeople } from './table/TableActionBarButtonCreateCommentThreadPeople';
import { TableActionBarButtonDeletePeople } from './table/TableActionBarButtonDeletePeople';
import { PeopleTable } from './PeopleTable';
const StyledTableContainer = styled.div`
display: flex;
width: 100%;
`;
export function People() {
const [insertPersonMutation] = useInsertPersonMutation();
@ -42,9 +46,9 @@ export function People() {
icon={<IconBuildingSkyscraper size={theme.icon.size.md} />}
onAddButtonClick={handleAddButtonClick}
>
<FlexExpandingContainer>
<StyledTableContainer>
<PeopleTable />
</FlexExpandingContainer>
</StyledTableContainer>
<EntityTableActionBar>
<TableActionBarButtonCreateCommentThreadPeople />
<TableActionBarButtonDeletePeople />

50
front/src/pages/people/PeopleTable.tsx
View File

@ -1,50 +0,0 @@
import { useCallback, useMemo, useState } from 'react';
import { IconList } from '@tabler/icons-react';
import { defaultOrderBy } from '@/companies/queries';
import { reduceSortsToOrderBy } from '@/lib/filters-and-sorts/helpers';
import { filtersScopedState } from '@/lib/filters-and-sorts/states/filtersScopedState';
import { turnFilterIntoWhereClause } from '@/lib/filters-and-sorts/utils/turnFilterIntoWhereClause';
import { PeopleEntityTableData } from '@/people/components/PeopleEntityTableData';
import { PeopleSelectedSortType } from '@/people/services';
import { peopleColumns } from '@/people/table/components/peopleColumns';
import { useRecoilScopedValue } from '@/recoil-scope/hooks/useRecoilScopedValue';
import { EntityTable } from '@/ui/components/table/EntityTable';
import { HooksEntityTable } from '@/ui/components/table/HooksEntityTable';
import { TableContext } from '@/ui/tables/states/TableContext';
import { PersonOrderByWithRelationInput } from '~/generated/graphql';
import { peopleFilters } from './people-filters';
import { availableSorts } from './people-sorts';
export function PeopleTable() {
const [orderBy, setOrderBy] =
useState<PersonOrderByWithRelationInput[]>(defaultOrderBy);
const updateSorts = useCallback((sorts: Array<PeopleSelectedSortType>) => {
setOrderBy(sorts.length ? reduceSortsToOrderBy(sorts) : defaultOrderBy);
}, []);
const filters = useRecoilScopedValue(filtersScopedState, TableContext);
const whereFilters = useMemo(() => {
return { AND: filters.map(turnFilterIntoWhereClause) };
}, [filters]) as any;
return (
<>
<PeopleEntityTableData orderBy={orderBy} whereFilters={whereFilters} />
<HooksEntityTable
numberOfColumns={peopleColumns.length}
availableFilters={peopleFilters}
/>
<EntityTable
columns={peopleColumns}
viewName="All People"
viewIcon={<IconList size={16} />}
availableSorts={availableSorts}
onSortsUpdate={updateSorts}
/>
</>
);
}

18
front/src/pages/people/PersonShow.tsx
View File

@ -1,15 +1,15 @@
import { useParams } from 'react-router-dom';
import { useTheme } from '@emotion/react';
import { Timeline } from '@/comments/components/timeline/Timeline';
import { usePersonQuery } from '@/people/services';
import { PropertyBox } from '@/ui/components/property-box/PropertyBox';
import { PropertyBoxItem } from '@/ui/components/property-box/PropertyBoxItem';
import { IconLink, IconUser } from '@/ui/icons/index';
import { WithTopBarContainer } from '@/ui/layout/containers/WithTopBarContainer';
import { ShowPageLeftContainer } from '@/ui/layout/show-page/containers/ShowPageLeftContainer';
import { ShowPageRightContainer } from '@/ui/layout/show-page/containers/ShowPageRightContainer';
import { ShowPageSummaryCard } from '@/ui/layout/show-page/ShowPageSummaryCard';
import { Timeline } from '@/activities/timeline/components/Timeline';
import { usePersonQuery } from '@/people/queries';
import { PropertyBox } from '@/ui/editable-field/property-box/components/PropertyBox';
import { PropertyBoxItem } from '@/ui/editable-field/property-box/components/PropertyBoxItem';
import { IconLink, IconUser } from '@/ui/icon';
import { WithTopBarContainer } from '@/ui/layout/components/WithTopBarContainer';
import { ShowPageLeftContainer } from '@/ui/layout/show-page/components/ShowPageLeftContainer';
import { ShowPageRightContainer } from '@/ui/layout/show-page/components/ShowPageRightContainer';
import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSummaryCard';
import { CommentableType } from '~/generated/graphql';
export function PersonShow() {

4
front/src/pages/people/__stories__/People.inputs.stories.tsx
View File

@ -4,8 +4,8 @@ import type { Meta } from '@storybook/react';
import { userEvent, within } from '@storybook/testing-library';
import { graphql } from 'msw';
import { UPDATE_PERSON } from '@/people/services';
import { SEARCH_COMPANY_QUERY } from '@/search/services/search';
import { UPDATE_PERSON } from '@/people/queries';
import { SEARCH_COMPANY_QUERY } from '@/search/queries/search';
import { Company } from '~/generated/graphql';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { fetchOneFromData } from '~/testing/mock-data';

4
front/src/pages/people/people-filters.tsx
View File

@ -1,5 +1,5 @@
import { FilterDropdownCompanySearchSelect } from '@/companies/components/FilterDropdownCompanySearchSelect';
import { FilterDefinitionByEntity } from '@/lib/filters-and-sorts/types/FilterDefinitionByEntity';
import { FilterDefinitionByEntity } from '@/ui/filter-n-sort/types/FilterDefinitionByEntity';
import {
IconBuildingSkyscraper,
IconCalendarEvent,
@ -7,7 +7,7 @@ import {
IconMap,
IconPhone,
IconUser,
} from '@/ui/icons/index';
} from '@/ui/icon/index';
import { icon } from '@/ui/themes/icon';
import { Person } from '~/generated/graphql';

4
front/src/pages/people/people-sorts.tsx
View File

@ -1,4 +1,4 @@
import { SortType } from '@/lib/filters-and-sorts/interfaces/sorts/interface';
import { SortType } from '@/ui/filter-n-sort/types/interface';
import {
IconBuildingSkyscraper,
IconCalendarEvent,
@ -6,7 +6,7 @@ import {
IconMap,
IconPhone,
IconUser,
} from '@/ui/icons/index';
} from '@/ui/icon/index';
import {
PersonOrderByWithRelationInput as People_Order_By,
SortOrder as Order_By,

14
front/src/pages/people/table/TableActionBarButtonCreateCommentThreadPeople.tsx
View File

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

40
front/src/pages/people/table/TableActionBarButtonDeletePeople.tsx
View File

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