refactor time slots

packages/ui/src/shadcn/skeleton.tsx

@@ -3,21 +3,23 @@ import { cn } from '../lib/utils';
 function Skeleton({
   className,
   children,
+  isLoading = true,
   ...props
-}: React.HTMLAttributes<HTMLDivElement>) {
+}: React.HTMLAttributes<HTMLDivElement> & { isLoading?: boolean }) {
   return (
     <div
       className={cn('relative inline-block align-top', className)}
       {...props}
     >
-      <div className="invisible">
+      <div className={cn({ invisible: isLoading })}>
         {children ?? <span className="block h-4 w-24" />}
       </div>
-
-      <div
-        aria-hidden
-        className="bg-primary/10 absolute inset-0 animate-pulse rounded-md"
-      />
+      {isLoading && (
+        <div
+          aria-hidden
+          className="bg-primary/10 absolute inset-0 animate-pulse rounded-md"
+        />
+      )}
     </div>
   );
 }