Fix/table rerenders (#609)

* Fixed top bar rerenders

* Fixed rerender on editable cell

* Fix lint

* asd

* Fix

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Lucas Bordeau
2023-07-12 05:51:24 +02:00
committed by GitHub
parent b5de2abd48
commit 5e0e449e4c
17 changed files with 211 additions and 126 deletions

View File

@ -1,12 +1,12 @@
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 { 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 { useInsertPersonMutation } from '~/generated/graphql';
@ -15,12 +15,6 @@ import { TableActionBarButtonCreateCommentThreadPeople } from './table/TableActi
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();
@ -42,20 +36,20 @@ export function People() {
const theme = useTheme();
return (
<WithTopBarContainer
title="People"
icon={<IconUser size={theme.icon.size.md} />}
onAddButtonClick={handleAddButtonClick}
>
<RecoilScope SpecificContext={TableContext}>
<StyledPeopleContainer>
<RecoilScope SpecificContext={TableContext}>
<WithTopBarContainer
title="Companies"
icon={<IconBuildingSkyscraper size={theme.icon.size.md} />}
onAddButtonClick={handleAddButtonClick}
>
<FlexExpandingContainer>
<PeopleTable />
</StyledPeopleContainer>
</FlexExpandingContainer>
<EntityTableActionBar>
<TableActionBarButtonCreateCommentThreadPeople />
<TableActionBarButtonDeletePeople />
</EntityTableActionBar>
</RecoilScope>
</WithTopBarContainer>
</WithTopBarContainer>
</RecoilScope>
);
}