chore(lint-BIOME): Improving errors and warnings (elizaOS#2990)

* clean up 15 errors and 60 warnings * smoke * smokeTest pass remove track * set up lockfile --------- Co-authored-by: Sero <[email protected]> Co-authored-by: Sayo <[email protected]>
indowebdeveloper · Jan 30, 2025 · 4b9510d · 4b9510d
1 parent 37c812c
commit 4b9510d
Show file tree

Hide file tree

Showing 33 changed files with 837 additions and 813 deletions.
diff --git a/agent/src/__tests__/client-type-identification.test.ts b/agent/src/__tests__/client-type-identification.test.ts
@@ -4,8 +4,8 @@ import { describe, it, expect } from "@jest/globals";
 // Helper function to identify client types
 function determineClientType(client: Client): string {
     // Check if client has a direct type identifier
-    if ("type" in client) {
-        return (client as any).type;
+    if ("type" in client && typeof client.type === "string") {
+        return client.type;
     }
 
     // Check constructor name

diff --git a/client/src/components/app-sidebar.tsx b/client/src/components/app-sidebar.tsx
@@ -37,6 +37,7 @@ export function AppSidebar() {
                         <SidebarMenuButton size="lg" asChild>
                             <NavLink to="/">
                                 <img
+                                    alt="elizaos-icon"
                                     src="/elizaos-icon.png"
                                     width="100%"
                                     height="100%"
@@ -62,8 +63,8 @@ export function AppSidebar() {
                             {query?.isPending ? (
                                 <div>
                                     {Array.from({ length: 5 }).map(
-                                        (_, index) => (
-                                            <SidebarMenuItem key={index}>
+                                        (_, _index) => (
+                                            <SidebarMenuItem key={"skeleton-item"}>
                                                 <SidebarMenuSkeleton />
                                             </SidebarMenuItem>
                                         )

diff --git a/client/src/components/array-input.tsx b/client/src/components/array-input.tsx
@@ -13,8 +13,8 @@ export default function ArrayInput({
             <Label>{title}</Label>
             <div className="p-2 bg-card rounded-md border">
                 <div className="space-y-2">
-                    {data?.map((b: string, idx: number) => (
-                        <Input value={b} key={idx} className="bg-background" />
+                    {data?.map((b: string, _idx: number) => (
+                        <Input value={b} key={b} className="bg-background" />
                     ))}
                 </div>
             </div>

diff --git a/client/src/components/audio-recorder.tsx b/client/src/components/audio-recorder.tsx
@@ -43,8 +43,7 @@ export const AudioRecorder = ({
     const { toast } = useToast();
     // States
     const [isRecording, setIsRecording] = useState<boolean>(false);
-    // @ts-expect-error - isRecordingFinished is unused, but would break the 2D array if removed
-    const [isRecordingFinished, setIsRecordingFinished] =
+    const [_, setIsRecordingFinished] =
         useState<boolean>(false);
     const [timer, setTimer] = useState<number>(0);
     const [currentRecord, setCurrentRecord] = useState<Record>({
@@ -96,7 +95,7 @@ export const AudioRecorder = ({
     });
 
     function startRecording() {
-        if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
+        if (navigator.mediaDevices?.getUserMedia) {
             navigator.mediaDevices
                 .getUserMedia({
                     audio: true,
@@ -182,7 +181,9 @@ export const AudioRecorder = ({
             analyser.disconnect();
         }
         if (stream) {
-            stream.getTracks().forEach((track) => track.stop());
+            for (const track of stream.getTracks()) {
+                track.stop();
+            }
         }
         if (audioContext) {
             audioContext.close();

diff --git a/client/src/components/chat.tsx b/client/src/components/chat.tsx
@@ -8,7 +8,7 @@ import { ChatInput } from "@/components/ui/chat/chat-input";
 import { ChatMessageList } from "@/components/ui/chat/chat-message-list";
 import { useTransition, animated, type AnimatedProps } from "@react-spring/web";
 import { Paperclip, Send, X } from "lucide-react";
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useRef, useState, useCallback } from "react";
 import type { Content, UUID } from "@elizaos/core";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { apiClient } from "@/lib/api";
@@ -49,12 +49,13 @@ export default function Page({ agentId }: { agentId: UUID }) {
     const getMessageVariant = (role: string) =>
         role !== "user" ? "received" : "sent";
 
-    const scrollToBottom = () => {
+    const scrollToBottom = useCallback(() => {
         if (messagesContainerRef.current) {
             messagesContainerRef.current.scrollTop =
                 messagesContainerRef.current.scrollHeight;
         }
-    };
+    }, []);
+
     useEffect(() => {
         scrollToBottom();
     }, [queryClient.getQueryData(["messages", agentId])]);
@@ -153,7 +154,7 @@ export default function Page({ agentId }: { agentId: UUID }) {
 
     const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
         const file = e.target.files?.[0];
-        if (file && file.type.startsWith("image/")) {
+        if (file?.type.startsWith("image/")) {
             setSelectedFile(file);
         }
     };
@@ -176,12 +177,12 @@ export default function Page({ agentId }: { agentId: UUID }) {
         <div className="flex flex-col w-full h-[calc(100dvh)] p-4">
             <div className="flex-1 overflow-y-auto">
                 <ChatMessageList ref={messagesContainerRef}>
-                    {transitions((styles, message) => {
+                    {transitions((style, message: ContentWithUser) => {
                         const variant = getMessageVariant(message?.user);
                         return (
                             <CustomAnimatedDiv
                                 style={{
-                                    ...styles,
+                                    ...style,
                                     display: "flex",
                                     flexDirection: "column",
                                     gap: "0.5rem",
@@ -211,22 +212,21 @@ export default function Page({ agentId }: { agentId: UUID }) {
                                             {/* Attachments */}
                                             <div>
                                                 {message?.attachments?.map(
-                                                    (attachment, idx) => (
+                                                    (attachment: IAttachment) => (
                                                         <div
                                                             className="flex flex-col gap-1 mt-2"
-                                                            key={idx}
+                                                            key={`${attachment.url}-${attachment.title}`}
                                                         >
                                                             <img
-                                                                src={
-                                                                    attachment.url
-                                                                }
+                                                                alt="attachment"
+                                                                src={attachment.url}
                                                                 width="100%"
                                                                 height="100%"
                                                                 className="w-64 rounded-md"
                                                             />
                                                             <div className="flex items-center justify-between gap-4">
-                                                                <span></span>
-                                                                <span></span>
+                                                                <span />
+                                                                <span />
                                                             </div>
                                                         </div>
                                                     )
@@ -298,6 +298,7 @@ export default function Page({ agentId }: { agentId: UUID }) {
                                     <X />
                                 </Button>
                                 <img
+                                    alt="Selected file"
                                     src={URL.createObjectURL(selectedFile)}
                                     height="100%"
                                     width="100%"

diff --git a/client/src/components/copy-button.tsx b/client/src/components/copy-button.tsx
@@ -3,7 +3,7 @@ import { useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 
-const CopyButton = ({ text }: { text: any }) => {
+const CopyButton = ({ text }: { text: string }) => {
     const [copied, setCopied] = useState(false);
 
     const handleCopy = () => {

diff --git a/client/src/components/ui/breadcrumb.tsx b/client/src/components/ui/breadcrumb.tsx
@@ -62,6 +62,7 @@ const BreadcrumbPage = React.forwardRef<
     React.ComponentPropsWithoutRef<"span">
 >(({ className, ...props }, ref) => (
     <span
+        tabIndex={0}
         ref={ref}
         role="link"
         aria-disabled="true"

diff --git a/client/src/components/ui/chat/chat-tts-button.tsx b/client/src/components/ui/chat/chat-tts-button.tsx
@@ -62,8 +62,6 @@ export default function ChatTtsButton({
         if (audioBlob) {
             play();
             return;
-        } else {
-            mutation.mutate();
         }
     };
 
@@ -72,7 +70,7 @@ export default function ChatTtsButton({
     return (
         <div>
             {audioBlob ? (
-                <audio
+                <audio crossOrigin="anonymous" playsInline
                     ref={audioRef}
                     onEnded={() => {
                         setPlaying(false);

diff --git a/client/src/components/ui/chat/hooks/useAutoScroll.tsx b/client/src/components/ui/chat/hooks/useAutoScroll.tsx
@@ -13,7 +13,7 @@ interface UseAutoScrollOptions {
 }
 
 export function useAutoScroll(options: UseAutoScrollOptions = {}) {
-    const { offset = 20, smooth = false, content } = options;
+    const { offset = 20, smooth = false } = options;
     const scrollRef = useRef<HTMLDivElement>(null);
     const lastContentHeight = useRef(0);
     const userHasScrolled = useRef(false);
@@ -94,7 +94,7 @@ export function useAutoScroll(options: UseAutoScrollOptions = {}) {
             }
             lastContentHeight.current = currentHeight;
         }
-    }, [content, scrollState.autoScrollEnabled, scrollToBottom]);
+    }, [scrollState.autoScrollEnabled, scrollToBottom]);
 
     useEffect(() => {
         const element = scrollRef.current;

diff --git a/client/src/components/ui/chat/message-loading.tsx b/client/src/components/ui/chat/message-loading.tsx
@@ -2,6 +2,8 @@
 export default function MessageLoading() {
     return (
         <svg
+            role="img"
+            aria-label="Loading animation"
             width="24"
             height="24"
             viewBox="0 0 24 24"

diff --git a/client/src/hooks/use-toast.ts b/client/src/hooks/use-toast.ts
@@ -92,9 +92,9 @@ export const reducer = (state: State, action: Action): State => {
             if (toastId) {
                 addToRemoveQueue(toastId);
             } else {
-                state.toasts.forEach((toast) => {
+                for (const toast of state.toasts) {
                     addToRemoveQueue(toast.id);
-                });
+                }
             }
 
             return {
@@ -129,9 +129,9 @@ let memoryState: State = { toasts: [] };
 
 function dispatch(action: Action) {
     memoryState = reducer(memoryState, action);
-    listeners.forEach((listener) => {
+    for (const listener of listeners) {
         listener(memoryState);
-    });
+    }
 }
 
 type Toast = Omit<ToasterToast, "id">;
@@ -176,7 +176,7 @@ function useToast() {
                 listeners.splice(index, 1);
             }
         };
-    }, [state]);
+    }, []);
 
     return {
         ...state,

diff --git a/client/src/hooks/use-version.tsx b/client/src/hooks/use-version.tsx
@@ -60,7 +60,7 @@ export default function useVersion() {
                 }
             }
         } catch (e) {
-            console.error("Unable to retrieve latest version from GitHub");
+            console.error(`Unable to retrieve latest version from GitHub: ${e}`);
         }
     };
 

diff --git a/client/src/lib/api.ts b/client/src/lib/api.ts
@@ -25,36 +25,41 @@ const fetcher = async ({
 
     if (method === "POST") {
         if (body instanceof FormData) {
-            // @ts-expect-error - Suppressing potentially undefined options header
-            delete options.headers["Content-Type"];
+            if (options.headers && typeof options.headers === 'object') {
+                // Create new headers object without Content-Type
+                options.headers = Object.fromEntries(
+                    Object.entries(options.headers as Record<string, string>)
+                        .filter(([key]) => key !== 'Content-Type')
+                );
+            }
             options.body = body;
         } else {
             options.body = JSON.stringify(body);
         }
     }
 
     return fetch(`${BASE_URL}${url}`, options).then(async (resp) => {
-        if (resp.ok) {
-            const contentType = resp.headers.get("Content-Type");
-
-            if (contentType === "audio/mpeg") {
-                return await resp.blob();
-            }
-            return resp.json();
+        const contentType = resp.headers.get('Content-Type');
+        if (contentType === "audio/mpeg") {
+            return await resp.blob();
         }
 
-        const errorText = await resp.text();
-        console.error("Error: ", errorText);
+        if (!resp.ok) {
+            const errorText = await resp.text();
+            console.error("Error: ", errorText);
 
-        let errorMessage = "An error occurred.";
-        try {
-            const errorObj = JSON.parse(errorText);
-            errorMessage = errorObj.message || errorMessage;
-        } catch {
-            errorMessage = errorText || errorMessage;
-        }
+            let errorMessage = "An error occurred.";
+            try {
+                const errorObj = JSON.parse(errorText);
+                errorMessage = errorObj.message || errorMessage;
+            } catch {
+                errorMessage = errorText || errorMessage;
+            }
 
-        throw new Error(errorMessage);
+            throw new Error(errorMessage);
+        }
+
+        return resp.json();
     });
 };
 

diff --git a/client/src/lib/info.json b/client/src/lib/info.json
@@ -1 +1 @@
-{"version": "0.1.9-alpha.1"}
+{"version": "0.1.9"}
diff --git a/client/src/main.tsx b/client/src/main.tsx
@@ -3,7 +3,13 @@ import { createRoot } from "react-dom/client";
 import "./index.css";
 import App from "./App.tsx";
 
-createRoot(document.getElementById("root")!).render(
+const rootElement = document.getElementById("root");
+
+if (!rootElement) {
+    throw new Error("Root element not found");
+}
+
+createRoot(rootElement).render(
     <StrictMode>
         <App />
     </StrictMode>

diff --git a/client/src/types.ts b/client/src/types.ts
@@ -0,0 +1,6 @@
+// Update the IAttachment interface
+export interface IAttachment {
+    url: string;
+    contentType?: string; // Make contentType optional
+    title: string;
+}
diff --git a/client/vite.config.ts b/client/vite.config.ts
@@ -1,7 +1,7 @@
 import { defineConfig, loadEnv } from "vite";
 import react from "@vitejs/plugin-react-swc";
 import viteCompression from "vite-plugin-compression";
-import path from "path";
+import path from "node:path";
 
 // https://vite.dev/config/
 export default defineConfig(({ mode }) => {

diff --git a/packages/_examples/plugin-with-di/src/actions/sampleAction.ts b/packages/_examples/plugin-with-di/src/actions/sampleAction.ts
@@ -94,11 +94,11 @@ const options: ActionOptions<CreateResourceContent> = {
  */
 @injectable()
 export class CreateResourceAction extends BaseInjectableAction<CreateResourceContent> {
-    constructor(
-        @inject(SampleProvider)
-        private readonly sampleProvider: SampleProvider
-    ) {
+    private sampleProvider: SampleProvider;
+
+    constructor(sampleProvider: SampleProvider) {
         super(options);
+        this.sampleProvider = sampleProvider;
     }
 
     async validate(

diff --git a/packages/_examples/plugin-with-di/src/providers/sampleProvider.ts b/packages/_examples/plugin-with-di/src/providers/sampleProvider.ts
@@ -25,10 +25,11 @@ export class SampleProvider
 {
     private _sharedInstance: Record<string, string>;
 
-    constructor(
-        @inject("DYNAMIC_DATA")
-        private readonly dynamicData: Record<string, string>
-    ) {}
+    private dynamicData: Record<string, string>;
+
+    constructor(dynamicData: Record<string, string>) {
+        this.dynamicData = dynamicData;
+    }
 
     // ---- Implementing the InjectableProvider interface ----
-Original file line number
+Diff line change
@@ Expand Up / @@ -60,7 +60,7 @@ export default function useVersion() { @@
                     }
                 }
             } catch (e) {
-                console.error("Unable to retrieve latest version from GitHub");
+                console.error(`Unable to retrieve latest version from GitHub: ${e}`);
             }
         };
@@ Expand Down @@