diff --git a/src/ui/game/GamesListSkeleton.tsx b/src/ui/game/GamesListSkeleton.tsx index 06fb1cf..e754353 100644 --- a/src/ui/game/GamesListSkeleton.tsx +++ b/src/ui/game/GamesListSkeleton.tsx @@ -40,6 +40,7 @@ export default function GamesListSkeleton(){ ); } + function GameSkeleton(): React.ReactNode[]{ const buttonsProps = { buttonProps: { diff --git a/src/ui/gameClass/GameClassListSkeleton.tsx b/src/ui/gameClass/GameClassListSkeleton.tsx index fb85795..6306460 100644 --- a/src/ui/gameClass/GameClassListSkeleton.tsx +++ b/src/ui/gameClass/GameClassListSkeleton.tsx @@ -1,7 +1,72 @@ +import { ButtonShape, ButtonSizeType, ButtonVariant } from "@/components/button/Button"; +import Table from "@/components/table/Table"; +import { elementBg } from "@/util/SkeletonUtil"; +import GameClassAdminButtons from "./GameClassAdminButtons"; + + export default function GameClassListSkeleton(){ - return ( + const headElements: React.ReactNode[] = [
- Game Class List Skeleton + Icon +
, +
+ Name +
, +
+ Actions
+ ]; + const bodyElements: React.ReactNode[][] = [ + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton(), + GameClassSkeleton() + ]; + + + return ( + ); } + + +function GameClassSkeleton(): React.ReactNode[]{ + const buttonsProps = { + buttonProps: { + variant: "ghost" as ButtonVariant, + size: "md" as ButtonSizeType, + shape: "square" as ButtonShape, + disabled: true + }, + showEditGameClassModal: () => {}, + showDeleteGameClassModal: () => {} + } + + const elements: React.ReactNode[] = [ +
, +
, +
+
 
+ +
+ ]; + + return elements; +}