feat: add 2 save buttons on Brain management tab (#1039)

* add 2 save buttons

* use translation

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";
@@ -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" })}

frontend/public/locales/en/translation.json

@@ -43,5 +43,6 @@
   "comingSoon": "Coming soon",
   "Viewer": "Viewer",
   "Editor": "Editor",
-    "Owner": "Owner"
+  "Owner": "Owner",
+  "saveButton": "Save"
 }

frontend/public/locales/es/translation.json

@@ -43,5 +43,6 @@
   "Upload": "Subir",
   "uploadButton": "Subir",
   "uploadingButton": "Subiendo...",
-    "Viewer": "Espectador"
+  "Viewer": "Espectador",
+  "saveButton": "Guardar"
 }

frontend/public/locales/fr/translation.json

@@ -43,5 +43,6 @@
   "comingSoon": "Bientôt disponible",
   "Viewer": "Visualiseur",
   "Editor": "Éditeur",
-    "Owner": "Propriétaire"
+  "Owner": "Propriétaire",
+  "saveButton": "Sauvegarder"
 }

frontend/public/locales/pt-br/translation.json

@@ -43,5 +43,6 @@
   "comingSoon": "Em breve",
   "Viewer": "Visualizador",
   "Editor": "Editor",
-    "Owner": "Proprietário"
+  "Owner": "Proprietário",
+  "saveButton": "Salvar"
 }

frontend/public/locales/ru/translation.json

@@ -43,5 +43,6 @@
   "comingSoon": "Скоро",
   "Viewer": "Просмотр",
   "Editor": "Редактор",
-    "Owner": "Владелец"
+  "Owner": "Владелец",
+  "saveButton": "Сохранить"
 }

frontend/public/locales/zh-cn/translation.json

@@ -43,5 +43,6 @@
   "comingSoon": "即将推出",
   "Viewer": "查看",
   "Editor": "编辑",
-    "Owner": "作者"
+  "Owner": "作者",
+  "saveButton": "保存"
 }

frontend/shared/SaveButton.tsx

@@ -0,0 +1,21 @@
+import { ReactElement } from "react";
+import { useTranslation } from "react-i18next";
+
+import Button from "@/lib/components/ui/Button";
+
+interface Props {
+  handleSubmit: (checkDirty: boolean) => Promise<void>;
+}
+export const SaveButton = ({ handleSubmit }: Props): ReactElement => {
+  const { t } = useTranslation(["translation"]);
+
+  return (
+    <Button
+      variant={"primary"}
+      onClick={() => void handleSubmit(true)}
+      type="button"
+    >
+      {t("saveButton")}
+    </Button>
+  );
+};