820ef184d3
* wip * - Added scopes on useHotkeys - Use new EditableCellV2 - Implemented Recoil Scoped State with specific context - Implemented soft focus position - Factorized open/close editable cell - Removed editable relation old components - Broke down entity table into multiple components - Added Recoil Scope by CellContext - Added Recoil Scope by RowContext * First working version * Use a new EditableCellSoftFocusMode * Fixes * wip * wip * wip * Use company filters * Refactored FilterDropdown into multiple components * Refactored entity search select in dropdown * Renamed states * Fixed people filters * Removed unused code * Cleaned states * Cleaned state * Better naming * fixed rebase * Fix * Fixed stories and mocked data and displayName bug * Fixed cancel sort * Fixed naming * Fixed dropdown height * Fix * Fixed lint
62 lines
1.9 KiB
TypeScript
62 lines
1.9 KiB
TypeScript
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 { IconUser } from '@/ui/icons/index';
|
|
import { WithTopBarContainer } from '@/ui/layout/containers/WithTopBarContainer';
|
|
import { TableContext } from '@/ui/tables/states/TableContext';
|
|
import { useInsertPersonMutation } from '~/generated/graphql';
|
|
|
|
import { TableActionBarButtonCreateCommentThreadPeople } from './table/TableActionBarButtonCreateCommentThreadPeople';
|
|
import { TableActionBarButtonDeletePeople } from './table/TableActionBarButtonDeletePeople';
|
|
import { PeopleTable } from './PeopleTable';
|
|
|
|
const StyledPeopleContainer = styled.div`
|
|
display: flex;
|
|
height: 100%;
|
|
width: 100%;
|
|
`;
|
|
|
|
export function People() {
|
|
const [insertPersonMutation] = useInsertPersonMutation();
|
|
|
|
async function handleAddButtonClick() {
|
|
await insertPersonMutation({
|
|
variables: {
|
|
id: uuidv4(),
|
|
firstName: '',
|
|
lastName: '',
|
|
email: '',
|
|
phone: '',
|
|
createdAt: new Date().toISOString(),
|
|
city: '',
|
|
},
|
|
refetchQueries: [getOperationName(GET_PEOPLE) ?? ''],
|
|
});
|
|
}
|
|
|
|
const theme = useTheme();
|
|
|
|
return (
|
|
<WithTopBarContainer
|
|
title="People"
|
|
icon={<IconUser size={theme.icon.size.md} />}
|
|
onAddButtonClick={handleAddButtonClick}
|
|
>
|
|
<RecoilScope SpecificContext={TableContext}>
|
|
<StyledPeopleContainer>
|
|
<PeopleTable />
|
|
</StyledPeopleContainer>
|
|
<EntityTableActionBar>
|
|
<TableActionBarButtonCreateCommentThreadPeople />
|
|
<TableActionBarButtonDeletePeople />
|
|
</EntityTableActionBar>
|
|
</RecoilScope>
|
|
</WithTopBarContainer>
|
|
);
|
|
}
|