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

Add optimistic rendering for table relations (#1296)

Browse Source 
* Add optimistic rendering for table relations

* fix pr

* fix pr

* fix pr

* Fix PR

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Emilien Chauvet
2023-08-24 17:29:26 +02:00
committed by GitHub
parent 00f1d2b739
commit 615018654a
4 changed files with 74 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
front/src/modules/companies/components/CompanyPickerCell.tsx
View File

@ -12,12 +12,16 @@ import { useInsertOneCompanyMutation } from '~/generated/graphql';
export type OwnProps = {
companyId: string | null;
onSubmit: (newCompany: EntityForSelect | null) => void;
onSubmit: (newCompany: CompanyPickerSelectedCompany | null) => void;
onCancel?: () => void;
createModeEnabled?: boolean;
width?: number;
};
export type CompanyPickerSelectedCompany = EntityForSelect & {
domainName: string;
};
export function CompanyPickerCell({
companyId,
onSubmit,
@ -42,10 +46,10 @@ export function CompanyPickerCell({
selectedIds: [companyId ?? ''],
});
async function handleEntitySelected(
entity: EntityForSelect | null | undefined,
async function handleCompanySelected(
company: CompanyPickerSelectedCompany | null | undefined,
) {
onSubmit(entity ?? null);
onSubmit(company ?? null);
}
function handleStartCreation() {
@ -69,6 +73,7 @@ export function CompanyPickerCell({
id: companyCreated.id,
name: companyCreated.name,
entityType: Entity.Company,
domainName: companyCreated.domainName,
});
setIsCreating(false);
}
@ -86,7 +91,7 @@ export function CompanyPickerCell({
width={width}
onCreate={createModeEnabled ? handleStartCreation : undefined}
onCancel={onCancel}
onEntitySelected={handleEntitySelected}
onEntitySelected={handleCompanySelected}
entities={{
entitiesToSelect: companies.entitiesToSelect,
selectedEntity: companies.selectedEntities[0],

17
front/src/modules/companies/hooks/useFilteredSearchCompanyQuery.ts
View File

@ -1,5 +1,4 @@
import { ActivityTargetableEntityType } from '@/activities/types/ActivityTargetableEntity';
import { ActivityTargetableEntityForSelect } from '@/activities/types/ActivityTargetableEntityForSelect';
import { useFilteredSearchEntityQuery } from '@/search/hooks/useFilteredSearchEntityQuery';
import { useSearchCompanyQuery } from '~/generated/graphql';
import { getLogoUrlFromDomainName } from '~/utils';
@ -18,14 +17,14 @@ export function useFilteredSearchCompanyQuery({
searchOnFields: ['name'],
orderByField: 'name',
selectedIds: selectedIds,
mappingFunction: (company) =>
({
id: company.id,
entityType: ActivityTargetableEntityType.Company,
name: company.name,
avatarUrl: getLogoUrlFromDomainName(company.domainName),
avatarType: 'squared',
} as ActivityTargetableEntityForSelect),
mappingFunction: (company) => ({
id: company.id,
entityType: ActivityTargetableEntityType.Company,
name: company.name,
avatarUrl: getLogoUrlFromDomainName(company.domainName),
domainName: company.domainName,
avatarType: 'squared',
}),
searchFilter,
limit,
});