From d6239d162b945fa4d169af23cf695e61ffbdb213 Mon Sep 17 00:00:00 2001
From: Sasha <aliaksandr@comet.com>
Date: Wed, 6 Nov 2024 13:03:53 +0100
Subject: [PATCH] [OPIK-319]: fix the eslint issues;

---
 .../pages/PromptPage/PromptTab/CommitsTab.tsx |  2 +-
 .../PromptPage/PromptTab/EditPromptDialog.tsx |  4 ++--
 .../pages/PromptPage/PromptTab/PromptTab.tsx  | 10 ++++-----
 .../pages/PromptsPage/AddEditPromptDialog.tsx |  4 ++--
 .../pages/PromptsPage/PromptsPage.tsx         | 21 +++++++++++--------
 5 files changed, 22 insertions(+), 19 deletions(-)

diff --git a/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/CommitsTab.tsx b/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/CommitsTab.tsx
index ab43b8137..1a7b26fc7 100644
--- a/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/CommitsTab.tsx
+++ b/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/CommitsTab.tsx
@@ -86,7 +86,7 @@ const CommitsTab = ({ prompt }: CommitsTabInterface) => {
         });
       }
     },
-    [prompt?.id],
+    [prompt?.id, navigate, workspaceName],
   );
 
   if (isPending) {
diff --git a/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/EditPromptDialog.tsx b/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/EditPromptDialog.tsx
index 8fbf17b05..87aa80a54 100644
--- a/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/EditPromptDialog.tsx
+++ b/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/EditPromptDialog.tsx
@@ -46,7 +46,7 @@ const EditPromptDialog: React.FunctionComponent<EditPromptDialogProps> = ({
 
   return (
     <Dialog open={open} onOpenChange={setOpen}>
-      <DialogContent className="smax-w-lg sm:max-w-[720px]">
+      <DialogContent className="max-w-lg sm:max-w-[720px]">
         <DialogHeader>
           <DialogTitle>Edit prompt</DialogTitle>
         </DialogHeader>
@@ -56,7 +56,7 @@ const EditPromptDialog: React.FunctionComponent<EditPromptDialogProps> = ({
             can access older versions of the prompt from the <b>Commits</b> tab.
           </p>
 
-          <div className="pt-4 pb-4">
+          <div className="py-4">
             <Label htmlFor="promptTemplate">Prompt</Label>
             <Textarea
               className="comet-code h-[400px]"
diff --git a/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/PromptTab.tsx b/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/PromptTab.tsx
index eda61f32c..96f8bb572 100644
--- a/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/PromptTab.tsx
+++ b/apps/opik-frontend/src/components/pages/PromptPage/PromptTab/PromptTab.tsx
@@ -60,13 +60,13 @@ const PromptTab = ({ prompt }: PromptTabInterface) => {
     if (prompt?.latest_version?.id && !activeVersionId) {
       setActiveVersionId(prompt.latest_version.id);
     }
-  }, [prompt?.latest_version?.id, activeVersionId]);
+  }, [prompt?.latest_version?.id, activeVersionId, setActiveVersionId]);
 
   useEffect(() => {
     return () => {
       setActiveVersionId(null);
     };
-  }, []);
+  }, [setActiveVersionId]);
 
   if (!prompt) {
     return <Loader />;
@@ -87,10 +87,10 @@ const PromptTab = ({ prompt }: PromptTabInterface) => {
           </Button>
         </div>
 
-        <div className="flex items-stretch rounded-md border bg-white px-6 pb-6 pt-6 mt-6 gap-2">
-          <div className="flex flex-col flex-grow">
+        <div className="flex items-stretch rounded-md border bg-white p-6 mt-6 gap-2">
+          <div className="flex flex-col grow">
             <p className="comet-body-s-accented text-foreground">Prompt</p>
-            <code className="comet-code w-full break-words whitespace-pre-wrap rounded-md bg-[#FBFCFD] p-3 flex mt-2 h-full">
+            <code className="comet-code size-full break-words whitespace-pre-wrap rounded-md bg-[#FBFCFD] p-3 flex mt-2">
               {activeVersion?.template}
             </code>
           </div>
diff --git a/apps/opik-frontend/src/components/pages/PromptsPage/AddEditPromptDialog.tsx b/apps/opik-frontend/src/components/pages/PromptsPage/AddEditPromptDialog.tsx
index a4de8aa58..908c29fad 100644
--- a/apps/opik-frontend/src/components/pages/PromptsPage/AddEditPromptDialog.tsx
+++ b/apps/opik-frontend/src/components/pages/PromptsPage/AddEditPromptDialog.tsx
@@ -52,7 +52,7 @@ const AddEditPromptDialog: React.FunctionComponent<AddPromptDialogProps> = ({
         ...(description ? { description } : {}),
       },
     });
-  }, [name, description, template]);
+  }, [name, description, template, promptCreateMutation.mutate]);
 
   const editPrompt = useCallback(() => {
     promptUpdateMutation.mutate({
@@ -62,7 +62,7 @@ const AddEditPromptDialog: React.FunctionComponent<AddPromptDialogProps> = ({
         ...(description ? { description } : {}),
       },
     });
-  }, [name, description, defaultPrompt?.id]);
+  }, [name, description, defaultPrompt?.id, promptUpdateMutation?.mutate]);
 
   const onActionClick = () => {
     if (isEdit) {
diff --git a/apps/opik-frontend/src/components/pages/PromptsPage/PromptsPage.tsx b/apps/opik-frontend/src/components/pages/PromptsPage/PromptsPage.tsx
index 1060894d6..fc0a4f696 100644
--- a/apps/opik-frontend/src/components/pages/PromptsPage/PromptsPage.tsx
+++ b/apps/opik-frontend/src/components/pages/PromptsPage/PromptsPage.tsx
@@ -138,15 +138,18 @@ const PromptsPage: React.FunctionComponent = () => {
     resetDialogKeyRef.current = resetDialogKeyRef.current + 1;
   }, []);
 
-  const handleRowClick = useCallback((prompt: Prompt) => {
-    navigate({
-      to: "/$workspaceName/prompts/$promptId",
-      params: {
-        promptId: prompt.id,
-        workspaceName,
-      },
-    });
-  }, []);
+  const handleRowClick = useCallback(
+    (prompt: Prompt) => {
+      navigate({
+        to: "/$workspaceName/prompts/$promptId",
+        params: {
+          promptId: prompt.id,
+          workspaceName,
+        },
+      });
+    },
+    [navigate, workspaceName],
+  );
 
   if (isPending) {
     return <Loader />;