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

Add search to cmd bar (#667)

Browse Source 
* Move useFilteredSearchEntityQuery from relation picker to search module

* refactor duplicated code with useFilteredSearchCompanyQuery

* Implement similar pattern for people than for companies with useFilteredSearchEntityQuery

* Fix warning from a previous PR

* Enable search from menu

* Add companies to search

* Fix ESLint

* Refactor

* Fix according to peer review

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Félix Malfait
2023-07-16 00:23:37 +02:00
committed by GitHub
parent b982788100
commit 7959308e0b
16 changed files with 202 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
front/src/modules/comments/components/comment-thread/CommentThreadRelationPicker.tsx
View File

@ -9,24 +9,21 @@ import {
} from '@floating-ui/react';
import { useHandleCheckableCommentThreadTargetChange } from '@/comments/hooks/useHandleCheckableCommentThreadTargetChange';
import { CommentableEntityForSelect } from '@/comments/types/CommentableEntityForSelect';
import { CompanyChip } from '@/companies/components/CompanyChip';
import { useFilteredSearchCompanyQuery } from '@/companies/services';
import { usePreviousHotkeyScope } from '@/lib/hotkeys/hooks/usePreviousHotkeyScope';
import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys';
import { PersonChip } from '@/people/components/PersonChip';
import { useFilteredSearchPeopleQuery } from '@/people/services';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
import { MultipleEntitySelect } from '@/relation-picker/components/MultipleEntitySelect';
import { useFilteredSearchEntityQuery } from '@/relation-picker/hooks/useFilteredSearchEntityQuery';
import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope';
import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef';
import { flatMapAndSortEntityForSelectArrayOfArrayByName } from '@/ui/utils/flatMapAndSortEntityForSelectArrayByName';
import { getLogoUrlFromDomainName } from '@/utils/utils';
import {
CommentableType,
CommentThread,
CommentThreadTarget,
useSearchCompanyQuery,
useSearchPeopleQuery,
} from '~/generated/graphql';
type OwnProps = {
@ -90,35 +87,14 @@ export function CommentThreadRelationPicker({ commentThread }: OwnProps) {
?.filter((relation) => relation.commentableType === 'Company')
.map((relation) => relation.commentableId) ?? [];
const personsForMultiSelect = useFilteredSearchEntityQuery({
queryHook: useSearchPeopleQuery,
searchOnFields: ['firstName', 'lastName'],
orderByField: 'lastName',
selectedIds: peopleIds,
mappingFunction: (entity) =>
({
id: entity.id,
entityType: CommentableType.Person,
name: `${entity.firstName} ${entity.lastName}`,
avatarType: 'rounded',
} as CommentableEntityForSelect),
const personsForMultiSelect = useFilteredSearchPeopleQuery({
searchFilter,
selectedIds: peopleIds,
});
const companiesForMultiSelect = useFilteredSearchEntityQuery({
queryHook: useSearchCompanyQuery,
searchOnFields: ['name'],
orderByField: 'name',
selectedIds: companyIds,
mappingFunction: (company) =>
({
id: company.id,
entityType: CommentableType.Company,
name: company.name,
avatarUrl: getLogoUrlFromDomainName(company.domainName),
avatarType: 'squared',
} as CommentableEntityForSelect),
const companiesForMultiSelect = useFilteredSearchCompanyQuery({
searchFilter,
selectedIds: companyIds,
});
const {