Revert "Upgrade linter and formatter to Ultracite" (#1226)

components/visibility-selector.tsx

@@ -1,23 +1,23 @@
-"use client";
+'use client';
 
-import { type ReactNode, useMemo, useState } from "react";
-import { Button } from "@/components/ui/button";
+import { type ReactNode, useMemo, useState } from 'react';
+import { Button } from '@/components/ui/button';
 import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import { useChatVisibility } from "@/hooks/use-chat-visibility";
-import { cn } from "@/lib/utils";
+} from '@/components/ui/dropdown-menu';
+import { cn } from '@/lib/utils';
 import {
   CheckCircleFillIcon,
   ChevronDownIcon,
   GlobeIcon,
   LockIcon,
-} from "./icons";
+} from './icons';
+import { useChatVisibility } from '@/hooks/use-chat-visibility';
 
-export type VisibilityType = "private" | "public";
+export type VisibilityType = 'private' | 'public';
 
 const visibilities: Array<{
   id: VisibilityType;
@@ -26,15 +26,15 @@ const visibilities: Array<{
   icon: ReactNode;
 }> = [
   {
-    id: "private",
-    label: "Private",
-    description: "Only you can access this chat",
+    id: 'private',
+    label: 'Private',
+    description: 'Only you can access this chat',
     icon: <LockIcon />,
   },
   {
-    id: "public",
-    label: "Public",
-    description: "Anyone with the link can access this chat",
+    id: 'public',
+    label: 'Public',
+    description: 'Anyone with the link can access this chat',
     icon: <GlobeIcon />,
   },
 ];
@@ -56,40 +56,40 @@ export function VisibilitySelector({
 
   const selectedVisibility = useMemo(
     () => visibilities.find((visibility) => visibility.id === visibilityType),
-    [visibilityType]
+    [visibilityType],
   );
 
   return (
-    <DropdownMenu onOpenChange={setOpen} open={open}>
+    <DropdownMenu open={open} onOpenChange={setOpen}>
       <DropdownMenuTrigger
         asChild
         className={cn(
-          "w-fit data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
-          className
+          'w-fit data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
+          className,
         )}
       >
         <Button
-          className="hidden h-8 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 md:flex md:h-fit md:px-2"
           data-testid="visibility-selector"
           variant="outline"
+          className="hidden h-8 md:flex md:h-fit md:px-2 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0"
         >
           {selectedVisibility?.icon}
           <span className="md:sr-only">{selectedVisibility?.label}</span>
-          <ChevronDownIcon />
+          <ChevronDownIcon/>
         </Button>
       </DropdownMenuTrigger>
 
       <DropdownMenuContent align="start" className="min-w-[300px]">
         {visibilities.map((visibility) => (
           <DropdownMenuItem
-            className="group/item flex flex-row items-center justify-between gap-4"
-            data-active={visibility.id === visibilityType}
             data-testid={`visibility-selector-item-${visibility.id}`}
             key={visibility.id}
             onSelect={() => {
               setVisibilityType(visibility.id);
               setOpen(false);
             }}
+            className="group/item flex flex-row items-center justify-between gap-4"
+            data-active={visibility.id === visibilityType}
           >
             <div className="flex flex-col items-start gap-1">
               {visibility.label}