From 431eb919b5183cb3b9cf8857baef81ecb32a6f84 Mon Sep 17 00:00:00 2001
From: josh <144584931+dancer@users.noreply.github.com>
Date: Mon, 8 Sep 2025 21:02:06 +0100
Subject: [PATCH] fix: lint workflow (#1167)

---
 .github/workflows/lint.yml          |  1 -
 app/(auth)/login/page.tsx           |  2 +-
 app/(auth)/register/page.tsx        |  2 +-
 app/(chat)/api/chat/route.ts        |  2 +-
 components/chat.tsx                 |  2 +-
 components/elements/branch.tsx      |  7 +++++--
 components/elements/image.tsx       |  1 +
 components/elements/message.tsx     |  2 +-
 components/elements/source.tsx      |  4 ++--
 components/elements/web-preview.tsx |  2 +-
 components/message.tsx              |  2 +-
 components/messages.tsx             |  4 ++--
 components/multimodal-input.tsx     |  4 ++--
 components/preview-attachment.tsx   | 13 ++++++++-----
 lib/ai/models.mock.ts               |  2 +-
 15 files changed, 28 insertions(+), 22 deletions(-)

diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml
index e24fc77..1d57a67 100644
--- a/.github/workflows/lint.yml
+++ b/.github/workflows/lint.yml
@@ -23,4 +23,3 @@ jobs:
         run: pnpm install
       - name: Run lint
         run: pnpm lint
-1
\ No newline at end of file
diff --git a/app/(auth)/login/page.tsx b/app/(auth)/login/page.tsx
index 33e9e82..e5be52a 100644
--- a/app/(auth)/login/page.tsx
+++ b/app/(auth)/login/page.tsx
@@ -42,7 +42,7 @@ export default function Page() {
       updateSession();
       router.refresh();
     }
-  }, [state.status]);
+  }, [state.status, router, updateSession]);
 
   const handleSubmit = (formData: FormData) => {
     setEmail(formData.get('email') as string);
diff --git a/app/(auth)/register/page.tsx b/app/(auth)/register/page.tsx
index ab2ee82..ce3e0c4 100644
--- a/app/(auth)/register/page.tsx
+++ b/app/(auth)/register/page.tsx
@@ -43,7 +43,7 @@ export default function Page() {
       updateSession();
       router.refresh();
     }
-  }, [state]);
+  }, [state, router, updateSession]);
 
   const handleSubmit = (formData: FormData) => {
     setEmail(formData.get('email') as string);
diff --git a/app/(chat)/api/chat/route.ts b/app/(chat)/api/chat/route.ts
index 002b9a4..9c6a84f 100644
--- a/app/(chat)/api/chat/route.ts
+++ b/app/(chat)/api/chat/route.ts
@@ -2,7 +2,7 @@ import {
   convertToModelMessages,
   createUIMessageStream,
   JsonToSseTransformStream,
-  LanguageModelUsage,
+  type LanguageModelUsage,
   smoothStream,
   stepCountIs,
   streamText,
diff --git a/components/chat.tsx b/components/chat.tsx
index 7c36512..711616f 100644
--- a/components/chat.tsx
+++ b/components/chat.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { DefaultChatTransport, LanguageModelUsage } from 'ai';
+import { DefaultChatTransport, type LanguageModelUsage } from 'ai';
 import { useChat } from '@ai-sdk/react';
 import { useEffect, useState } from 'react';
 import useSWR, { useSWRConfig } from 'swr';
diff --git a/components/elements/branch.tsx b/components/elements/branch.tsx
index dbb8f64..b730e18 100644
--- a/components/elements/branch.tsx
+++ b/components/elements/branch.tsx
@@ -5,7 +5,7 @@ import { cn } from '@/lib/utils';
 import type { UIMessage } from 'ai';
 import { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';
 import type { ComponentProps, HTMLAttributes, ReactElement } from 'react';
-import { createContext, useContext, useEffect, useState } from 'react';
+import { createContext, useContext, useEffect, useState, useMemo } from 'react';
 
 type BranchContextType = {
   currentBranch: number;
@@ -82,7 +82,10 @@ export type BranchMessagesProps = HTMLAttributes<HTMLDivElement>;
 
 export const BranchMessages = ({ children, ...props }: BranchMessagesProps) => {
   const { currentBranch, setBranches, branches } = useBranch();
-  const childrenArray = Array.isArray(children) ? children : [children];
+  const childrenArray = useMemo(() => 
+    Array.isArray(children) ? children : [children],
+    [children]
+  );
 
   // Use useEffect to update branches when they change
   useEffect(() => {
diff --git a/components/elements/image.tsx b/components/elements/image.tsx
index 011fdf5..cff42cf 100644
--- a/components/elements/image.tsx
+++ b/components/elements/image.tsx
@@ -12,6 +12,7 @@ export const Image = ({
   mediaType,
   ...props
 }: ImageProps) => (
+  // eslint-disable-next-line @next/next/no-img-element
   <img
     {...props}
     alt={props.alt}
diff --git a/components/elements/message.tsx b/components/elements/message.tsx
index feaceaf..d67f038 100644
--- a/components/elements/message.tsx
+++ b/components/elements/message.tsx
@@ -52,7 +52,7 @@ export const MessageAvatar = ({
   ...props
 }: MessageAvatarProps) => (
   <Avatar className={cn('size-8 ring-1 ring-border', className)} {...props}>
-    <AvatarImage alt="" className="mt-0 mb-0" src={src} />
+    <AvatarImage alt="" className="my-0" src={src} />
     <AvatarFallback>{name?.slice(0, 2) || 'ME'}</AvatarFallback>
   </Avatar>
 );
diff --git a/components/elements/source.tsx b/components/elements/source.tsx
index 4fdad35..4165e10 100644
--- a/components/elements/source.tsx
+++ b/components/elements/source.tsx
@@ -32,7 +32,7 @@ export const SourcesTrigger = ({
     {children ?? (
       <>
         <p className="font-medium">Used {count} sources</p>
-        <ChevronDownIcon className="h-4 w-4" />
+        <ChevronDownIcon className="size-4" />
       </>
     )}
   </CollapsibleTrigger>
@@ -66,7 +66,7 @@ export const Source = ({ href, title, children, ...props }: SourceProps) => (
   >
     {children ?? (
       <>
-        <BookIcon className="h-4 w-4" />
+        <BookIcon className="size-4" />
         <span className="block font-medium">{title}</span>
       </>
     )}
diff --git a/components/elements/web-preview.tsx b/components/elements/web-preview.tsx
index 6b5e8f3..a4bcf5b 100644
--- a/components/elements/web-preview.tsx
+++ b/components/elements/web-preview.tsx
@@ -107,7 +107,7 @@ export const WebPreviewNavigationButton = ({
     <Tooltip>
       <TooltipTrigger asChild>
         <Button
-          className="h-8 w-8 p-0 hover:text-foreground"
+          className="size-8 p-0 hover:text-foreground"
           disabled={disabled}
           onClick={onClick}
           size="sm"
diff --git a/components/message.tsx b/components/message.tsx
index 19dcb49..851c23d 100644
--- a/components/message.tsx
+++ b/components/message.tsx
@@ -317,7 +317,7 @@ export const ThinkingMessage = () => {
         </div>
 
         <div className="flex flex-col gap-2 w-full md:gap-4">
-          <div className="px-0 py-0 text-sm text-muted-foreground">
+          <div className="p-0 text-sm text-muted-foreground">
             <LoadingText>Thinking...</LoadingText>
           </div>
         </div>
diff --git a/components/messages.tsx b/components/messages.tsx
index b191845..6b2d116 100644
--- a/components/messages.tsx
+++ b/components/messages.tsx
@@ -58,7 +58,7 @@ function PureMessages({
         }
       });
     }
-  }, [status]);
+  }, [status, messagesContainerRef]);
 
   return (
     <div
@@ -66,7 +66,7 @@ function PureMessages({
       className="overflow-y-scroll flex-1 touch-pan-y overscroll-behavior-contain -webkit-overflow-scrolling-touch"
       style={{ overflowAnchor: 'none' }}
     >
-      <Conversation className="flex flex-col gap-4 px-2 pt-4 pb-4 mx-auto min-w-0 max-w-4xl md:gap-6 md:px-4">
+      <Conversation className="flex flex-col gap-4 px-2 py-4 mx-auto min-w-0 max-w-4xl md:gap-6 md:px-4">
         <ConversationContent className="flex flex-col gap-4 md:gap-6">
           {messages.length === 0 && <Greeting />}
 
diff --git a/components/multimodal-input.tsx b/components/multimodal-input.tsx
index 8477670..cedf253 100644
--- a/components/multimodal-input.tsx
+++ b/components/multimodal-input.tsx
@@ -29,7 +29,7 @@ import {
   PromptInputModelSelectTrigger,
   PromptInputModelSelectContent,
 } from './elements/prompt-input';
-import { SelectItem, SelectValue } from '@/components/ui/select';
+import { SelectItem, } from '@/components/ui/select';
 import equal from 'fast-deep-equal';
 import type { UseChatHelpers } from '@ai-sdk/react';
 import { AnimatePresence, motion } from 'framer-motion';
@@ -353,7 +353,7 @@ function PureMultimodalInput({
           minHeight={44}
           maxHeight={200}
           disableAutoResize={true}
-          className="text-sm resize-none py-3 px-3 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none] bg-transparent !border-0 !border-none outline-none ring-0 focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:outline-none placeholder:text-muted-foreground"
+          className="text-sm resize-none p-3 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none] bg-transparent !border-0 !border-none outline-none ring-0 focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:outline-none placeholder:text-muted-foreground"
           rows={1}
           autoFocus
         />
diff --git a/components/preview-attachment.tsx b/components/preview-attachment.tsx
index caf150b..9d2e1fb 100644
--- a/components/preview-attachment.tsx
+++ b/components/preview-attachment.tsx
@@ -2,6 +2,7 @@ import type { Attachment } from '@/lib/types';
 import { Loader } from './elements/loader';
 import { CrossSmallIcon, } from './icons';
 import { Button } from './ui/button';
+import Image from 'next/image';
 
 export const PreviewAttachment = ({
   attachment,
@@ -17,15 +18,17 @@ export const PreviewAttachment = ({
   const { name, url, contentType } = attachment;
 
   return (
-    <div data-testid="input-attachment-preview" className="group relative w-16 h-16 rounded-lg overflow-hidden bg-muted border">
+    <div data-testid="input-attachment-preview" className="group relative size-16 rounded-lg overflow-hidden bg-muted border">
       {contentType?.startsWith('image') ? (
-        <img
+        <Image
           src={url}
           alt={name ?? 'An image attachment'}
-          className="w-full h-full object-cover"
+          className="size-full object-cover"
+          width={64}
+          height={64}
         />
       ) : (
-        <div className="w-full h-full flex items-center justify-center text-xs text-muted-foreground">
+        <div className="size-full flex items-center justify-center text-xs text-muted-foreground">
           File
         </div>
       )}
@@ -47,7 +50,7 @@ export const PreviewAttachment = ({
         </Button>
       )}
 
-      <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 to-transparent text-white text-[10px] px-1 py-0.5 truncate">
+      <div className="absolute bottom-0 inset-x-0 bg-gradient-to-t from-black/80 to-transparent text-white text-[10px] px-1 py-0.5 truncate">
         {name}
       </div>
     </div>
diff --git a/lib/ai/models.mock.ts b/lib/ai/models.mock.ts
index 97ce212..a849cb5 100644
--- a/lib/ai/models.mock.ts
+++ b/lib/ai/models.mock.ts
@@ -1,4 +1,4 @@
-import { type LanguageModel } from 'ai';
+import type { LanguageModel } from 'ai';
 
 const createMockModel = (): LanguageModel => {
   return {