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

Fix drag-performance (#1184)

Browse Source 
* Fix drag-performance

* Fixes

* Fixes

* Fixes

* Fixes
This commit is contained in:
Charles Bochet
2023-08-13 05:28:33 +02:00
committed by GitHub
parent bf09a4d6a2
commit e6b20b5ff2
25 changed files with 260 additions and 175 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -2,8 +2,8 @@ import { ReactNode, useContext } from 'react';
import styled from '@emotion/styled';
import { useRecoilState, useRecoilValue } from 'recoil';
import { useCurrentCardSelected } from '@/ui/board/hooks/useCurrentCardSelected';
import { BoardCardIdContext } from '@/ui/board/states/BoardCardIdContext';
import { selectedBoardCardIdsState } from '@/ui/board/states/selectedBoardCardIdsState';
import { viewFieldsDefinitionsState } from '@/ui/board/states/viewFieldsDefinitionsState';
import { EntityChipVariant } from '@/ui/chip/components/EntityChip';
import { GenericEditableField } from '@/ui/editable-field/components/GenericEditableField';
@ -102,6 +102,8 @@ const StyledFieldContainer = styled.div`
`;
export function CompanyBoardCard() {
const { currentCardSelected, setCurrentCardSelected } =
useCurrentCardSelected();
const boardCardId = useContext(BoardCardIdContext);
const [companyProgress] = useRecoilState(
@ -109,23 +111,8 @@ export function CompanyBoardCard() {
);
const { pipelineProgress, company } = companyProgress ?? {};
const [selectedBoardCards, setSelectedBoardCards] = useRecoilState(
selectedBoardCardIdsState,
);
const viewFieldsDefinitions = useRecoilValue(viewFieldsDefinitionsState);
const selected = selectedBoardCards.includes(boardCardId ?? '');
function setSelected(isSelected: boolean) {
if (isSelected) {
setSelectedBoardCards([...selectedBoardCards, boardCardId ?? '']);
} else {
setSelectedBoardCards(
selectedBoardCards.filter((id) => id !== boardCardId),
);
}
}
// boardCardId check can be moved to a wrapper to avoid unnecessary logic above
if (!company || !pipelineProgress || !boardCardId) {
return null;
@ -150,8 +137,8 @@ export function CompanyBoardCard() {
return (
<StyledBoardCardWrapper>
<StyledBoardCard
selected={selected}
onClick={() => setSelected(!selected)}
selected={currentCardSelected}
onClick={() => setCurrentCardSelected(!currentCardSelected)}
>
<StyledBoardCardHeader>
<CompanyChip
@ -162,8 +149,8 @@ export function CompanyBoardCard() {
/>
<StyledCheckboxContainer className="checkbox-container">
<Checkbox
checked={selected}
onChange={() => setSelected(!selected)}
checked={currentCardSelected}
onChange={() => setCurrentCardSelected(!currentCardSelected)}
variant={CheckboxVariant.Secondary}
/>
</StyledCheckboxContainer>

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

@ -4,8 +4,10 @@ import { useRecoilState, useSetRecoilState } from 'recoil';
import { pipelineViewFields } from '@/pipeline/constants/pipelineViewFields';
import { isBoardLoadedState } from '@/ui/board/states/isBoardLoadedState';
import { viewFieldsDefinitionsState } from '@/ui/board/states/viewFieldsDefinitionsState';
import { availableFiltersScopedState } from '@/ui/filter-n-sort/states/availableFiltersScopedState';
import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
import { turnFilterIntoWhereClause } from '@/ui/filter-n-sort/utils/turnFilterIntoWhereClause';
import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
import {
PipelineProgressableType,
@ -17,6 +19,7 @@ import {
useGetPipelineProgressQuery,
useGetPipelinesQuery,
} from '~/generated/graphql';
import { opportunitiesBoardOptions } from '~/pages/opportunities/opportunitiesBoardOptions';
import { useUpdateCompanyBoardCardIds } from '../hooks/useUpdateBoardCardIds';
import { useUpdateCompanyBoard } from '../hooks/useUpdateCompanyBoardColumns';
@ -30,8 +33,13 @@ export function HooksCompanyBoard({
const setFieldsDefinitionsState = useSetRecoilState(
viewFieldsDefinitionsState,
);
const [, setAvailableFilters] = useRecoilScopedState(
availableFiltersScopedState,
CompanyBoardContext,
);
useEffect(() => {
setAvailableFilters(opportunitiesBoardOptions.filters);
setFieldsDefinitionsState(pipelineViewFields);
});