Rabinagurung · Rabinagurung · Mar 29, 2026
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,12 @@
 {
-  "tailwindCSS.experimental.configFile": "packages/ui/src/styles/globals.css"
+  "tailwindCSS.experimental.configFile": "packages/ui/src/styles/globals.css",
+  "editor.formatOnSave": false,
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "always"
+  },
+  "eslint.workingDirectories": [
+    { "pattern": "apps/*" },
+    { "pattern": "packages/*" }
+  ],
+  "eslint.useFlatConfig": true
 }
diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx
@@ -1,43 +1,43 @@
-import { Geist, Geist_Mono } from "next/font/google"
-
-import "@workspace/ui/globals.css"
-import { Providers } from "@/components/providers"
-import { ClerkProvider } from "@clerk/nextjs"
-import { Toaster } from "@workspace/ui/components/sonner"
+import { Geist, Geist_Mono } from "next/font/google";
 
+import "@workspace/ui/globals.css";
+import { Providers } from "@/components/providers";
+import { ClerkProvider } from "@clerk/nextjs";
+import { Toaster } from "@workspace/ui/components/sonner";
 
 const fontSans = Geist({
   subsets: ["latin"],
   variable: "--font-sans",
-})
+});
 
 const fontMono = Geist_Mono({
   subsets: ["latin"],
   variable: "--font-mono",
-})
+});
 
 export default function RootLayout({
   children,
 }: Readonly<{
-  children: React.ReactNode
+  children: React.ReactNode;
 }>) {
   return (
     <html lang="en" suppressHydrationWarning>
       <body
         className={`${fontSans.variable} ${fontMono.variable} font-sans antialiased `}
       >
-        <ClerkProvider 
+        <ClerkProvider
           appearance={{
             variables: {
-              colorPrimary: "#3C82F6"
-            }
-        }}>
-            <Providers>
-              <Toaster/>
-                {children}
-            </Providers>
+              colorPrimary: "#3C82F6",
+            },
+          }}
+        >
+          <Providers>
+            <Toaster />
+            {children}
+          </Providers>
         </ClerkProvider>
       </body>
     </html>
-  )
+  );
 }
diff --git a/apps/web/package.json b/apps/web/package.json
@@ -12,7 +12,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@clerk/nextjs": "^6.30.2",
+    "@clerk/nextjs": "^6.39.1",
     "@convex-dev/agent": "^0.1.16",
     "@hookform/resolvers": "^5.2.1",
     "@sentry/nextjs": "^10",

diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
   "devDependencies": {
     "@workspace/eslint-config": "workspace:*",
     "@workspace/typescript-config": "workspace:*",
+    "eslint": "^9.32.0",
     "prettier": "^3.6.2",
     "turbo": "^2.5.5",
     "typescript": "5.9.2"

diff --git a/packages/eslint-config/base.js b/packages/eslint-config/base.js
@@ -1,5 +1,6 @@
 import js from "@eslint/js"
 import eslintConfigPrettier from "eslint-config-prettier"
+import eslintPluginPrettier from "eslint-plugin-prettier"
 import onlyWarn from "eslint-plugin-only-warn"
 import turboPlugin from "eslint-plugin-turbo"
 import tseslint from "typescript-eslint"
@@ -13,6 +14,14 @@ export const config = [
   js.configs.recommended,
   eslintConfigPrettier,
   ...tseslint.configs.recommended,
+  {
+    plugins: {
+      prettier: eslintPluginPrettier,
+    },
+    rules: {
+      "prettier/prettier": "warn",
+    },
+  },
   {
     plugins: {
       turbo: turboPlugin,

diff --git a/packages/eslint-config/package.json b/packages/eslint-config/package.json
@@ -17,6 +17,7 @@
     "eslint": "^9.32.0",
     "eslint-config-prettier": "^9.1.2",
     "eslint-plugin-only-warn": "^1.1.0",
+    "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-turbo": "^2.5.5",

diff --git a/packages/ui/eslint.config.js b/packages/ui/eslint.config.js
@@ -1,4 +1,4 @@
-import { config } from "@workspace/eslint-config/react-internal"
+import { config } from "@workspace/eslint-config/react-internal";
 
 /** @type {import("eslint").Linter.Config} */
-export default config
+export default config;
diff --git a/packages/ui/postcss.config.mjs b/packages/ui/postcss.config.mjs
@@ -1,6 +1,6 @@
 /** @type {import('postcss-load-config').Config} */
 const config = {
-    plugins: { "@tailwindcss/postcss": {} },
+  plugins: { "@tailwindcss/postcss": {} },
 };
 
 export default config;
diff --git a/packages/ui/src/components/accordion.tsx b/packages/ui/src/components/accordion.tsx
@@ -1,15 +1,15 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as AccordionPrimitive from "@radix-ui/react-accordion"
-import { ChevronDownIcon } from "lucide-react"
+import * as React from "react";
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import { ChevronDownIcon } from "lucide-react";
 
-import { cn } from "@workspace/ui/lib/utils"
+import { cn } from "@workspace/ui/lib/utils";
 
 function Accordion({
   ...props
 }: React.ComponentProps<typeof AccordionPrimitive.Root>) {
-  return <AccordionPrimitive.Root data-slot="accordion" {...props} />
+  return <AccordionPrimitive.Root data-slot="accordion" {...props} />;
 }
 
 function AccordionItem({
@@ -22,7 +22,7 @@ function AccordionItem({
       className={cn("border-b last:border-b-0", className)}
       {...props}
     />
-  )
+  );
 }
 
 function AccordionTrigger({
@@ -36,15 +36,15 @@ function AccordionTrigger({
         data-slot="accordion-trigger"
         className={cn(
           "focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
-          className
+          className,
         )}
         {...props}
       >
         {children}
         <ChevronDownIcon className="text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" />
       </AccordionPrimitive.Trigger>
     </AccordionPrimitive.Header>
-  )
+  );
 }
 
 function AccordionContent({
@@ -60,7 +60,7 @@ function AccordionContent({
     >
       <div className={cn("pt-0 pb-4", className)}>{children}</div>
     </AccordionPrimitive.Content>
-  )
+  );
 }
 
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
diff --git a/packages/ui/src/components/ai/branch.tsx b/packages/ui/src/components/ai/branch.tsx
@@ -209,4 +209,4 @@ export const AIBranchPage = ({ className }: AIBranchPageProps) => {
       {currentBranch + 1} of {totalBranches}
     </span>
   );
-};
+};
diff --git a/packages/ui/src/components/ai/conversation.tsx b/packages/ui/src/components/ai/conversation.tsx
@@ -53,4 +53,4 @@ export const AIConversationScrollButton = () => {
       </Button>
     )
   );
-};
+};
diff --git a/packages/ui/src/components/ai/input.tsx b/packages/ui/src/components/ai/input.tsx
@@ -47,12 +47,12 @@ const useAutoResizeTextarea = ({
       // Calculate new height
       const newHeight = Math.max(
         minHeight,
-        Math.min(textarea.scrollHeight, maxHeight ?? Number.POSITIVE_INFINITY)
+        Math.min(textarea.scrollHeight, maxHeight ?? Number.POSITIVE_INFINITY),
       );
 
       textarea.style.height = `${newHeight}px`;
     },
-    [minHeight, maxHeight]
+    [minHeight, maxHeight],
   );
 
   useEffect(() => {
@@ -79,7 +79,7 @@ export const AIInput = ({ className, ...props }: AIInputProps) => (
   <form
     className={cn(
       "w-full divide-y overflow-hidden rounded-md border bg-background",
-      className
+      className,
     )}
     {...props}
   />
@@ -120,7 +120,7 @@ export const AIInputTextarea = ({
         "w-full resize-none rounded-none border-none p-3 shadow-none outline-none ring-0",
         "bg-transparent dark:bg-transparent",
         "focus-visible:ring-0",
-        className
+        className,
       )}
       name="message"
       onChange={(e) => {
@@ -154,7 +154,7 @@ export const AIInputTools = ({ className, ...props }: AIInputToolsProps) => (
     className={cn(
       "flex items-center gap-1",
       "[&_button:first-child]:rounded-bl-xl",
-      className
+      className,
     )}
     {...props}
   />
@@ -177,7 +177,7 @@ export const AIInputButton = ({
         "shrink-0 gap-1.5 rounded-lg",
         variant === "ghost" && "text-muted-foreground",
         newSize === "default" && "px-3",
-        className
+        className,
       )}
       size={newSize}
       type="button"
@@ -240,7 +240,7 @@ export const AIInputModelSelectTrigger = ({
     className={cn(
       "border-none bg-transparent font-medium text-muted-foreground shadow-none transition-colors",
       'hover:bg-accent hover:text-foreground [&[aria-expanded="true"]]:bg-accent [&[aria-expanded="true"]]:text-foreground',
-      className
+      className,
     )}
     {...props}
   />
@@ -273,4 +273,4 @@ export const AIInputModelSelectValue = ({
   ...props
 }: AIInputModelSelectValueProps) => (
   <SelectValue className={cn(className)} {...props} />
-);
+);
diff --git a/packages/ui/src/components/ai/message.tsx b/packages/ui/src/components/ai/message.tsx
@@ -1,5 +1,9 @@
 import type { ComponentProps, HTMLAttributes } from "react";
-import { Avatar, AvatarFallback, AvatarImage } from "@workspace/ui/components/avatar";
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+} from "@workspace/ui/components/avatar";
 import { cn } from "@workspace/ui/lib/utils";
 
 export type AIMessageProps = HTMLAttributes<HTMLDivElement> & {
@@ -12,7 +16,7 @@ export const AIMessage = ({ className, from, ...props }: AIMessageProps) => (
       "group flex w-full items-end justify-end gap-2 py-2",
       from === "user" ? "is-user" : "is-assistant flex-row-reverse justify-end",
       "[&>div]:max-w-[80%]",
-      className
+      className,
     )}
     {...props}
   />
@@ -31,7 +35,7 @@ export const AIMessageContent = ({
       "flex flex-col gap-2 rounded-lg border border-border px-3 py-2 text-sm",
       "bg-background text-foreground",
       "group-[.is-user]:border-transparent group-[.is-user]:bg-gradient-to-b group-[.is-user]:from-primary group-[.is-user]:to-[#0b63f3] group-[.is-user]:text-primary-foreground",
-      className
+      className,
     )}
     {...props}
   >
@@ -54,4 +58,4 @@ export const AIMessageAvatar = ({
     <AvatarImage alt="" className="mt-0 mb-0" src={src} />
     <AvatarFallback>{name?.slice(0, 2) || "ME"}</AvatarFallback>
   </Avatar>
-);
+);
diff --git a/packages/ui/src/components/ai/reasoning.tsx b/packages/ui/src/components/ai/reasoning.tsx
@@ -165,4 +165,4 @@ export const AIReasoningContent = memo(
 
 AIReasoning.displayName = "AIReasoning";
 AIReasoningTrigger.displayName = "AIReasoningTrigger";
-AIReasoningContent.displayName = "AIReasoningContent";
+AIReasoningContent.displayName = "AIReasoningContent";
diff --git a/packages/ui/src/components/ai/response.tsx b/packages/ui/src/components/ai/response.tsx
@@ -104,4 +104,4 @@ export const AIResponse = memo(
   (prevProps, nextProps) => prevProps.children === nextProps.children,
 );
 
-AIResponse.displayName = "AIResponse";
+AIResponse.displayName = "AIResponse";
diff --git a/packages/ui/src/components/ai/source.tsx b/packages/ui/src/components/ai/source.tsx
@@ -73,4 +73,4 @@ export const AISource = ({
       </>
     )}
   </a>
-); 
+);
diff --git a/packages/ui/src/components/ai/suggestion.tsx b/packages/ui/src/components/ai/suggestion.tsx
@@ -53,4 +53,4 @@ export const AISuggestion = ({
       {children || suggestion}
     </Button>
   );
-};
+};
diff --git a/packages/ui/src/components/ai/tool.tsx b/packages/ui/src/components/ai/tool.tsx
@@ -27,7 +27,7 @@ export const AITool = ({ className, ...props }: AIToolProps) => (
   <Collapsible
     className={cn(
       "not-prose mb-4 w-full rounded-md border bg-background",
-      className
+      className,
     )}
     {...props}
   />
@@ -71,7 +71,7 @@ export const AIToolHeader = ({
   <CollapsibleTrigger
     className={cn(
       "flex w-full items-center justify-between gap-4 p-3",
-      className
+      className,
     )}
     {...props}
   >
@@ -139,11 +139,11 @@ export const AIToolResult = ({
           "overflow-x-auto rounded-md p-3 text-xs",
           error
             ? "bg-destructive/10 text-destructive"
-            : "bg-muted/50 text-foreground"
+            : "bg-muted/50 text-foreground",
         )}
       >
         {error ? <div>{error}</div> : <div>{result}</div>}
       </div>
     </div>
   );
-};
+};
-Original file line number
+Diff line change
@@ Expand Up @@
           {currentBranch + 1} of {totalBranches}
         </span>
       );
-    };
+    };