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

Enh/improve skeletton loading (#810)

Browse Source 
* Update skeleton styling

* Update skeleton color

* Remove useless color

* Add loading test case

* naming

* Improve test

* Fix colors

* Add import

* Lint

---------

Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>
This commit is contained in:
Emilien Chauvet
2023-07-21 22:07:11 -07:00
committed by GitHub
parent 775b4c353d
commit 0f3f6fa948
5 changed files with 45 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
front/src/modules/ui/relation-picker/components/SingleEntitySelectBase.tsx
View File

@ -1,5 +1,4 @@
import { useRef } from 'react';
import Skeleton from 'react-loading-skeleton';
import { Key } from 'ts-key-enum';
import { DropdownMenuItem } from '@/ui/dropdown/components/DropdownMenuItem';
@ -14,7 +13,7 @@ import { useEntitySelectScroll } from '../hooks/useEntitySelectScroll';
import { EntityForSelect } from '../types/EntityForSelect';
import { RelationPickerHotkeyScope } from '../types/RelationPickerHotkeyScope';
import { DropdownMenuItemsContainerSkeleton } from './skeletons/DropdownMenuItemsContainerSkeleton';
import { DropdownMenuSkeletonItem } from './skeletons/DropdownMenuSkeletonItem';
export type EntitiesForSingleEntitySelect<
CustomEntityForSelect extends EntityForSelect,
@ -67,9 +66,7 @@ export function SingleEntitySelectBase<
return (
<DropdownMenuItemsContainer ref={containerRef} hasMaxHeight>
{entities.loading ? (
<DropdownMenuItemsContainerSkeleton>
<Skeleton height={24} />
</DropdownMenuItemsContainerSkeleton>
<DropdownMenuSkeletonItem />
) : entitiesInDropdown.length === 0 ? (
<DropdownMenuItem>No result</DropdownMenuItem>
) : (