From 421798bd6d888a40ce87391797ccd227e81feef4 Mon Sep 17 00:00:00 2001
From: Chloe Mouret <chloem@theodo.fr>
Date: Fri, 25 Aug 2023 11:45:57 +0200
Subject: [PATCH] add 2 save buttons

---
 .../components/SettingsTab/SettingsTab.tsx       |  9 ++++++++-
 frontend/shared/SaveButton.tsx                   | 16 ++++++++++++++++
 2 files changed, 24 insertions(+), 1 deletion(-)
 create mode 100644 frontend/shared/SaveButton.tsx

diff --git a/frontend/app/brains-management/[brainId]/components/BrainManagementTabs/components/SettingsTab/SettingsTab.tsx b/frontend/app/brains-management/[brainId]/components/BrainManagementTabs/components/SettingsTab/SettingsTab.tsx
index 2aab64d392ce..313a3f60be0c 100644
--- a/frontend/app/brains-management/[brainId]/components/BrainManagementTabs/components/SettingsTab/SettingsTab.tsx
+++ b/frontend/app/brains-management/[brainId]/components/BrainManagementTabs/components/SettingsTab/SettingsTab.tsx
@@ -15,6 +15,7 @@ import {
   paidModels,
 } from "@/lib/context/BrainConfigProvider/types";
 import { defineMaxTokens } from "@/lib/helpers/defineMaxTokens";
+import { SaveButton } from "@/shared/SaveButton";
 
 import { PublicPrompts } from "./components/PublicPrompts/PublicPrompts";
 import { useSettingsTab } from "./hooks/useSettingsTab";
@@ -54,7 +55,7 @@ export const SettingsTab = ({ brainId }: SettingsTabProps): JSX.Element => {
       <div className="flex flex-row flex-1 justify-between w-full">
         <div>
           <Field
-            label={ t("brainName", { ns: "brain" })}
+            label={t("brainName", { ns: "brain" })}
             placeholder={t("brainNamePlaceholder", { ns: "brain" })}
             autoComplete="off"
             className="flex-1"
@@ -140,6 +141,9 @@ export const SettingsTab = ({ brainId }: SettingsTabProps): JSX.Element => {
           {...register("maxTokens")}
         />
       </fieldset>
+      <div className="flex w-full justify-end py-4">
+        <SaveButton handleSubmit={handleSubmit} />
+      </div>
       <Divider text={t("customPromptSection", { ns: "config" })} />
       <PublicPrompts onSelect={pickPublicPrompt} />
       <Field
@@ -156,6 +160,9 @@ export const SettingsTab = ({ brainId }: SettingsTabProps): JSX.Element => {
         className="flex-1"
         {...register("prompt.content")}
       />
+      <div className="flex w-full justify-end py-4">
+        <SaveButton handleSubmit={handleSubmit} />
+      </div>
       {promptId !== "" && (
         <Button disabled={isUpdating} onClick={() => void removeBrainPrompt()}>
           {t("removePrompt", { ns: "config" })}
diff --git a/frontend/shared/SaveButton.tsx b/frontend/shared/SaveButton.tsx
new file mode 100644
index 000000000000..fcd7b9c874d1
--- /dev/null
+++ b/frontend/shared/SaveButton.tsx
@@ -0,0 +1,16 @@
+import { ReactElement } from "react";
+
+import Button from "@/lib/components/ui/Button";
+
+interface Props {
+  handleSubmit: (checkDirty: boolean) => Promise<void>;
+}
+export const SaveButton = ({ handleSubmit }: Props): ReactElement => (
+  <Button
+    variant={"primary"}
+    onClick={() => void handleSubmit(false)}
+    type="button"
+  >
+    Save
+  </Button>
+);