chore(root): migrate to biome

apps/dashboard/src/components/ui/RenderDots.tsx

@@ -27,7 +27,10 @@ export function RenderDots({
         <div {...props} className={cn('flex items-center gap-1', className)}>
           {parts.slice(-sliceAt).map((str, index) => {
             return (
-              <div className="flex items-center gap-1" key={str + index}>
+              <div
+                className="flex items-center gap-1"
+                key={str + (index as number)}
+              >
                 {index !== 0 && (
                   <ChevronRight className="relative top-[0.9px] !h-3 !w-3 flex-shrink-0" />
                 )}

apps/dashboard/src/components/ui/accordion.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { ChevronDown } from 'lucide-react';
+import * as React from 'react';
 
 const Accordion = AccordionPrimitive.Root;
 
@@ -26,7 +26,7 @@ const AccordionTrigger = React.forwardRef<
       ref={ref}
       className={cn(
         'flex flex-1 items-center justify-between py-4 font-medium transition-all [&[data-state=closed]]:hover:bg-muted/30 [&[data-state=open]>svg]:rotate-180',
-        className
+        className,
       )}
       {...props}
     >

apps/dashboard/src/components/ui/alert-dialog.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import * as React from 'react';
 import { buttonVariants } from '@/components/ui/button';
 import { cn } from '@/utils/cn';
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import * as React from 'react';
 
 const AlertDialog = AlertDialogPrimitive.Root;
 
@@ -18,7 +18,7 @@ const AlertDialogOverlay = React.forwardRef<
   <AlertDialogPrimitive.Overlay
     className={cn(
       'fixed inset-0 z-50 bg-card/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-      className
+      className,
     )}
     {...props}
     ref={ref}
@@ -36,7 +36,7 @@ const AlertDialogContent = React.forwardRef<
       ref={ref}
       className={cn(
         'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-card p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full',
-        className
+        className,
       )}
       {...props}
     />
@@ -51,7 +51,7 @@ const AlertDialogHeader = ({
   <div
     className={cn(
       'flex flex-col space-y-2 text-center sm:text-left',
-      className
+      className,
     )}
     {...props}
   />
@@ -65,7 +65,7 @@ const AlertDialogFooter = ({
   <div
     className={cn(
       'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
-      className
+      className,
     )}
     {...props}
   />
@@ -118,7 +118,7 @@ const AlertDialogCancel = React.forwardRef<
     className={cn(
       buttonVariants({ variant: 'outline' }),
       'mt-2 sm:mt-0',
-      className
+      className,
     )}
     {...props}
   />

apps/dashboard/src/components/ui/alert.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 
 const alertVariants = cva(
   'relative w-full rounded-lg border p-4 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7',
@@ -16,7 +16,7 @@ const alertVariants = cva(
     defaultVariants: {
       variant: 'default',
     },
-  }
+  },
 );
 
 const Alert = React.forwardRef<

apps/dashboard/src/components/ui/avatar.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import * as React from 'react';
 
 const Avatar = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Root>,
@@ -12,7 +12,7 @@ const Avatar = React.forwardRef<
     ref={ref}
     className={cn(
       'relative flex h-8 w-8 shrink-0 overflow-hidden rounded-full ',
-      className
+      className,
     )}
     {...props}
   />
@@ -39,7 +39,7 @@ const AvatarFallback = React.forwardRef<
     ref={ref}
     className={cn(
       'flex h-full w-full items-center justify-center rounded-full bg-primary text-white',
-      className
+      className,
     )}
     {...props}
   />

apps/dashboard/src/components/ui/badge.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';
+import type * as React from 'react';
 
 const badgeVariants = cva(
   'inline-flex h-[20px] items-center rounded-full border px-2 text-sm font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
@@ -25,7 +25,7 @@ const badgeVariants = cva(
     defaultVariants: {
       variant: 'default',
     },
-  }
+  },
 );
 
 export interface BadgeProps

apps/dashboard/src/components/ui/button.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
@@ -8,6 +7,7 @@ import type { VariantProps } from 'class-variance-authority';
 import type { LucideIcon } from 'lucide-react';
 import { Loader2 } from 'lucide-react';
 import Link from 'next/link';
+import * as React from 'react';
 
 const buttonVariants = cva(
   'inline-flex flex-shrink-0 select-none items-center justify-center whitespace-nowrap rounded-md font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
@@ -35,7 +35,7 @@ const buttonVariants = cva(
       variant: 'default',
       size: 'sm',
     },
-  }
+  },
 );
 
 export interface ButtonProps
@@ -61,10 +61,10 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
       responsive,
       ...props
     },
-    ref
+    ref,
   ) => {
     const Comp = asChild ? Slot : 'button';
-    const Icon = loading ? Loader2 : icon ?? null;
+    const Icon = loading ? Loader2 : (icon ?? null);
     return (
       <Comp
         className={cn(buttonVariants({ variant, size, className }))}
@@ -78,7 +78,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
               'h-4 w-4 flex-shrink-0',
               loading && 'animate-spin',
               size !== 'icon' && responsive && 'mr-0 sm:mr-2',
-              size !== 'icon' && !responsive && 'mr-2'
+              size !== 'icon' && !responsive && 'mr-2',
             )}
           />
         )}
@@ -89,7 +89,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
         )}
       </Comp>
     );
-  }
+  },
 );
 Button.displayName = 'Button';
 Button.defaultProps = {
@@ -122,9 +122,9 @@ const LinkButton = React.forwardRef<
       href,
       ...props
     },
-    ref
+    ref,
   ) => {
-    const Icon = loading ? Loader2 : icon ?? null;
+    const Icon = loading ? Loader2 : (icon ?? null);
     return (
       <Link
         href={href}
@@ -138,7 +138,7 @@ const LinkButton = React.forwardRef<
             className={cn(
               'mr-2 h-4 w-4 flex-shrink-0',
               responsive && 'mr-0 sm:mr-2',
-              loading && 'animate-spin'
+              loading && 'animate-spin',
             )}
           />
         )}
@@ -149,7 +149,7 @@ const LinkButton = React.forwardRef<
         )}
       </Link>
     );
-  }
+  },
 );
 LinkButton.displayName = 'LinkButton';
 

apps/dashboard/src/components/ui/calendar.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { buttonVariants } from '@/components/ui/button';
 import { cn } from '@/utils/cn';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
+import type * as React from 'react';
 import { DayPicker } from 'react-day-picker';
 
 export type CalendarProps = React.ComponentProps<typeof DayPicker>;
@@ -24,7 +24,7 @@ function Calendar({
         nav: 'space-x-1 flex items-center',
         nav_button: cn(
           buttonVariants({ variant: 'outline' }),
-          'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100'
+          'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100',
         ),
         nav_button_previous: 'absolute left-1',
         nav_button_next: 'absolute right-1',
@@ -36,7 +36,7 @@ function Calendar({
         cell: 'h-9 w-9 text-center  p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20',
         day: cn(
           buttonVariants({ variant: 'ghost' }),
-          'h-9 w-9 p-0 font-normal aria-selected:opacity-100'
+          'h-9 w-9 p-0 font-normal aria-selected:opacity-100',
         ),
         day_range_end: 'day-range-end',
         day_selected:

apps/dashboard/src/components/ui/carousel.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
 import { Button } from '@/components/ui/button';
 import { cn } from '@/utils/cn';
 import useEmblaCarousel from 'embla-carousel-react';
 import type { UseEmblaCarouselType } from 'embla-carousel-react';
 import { ArrowLeft, ArrowRight } from 'lucide-react';
+import * as React from 'react';
 
 type CarouselApi = UseEmblaCarouselType[1];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
@@ -52,14 +52,14 @@ const Carousel = React.forwardRef<
       children,
       ...props
     },
-    ref
+    ref,
   ) => {
     const [carouselRef, api] = useEmblaCarousel(
       {
         ...opts,
         axis: orientation === 'horizontal' ? 'x' : 'y',
       },
-      plugins
+      plugins,
     );
     const [canScrollPrev, setCanScrollPrev] = React.useState(false);
     const [canScrollNext, setCanScrollNext] = React.useState(false);
@@ -91,7 +91,7 @@ const Carousel = React.forwardRef<
           scrollNext();
         }
       },
-      [scrollPrev, scrollNext]
+      [scrollPrev, scrollNext],
     );
 
     React.useEffect(() => {
@@ -142,7 +142,7 @@ const Carousel = React.forwardRef<
         </div>
       </CarouselContext.Provider>
     );
-  }
+  },
 );
 Carousel.displayName = 'Carousel';
 
@@ -159,7 +159,7 @@ const CarouselContent = React.forwardRef<
         className={cn(
           'flex',
           orientation === 'horizontal' ? '' : 'flex-col',
-          className
+          className,
         )}
         {...props}
       />
@@ -182,7 +182,7 @@ const CarouselItem = React.forwardRef<
       className={cn(
         'min-w-0 shrink-0 grow-0 basis-full',
         orientation === 'horizontal' ? 'pl-4' : 'pt-4',
-        className
+        className,
       )}
       {...props}
     />
@@ -206,7 +206,7 @@ const CarouselPrevious = React.forwardRef<
         orientation === 'horizontal'
           ? 'left-6 top-1/2 -translate-y-1/2'
           : '-top-12 left-1/2 -translate-x-1/2 rotate-90',
-        className
+        className,
       )}
       disabled={!canScrollPrev}
       onClick={scrollPrev}
@@ -235,7 +235,7 @@ const CarouselNext = React.forwardRef<
         orientation === 'horizontal'
           ? 'right-6 top-1/2 -translate-y-1/2'
           : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',
-        className
+        className,
       )}
       disabled={!canScrollNext}
       onClick={scrollNext}

apps/dashboard/src/components/ui/checkbox.tsx

@@ -1,16 +1,16 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { Check } from 'lucide-react';
+import * as React from 'react';
 
 export const DumpCheckbox = ({ checked }: { checked: boolean }) => {
   return (
     <div
       className={cn(
         'block h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
-        checked && 'bg-primary text-primary-foreground'
+        checked && 'bg-primary text-primary-foreground',
       )}
     >
       <div className="flex items-center justify-center text-current">
@@ -28,7 +28,7 @@ const Checkbox = React.forwardRef<
     ref={ref}
     className={cn(
       'block h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
-      className
+      className,
     )}
     {...props}
   >
@@ -48,7 +48,7 @@ const CheckboxInput = React.forwardRef<
   <label
     className={cn(
       'flex min-h-10 cursor-pointer select-none gap-4 rounded-md border border-border px-3 py-[0.5rem]',
-      className
+      className,
     )}
   >
     <Checkbox ref={ref} {...props} className="relative top-0.5" />

apps/dashboard/src/components/ui/combobox-advanced.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
 import { Badge } from '@/components/ui/badge';
 import { Command, CommandInput, CommandItem } from '@/components/ui/command';
 import { cn } from '@/utils/cn';
 import { ChevronsUpDownIcon } from 'lucide-react';
 import VirtualList from 'rc-virtual-list';
+import * as React from 'react';
 import { useOnClickOutside } from 'usehooks-ts';
 
 import { Button } from './button';
@@ -40,7 +40,7 @@ export function ComboboxAdvanced({
         (typeof item.label === 'string' &&
           item.label.toLowerCase().includes(inputValue.toLowerCase())) ||
         (typeof item.value === 'string' &&
-          item.value.toLowerCase().includes(inputValue.toLowerCase()))
+          item.value.toLowerCase().includes(inputValue.toLowerCase())),
     );
 
   const renderItem = (item: IItem) => {
@@ -56,7 +56,7 @@ export function ComboboxAdvanced({
           onChange(
             value.includes(item.value)
               ? value.filter((s) => s !== item.value)
-              : [...value, item.value]
+              : [...value, item.value],
           );
         }}
         className={'flex cursor-pointer items-center gap-2'}

apps/dashboard/src/components/ui/combobox.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import * as React from 'react';
 import type { ButtonProps } from '@/components/ui/button';
 import { Button } from '@/components/ui/button';
 import {
@@ -18,6 +17,7 @@ import { cn } from '@/utils/cn';
 import type { LucideIcon } from 'lucide-react';
 import { Check, ChevronsUpDown } from 'lucide-react';
 import VirtualList from 'rc-virtual-list';
+import * as React from 'react';
 
 export interface ComboboxProps<T> {
   placeholder: string;
@@ -66,7 +66,7 @@ export function Combobox<T extends string>({
   const [search, setSearch] = React.useState('');
   function find(value: string) {
     return items.find(
-      (item) => item.value.toLowerCase() === value.toLowerCase()
+      (item) => item.value.toLowerCase() === value.toLowerCase(),
     );
   }
 
@@ -82,13 +82,13 @@ export function Combobox<T extends string>({
             className={cn(
               'justify-between',
               !!error && 'border-destructive',
-              className
+              className,
             )}
           >
             <div className="flex min-w-0 items-center">
               {Icon ? <Icon size={16} className="mr-2 shrink-0" /> : null}
               <span className="overflow-hidden text-ellipsis whitespace-nowrap">
-                {value ? find(value)?.label ?? 'No match' : placeholder}
+                {value ? (find(value)?.label ?? 'No match') : placeholder}
               </span>
             </div>
             <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
@@ -147,7 +147,7 @@ export function Combobox<T extends string>({
                 <Check
                   className={cn(
                     'mr-2 h-4 w-4 flex-shrink-0',
-                    value === item.value ? 'opacity-100' : 'opacity-0'
+                    value === item.value ? 'opacity-100' : 'opacity-0',
                   )}
                 />
                 {item.label}

apps/dashboard/src/components/ui/command.tsx

@@ -1,11 +1,11 @@
 'use client';
 
-import * as React from 'react';
 import { Dialog, DialogContent } from '@/components/ui/dialog';
 import { cn } from '@/utils/cn';
 import type { DialogProps } from '@radix-ui/react-dialog';
 import { Command as CommandPrimitive } from 'cmdk';
 import { Search } from 'lucide-react';
+import * as React from 'react';
 
 const Command = React.forwardRef<
   React.ElementRef<typeof CommandPrimitive>,
@@ -15,7 +15,7 @@ const Command = React.forwardRef<
     ref={ref}
     className={cn(
       'flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground',
-      className
+      className,
     )}
     {...props}
   />
@@ -46,7 +46,7 @@ const CommandInput = React.forwardRef<
       ref={ref}
       className={cn(
         'flex h-11 w-full rounded-md bg-transparent py-3  outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',
-        className
+        className,
       )}
       {...props}
     />
@@ -85,7 +85,7 @@ const CommandGroup = React.forwardRef<
     ref={ref}
     className={cn(
       'overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-sm [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground',
-      className
+      className,
     )}
     {...props}
   />
@@ -113,7 +113,7 @@ const CommandItem = React.forwardRef<
     ref={ref}
     className={cn(
       'relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5  outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-      className
+      className,
     )}
     data-disabled={props.disabled}
     {...props}
@@ -130,7 +130,7 @@ const CommandShortcut = ({
     <span
       className={cn(
         'ml-auto text-sm tracking-widest text-muted-foreground',
-        className
+        className,
       )}
       {...props}
     />

apps/dashboard/src/components/ui/dialog.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { X } from 'lucide-react';
+import * as React from 'react';
 
 const Dialog = DialogPrimitive.Root;
 
@@ -21,7 +21,7 @@ const DialogOverlay = React.forwardRef<
     ref={ref}
     className={cn(
       'fixed inset-0 z-50 bg-black/20 backdrop-blur-[1px] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-      className
+      className,
     )}
     {...props}
   />
@@ -42,7 +42,7 @@ const DialogContent = React.forwardRef<
         'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border bg-card p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full',
         className,
         'max-h-screen overflow-y-auto', // Ensure the dialog is scrollable if it exceeds the screen height
-        'mt-auto' // Add margin-top: auto for all screen sizes
+        'mt-auto', // Add margin-top: auto for all screen sizes
       )}
       {...props}
     >
@@ -59,7 +59,7 @@ const DialogHeader = ({
   <div
     className={cn(
       'flex flex-col space-y-1.5 text-center sm:text-left',
-      className
+      className,
     )}
     {...props}
   />
@@ -73,7 +73,7 @@ const DialogFooter = ({
   <div
     className={cn(
       'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',
-      className
+      className,
     )}
     {...props}
   />
@@ -88,7 +88,7 @@ const DialogTitle = React.forwardRef<
     ref={ref}
     className={cn(
       'text-lg font-semibold leading-none tracking-tight',
-      className
+      className,
     )}
     {...props}
   />

apps/dashboard/src/components/ui/dropdown-menu.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { Check, ChevronRight, Circle } from 'lucide-react';
+import * as React from 'react';
 
 const DropdownMenu = DropdownMenuPrimitive.Root;
 
@@ -28,7 +28,7 @@ const DropdownMenuSubTrigger = React.forwardRef<
     className={cn(
       'flex cursor-default select-none items-center rounded-sm px-2 py-1.5  outline-none focus:bg-accent data-[state=open]:bg-accent',
       inset && 'pl-8',
-      className
+      className,
     )}
     {...props}
   >
@@ -47,7 +47,7 @@ const DropdownMenuSubContent = React.forwardRef<
     ref={ref}
     className={cn(
       'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-      className
+      className,
     )}
     {...props}
   />
@@ -65,7 +65,7 @@ const DropdownMenuContent = React.forwardRef<
       sideOffset={sideOffset}
       className={cn(
         'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-        className
+        className,
       )}
       {...props}
     />
@@ -84,7 +84,7 @@ const DropdownMenuItem = React.forwardRef<
     className={cn(
       'relative flex min-h-8 cursor-pointer select-none items-center rounded-sm px-2  py-1.5 outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:mr-2',
       inset && 'pl-8',
-      className
+      className,
     )}
     {...props}
   />
@@ -99,7 +99,7 @@ const DropdownMenuCheckboxItem = React.forwardRef<
     ref={ref}
     className={cn(
       'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2  outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-      className
+      className,
     )}
     checked={checked}
     {...props}
@@ -123,7 +123,7 @@ const DropdownMenuRadioItem = React.forwardRef<
     ref={ref}
     className={cn(
       'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2  outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-      className
+      className,
     )}
     {...props}
   >
@@ -171,7 +171,7 @@ const DropdownMenuShortcut = ({
     <span
       className={cn(
         'ml-auto font-mono text-sm tracking-widest opacity-60',
-        className
+        className,
       )}
       {...props}
     />

apps/dashboard/src/components/ui/gradient-background.tsx

@@ -14,7 +14,7 @@ export function GradientBackground({
     <div
       className={cn(
         'from-def-200 rounded-md bg-gradient-to-tr to-white',
-        className
+        className,
       )}
       {...props}
     >

apps/dashboard/src/components/ui/input-otp.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import { OTPInput, OTPInputContext } from 'input-otp';
 import { Dot } from 'lucide-react';
+import * as React from 'react';
 
 const InputOTP = React.forwardRef<
   React.ElementRef<typeof OTPInput>,
@@ -11,7 +11,7 @@ const InputOTP = React.forwardRef<
     ref={ref}
     containerClassName={cn(
       'flex items-center gap-2 has-[:disabled]:opacity-50',
-      containerClassName
+      containerClassName,
     )}
     className={cn('disabled:cursor-not-allowed', className)}
     {...props}
@@ -40,7 +40,7 @@ const InputOTPSlot = React.forwardRef<
       className={cn(
         'relative flex h-10 w-10 items-center justify-center border-y border-r border-input  transition-all first:rounded-l-md first:border-l last:rounded-r-md',
         isActive && 'z-10 ring-2 ring-ring ring-offset-background',
-        className
+        className,
       )}
       {...props}
     >

apps/dashboard/src/components/ui/input.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import type { VariantProps } from 'class-variance-authority';
 import { cva } from 'class-variance-authority';
+import * as React from 'react';
 
 const inputVariant = cva(
   'file: flex w-full rounded-md border border-input bg-card ring-offset-background file:border-0 file:bg-transparent file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-50',
@@ -18,7 +18,7 @@ const inputVariant = cva(
     defaultVariants: {
       size: 'sm',
     },
-  }
+  },
 );
 
 export type InputProps = VariantProps<typeof inputVariant> &
@@ -35,13 +35,13 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
         type={type}
         className={cn(
           inputVariant({ size, className }),
-          !!error && 'border-destructive'
+          !!error && 'border-destructive',
         )}
         ref={ref}
         {...props}
       />
     );
-  }
+  },
 );
 Input.displayName = 'Input';
 

apps/dashboard/src/components/ui/key-value.tsx

@@ -16,7 +16,7 @@ export function KeyValue({ href, onClick, name, value }: KeyValueProps) {
     <Component
       className={cn(
         'group flex min-w-0 max-w-full divide-x self-start overflow-hidden rounded-md border border-border text-sm font-medium transition-transform',
-        clickable && 'hover:-translate-y-0.5'
+        clickable && 'hover:-translate-y-0.5',
       )}
       {...{ href, onClick }}
     >
@@ -24,7 +24,7 @@ export function KeyValue({ href, onClick, name, value }: KeyValueProps) {
       <div
         className={cn(
           'font-mono overflow-hidden text-ellipsis whitespace-nowrap bg-card p-1 px-2 text-highlight',
-          clickable && 'group-hover:underline'
+          clickable && 'group-hover:underline',
         )}
       >
         {value}

apps/dashboard/src/components/ui/label.tsx

@@ -1,13 +1,13 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 
 const labelVariants = cva(
-  'mb-2 block font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'
+  'mb-2 block font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
 );
 
 const Label = React.forwardRef<

apps/dashboard/src/components/ui/popover.tsx

@@ -1,6 +1,6 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as React from 'react';
 
 const Popover = PopoverPrimitive.Root;
 
@@ -19,7 +19,7 @@ const PopoverContent = React.forwardRef<
       sideOffset={sideOffset}
       className={cn(
         'z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-        className
+        className,
       )}
       style={{
         boxShadow: '0 0 0 9000px rgba(0, 0, 0, 0.05)',

apps/dashboard/src/components/ui/progress.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import { round } from '@/utils/math';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
+import * as React from 'react';
 
 const Progress = React.forwardRef<
   React.ElementRef<typeof ProgressPrimitive.Root>,
@@ -14,9 +14,9 @@ const Progress = React.forwardRef<
     ref={ref}
     className={cn(
       'relative h-4 w-full min-w-16 overflow-hidden rounded bg-def-200 shadow-sm',
-      size == 'sm' && 'h-2',
-      size == 'lg' && 'h-8',
-      className
+      size === 'sm' && 'h-2',
+      size === 'lg' && 'h-8',
+      className,
     )}
     {...props}
   >
@@ -27,7 +27,7 @@ const Progress = React.forwardRef<
         background: color,
       }}
     />
-    {value && size != 'sm' && (
+    {value && size !== 'sm' && (
       <div className="z-5 absolute bottom-0 top-0 flex items-center px-2 text-sm font-semibold">
         <div>{round(value, 2)}%</div>
       </div>

apps/dashboard/src/components/ui/radio-group.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import { Circle } from 'lucide-react';
+import * as React from 'react';
 
 const RadioGroup = React.forwardRef<
   React.ElementRef<typeof RadioGroupPrimitive.Root>,
@@ -26,7 +26,7 @@ const RadioGroupItem = React.forwardRef<
       ref={ref}
       className={cn(
         'aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
-        className
+        className,
       )}
       {...props}
     >

apps/dashboard/src/components/ui/scroll-area.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import * as React from 'react';
 
 const ScrollArea = React.forwardRef<
   React.ElementRef<typeof ScrollAreaPrimitive.Root>,
@@ -35,14 +35,14 @@ const ScrollBar = React.forwardRef<
         'h-full w-2.5 border-l border-l-transparent p-[1px]',
       orientation === 'horizontal' &&
         'h-2.5 flex-col border-t border-t-transparent p-[1px]',
-      className
+      className,
     )}
     {...props}
   >
     <ScrollAreaPrimitive.ScrollAreaThumb
       className={cn(
         'relative rounded-full bg-border',
-        orientation === 'vertical' && 'flex-1'
+        orientation === 'vertical' && 'flex-1',
       )}
     />
   </ScrollAreaPrimitive.ScrollAreaScrollbar>

apps/dashboard/src/components/ui/sheet.tsx

@@ -1,11 +1,11 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';
 import { XIcon } from 'lucide-react';
+import * as React from 'react';
 
 const Sheet = SheetPrimitive.Root;
 
@@ -22,7 +22,7 @@ const SheetOverlay = React.forwardRef<
   <SheetPrimitive.Overlay
     className={cn(
       'fixed inset-0 z-50 bg-black/20  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-      className
+      className,
     )}
     {...props}
     ref={ref}
@@ -46,7 +46,7 @@ const sheetVariants = cva(
     defaultVariants: {
       side: 'right',
     },
-  }
+  },
 );
 
 interface SheetContentProps
@@ -88,7 +88,7 @@ const SheetHeader = ({
   <div
     className={cn(
       'relative -m-6 mb-6 flex justify-between rounded-t-lg border-b bg-def-100 p-6',
-      className
+      className,
     )}
     {...props}
     style={{
@@ -97,7 +97,7 @@ const SheetHeader = ({
       backgroundRepeat: 'repeat',
     }}
   >
-    <div className="absolute inset-0 bg-gradient-to-r from-def-100/95 to-def-100/80"></div>
+    <div className="absolute inset-0 bg-gradient-to-r from-def-100/95 to-def-100/80" />
     <div className="row relative w-full items-start justify-between">
       {children}
     </div>
@@ -112,7 +112,7 @@ const SheetFooter = ({
   <div
     className={cn(
       'mt-auto flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
-      className
+      className,
     )}
     {...props}
   />

apps/dashboard/src/components/ui/switch.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as SwitchPrimitives from '@radix-ui/react-switch';
+import * as React from 'react';
 
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
@@ -11,14 +11,14 @@ const Switch = React.forwardRef<
   <SwitchPrimitives.Root
     className={cn(
       'data-[state=checked]:bg-highlight peer inline-flex h-4 w-7 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=unchecked]:bg-input',
-      className
+      className,
     )}
     {...props}
     ref={ref}
   >
     <SwitchPrimitives.Thumb
       className={cn(
-        'pointer-events-none block h-3 w-3 rounded-full bg-card shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-3 data-[state=unchecked]:translate-x-0'
+        'pointer-events-none block h-3 w-3 rounded-full bg-card shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-3 data-[state=unchecked]:translate-x-0',
       )}
     />
   </SwitchPrimitives.Root>

apps/dashboard/src/components/ui/table.tsx

@@ -1,7 +1,7 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
+import * as React from 'react';
 
 const Table = React.forwardRef<
   HTMLTableElement,
@@ -61,7 +61,7 @@ const TableRow = React.forwardRef<
     ref={ref}
     className={cn(
       'transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted',
-      className
+      className,
     )}
     {...props}
   />
@@ -76,7 +76,7 @@ const TableHead = React.forwardRef<
     ref={ref}
     className={cn(
       'h-10 whitespace-nowrap border-b border-border bg-def-100 px-4 text-left align-middle  font-semibold text-muted-foreground shadow-[0_0_0_0.5px] shadow-border [&:has([role=checkbox])]:pr-0',
-      className
+      className,
     )}
     {...props}
   />
@@ -91,7 +91,7 @@ const TableCell = React.forwardRef<
     ref={ref}
     className={cn(
       'h-12 whitespace-nowrap px-4 align-middle shadow-[0_0_0_0.5px] shadow-border',
-      className
+      className,
     )}
     {...props}
   />
@@ -122,7 +122,7 @@ export function TableSkeleton({
       <TableHeader>
         <TableRow>
           {Array.from({ length: cols }).map((_, j) => (
-            <TableHead key={j}>
+            <TableHead key={j as number}>
               <div className="h-4 w-1/4 animate-pulse rounded-full bg-def-300" />
             </TableHead>
           ))}
@@ -130,9 +130,9 @@ export function TableSkeleton({
       </TableHeader>
       <TableBody>
         {Array.from({ length: rows }).map((_, i) => (
-          <TableRow key={i}>
+          <TableRow key={i as number}>
             {Array.from({ length: cols }).map((_, j) => (
-              <TableCell key={j}>
+              <TableCell key={(j + i) as number}>
                 <div className="h-4 w-1/4 min-w-20 animate-pulse rounded-full bg-def-300" />
               </TableCell>
             ))}

apps/dashboard/src/components/ui/tabs.tsx

@@ -1,6 +1,6 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
+import * as React from 'react';
 
 const Tabs = TabsPrimitive.Root;
 
@@ -12,7 +12,7 @@ const TabsList = React.forwardRef<
     ref={ref}
     className={cn(
       'inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground',
-      className
+      className,
     )}
     {...props}
   />
@@ -27,7 +27,7 @@ const TabsTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5  font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-card data-[state=active]:text-foreground data-[state=active]:shadow-sm',
-      className
+      className,
     )}
     {...props}
   />
@@ -42,7 +42,7 @@ const TabsContent = React.forwardRef<
     ref={ref}
     className={cn(
       'mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
-      className
+      className,
     )}
     {...props}
   />

apps/dashboard/src/components/ui/textarea.tsx

@@ -1,5 +1,5 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
+import * as React from 'react';
 
 export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
 
@@ -9,13 +9,13 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
       <textarea
         className={cn(
           'flex min-h-[80px] w-full rounded-md border border-input bg-card px-3 py-2  ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
-          className
+          className,
         )}
         ref={ref}
         {...props}
       />
     );
-  }
+  },
 );
 Textarea.displayName = 'Textarea';
 

apps/dashboard/src/components/ui/toast.tsx

@@ -1,11 +1,11 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as ToastPrimitives from '@radix-ui/react-toast';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';
 import { X } from 'lucide-react';
+import * as React from 'react';
 
 const ToastProvider = ToastPrimitives.Provider;
 
@@ -17,7 +17,7 @@ const ToastViewport = React.forwardRef<
     ref={ref}
     className={cn(
       'fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]',
-      className
+      className,
     )}
     {...props}
   />
@@ -37,7 +37,7 @@ const toastVariants = cva(
     defaultVariants: {
       variant: 'default',
     },
-  }
+  },
 );
 
 const Toast = React.forwardRef<
@@ -63,7 +63,7 @@ const ToastAction = React.forwardRef<
     ref={ref}
     className={cn(
       'inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 font-medium  ring-offset-background transition-colors hover:bg-def-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive',
-      className
+      className,
     )}
     {...props}
   />
@@ -78,7 +78,7 @@ const ToastClose = React.forwardRef<
     ref={ref}
     className={cn(
       'absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
-      className
+      className,
     )}
     toast-close=""
     {...props}

apps/dashboard/src/components/ui/toggle-group.tsx

@@ -1,8 +1,8 @@
-import * as React from 'react';
 import { toggleVariants } from '@/components/ui/toggle';
 import { cn } from '@/utils/cn';
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
-import { VariantProps } from 'class-variance-authority';
+import type { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 
 const ToggleGroupContext = React.createContext<
   VariantProps<typeof toggleVariants>
@@ -44,7 +44,7 @@ const ToggleGroupItem = React.forwardRef<
           variant: context.variant || variant,
           size: context.size || size,
         }),
-        className
+        className,
       )}
       {...props}
     >

apps/dashboard/src/components/ui/toggle.tsx

@@ -1,8 +1,8 @@
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as TogglePrimitive from '@radix-ui/react-toggle';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 
 const toggleVariants = cva(
   'inline-flex items-center justify-center rounded-md  font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground',
@@ -23,7 +23,7 @@ const toggleVariants = cva(
       variant: 'default',
       size: 'default',
     },
-  }
+  },
 );
 
 const Toggle = React.forwardRef<

apps/dashboard/src/components/ui/tooltip.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import * as React from 'react';
 import { cn } from '@/utils/cn';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as React from 'react';
 
 const TooltipProvider = TooltipPrimitive.Provider;
 
@@ -23,11 +23,11 @@ const TooltipContent = React.forwardRef<
       sideOffset={sideOffset}
       className={cn(
         'z-50 overflow-hidden rounded-md border bg-popover-foreground px-3 py-1.5  text-popover shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-        className
+        className,
       )}
       {...props}
     />
-  )
+  ),
 );
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;