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

14
front/src/modules/ui/dropdown/components/__stories__/DropdownMenu.stories.tsx
View File

@ -6,6 +6,7 @@ import { IconPlus } from '@/ui/icon/index';
import { Avatar } from '@/users/components/Avatar';
import { ComponentDecorator } from '~/testing/decorators';
import { DropdownMenuSkeletonItem } from '../../../relation-picker/components/skeletons/DropdownMenuSkeletonItem';
import { DropdownMenu } from '../DropdownMenu';
import { DropdownMenuCheckableItem } from '../DropdownMenuCheckableItem';
import { DropdownMenuItem } from '../DropdownMenuItem';
@ -194,6 +195,19 @@ export const SimpleMenuItem: Story = {
),
};
export const LoadingMenu: Story = {
...WithContentBelow,
render: () => (
<DropdownMenu>
<DropdownMenuSearch value={'query'} autoFocus />
<DropdownMenuSeparator />
<DropdownMenuItemsContainer hasMaxHeight>
<DropdownMenuSkeletonItem />
</DropdownMenuItemsContainer>
</DropdownMenu>
),
};
export const Search: Story = {
...WithContentBelow,
render: (args) => (