fix: notification zindex and reset notification text

bfabio · Feb 1, 2024 · 4c722c5 · 4c722c5
1 parent 47d98fa
commit 4c722c5
Show file tree

Hide file tree

Showing 7 changed files with 24 additions and 8 deletions.
diff --git a/src/app/components/Editor.jsx b/src/app/components/Editor.jsx
@@ -198,7 +198,11 @@ export const Editor = (props) => {
   };
 
   const handleReset = () => {
-    notify("Reset", { state: "info" });
+    notify(
+      t("editor.form.reset.notification_title"),
+      t("editor.form.reset.notification_text"),
+      { state: "info", dismissable: true },
+    );
     localStorage.setItem("publiccode-editor", "{}");
     reset({}, { dirtyFields: true });
     setYaml(null);

diff --git a/src/app/components/Foot.tsx b/src/app/components/Foot.tsx
@@ -56,7 +56,7 @@ export const Footer = (props: Props): JSX.Element => {
           onClick={() => props.reset()}
           disabled={!props.languages || props.languages.length === 0}
         >
-          {t("editor.form.reset")}
+          {t("editor.form.reset.button")}
         </button>
       </div>
       {/* <div className="content__foot_item">

diff --git a/src/app/components/Layout.tsx b/src/app/components/Layout.tsx
@@ -1,6 +1,7 @@
 import "../../asset/style.scss";
 import { NotificationManager } from "design-react-kit";
-import { NOTIFICATION_TIMEOUT } from "../contents/constants";
+
+const NOTIFICATION_TIMEOUT = 4_000;
 
 interface Props {
   children: React.ReactNode;
@@ -9,7 +10,7 @@ interface Props {
 
 const Layout = ({ children, isLoading }: Props): JSX.Element => (
   <div className={isLoading ? "wrapper loadingRemote" : "wrapper"}>
-    <NotificationManager duration={NOTIFICATION_TIMEOUT} fix="top" />
+    <NotificationManager duration={NOTIFICATION_TIMEOUT} fix="top" closeOnClick={false} style={{zIndex: 10}} />
     {children}
   </div>
 );

diff --git a/src/app/contents/constants.ts b/src/app/contents/constants.ts
@@ -13,6 +13,5 @@ export const SAMPLE_YAML_URL = `https://raw.githubusercontent.com/italia/publicc
 export const elasticUrl = ELASTIC_URL || "";
 export const defaultCountry = DEFAULT_COUNTRY || "it";
 export const AUTOSAVE_TIMEOUT = 15000;
-export const NOTIFICATION_TIMEOUT = 3000;
 export const DEFAULT_BRANCH = "master";
 export const defaultBranch = { branch: DEFAULT_BRANCH };
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
@@ -22,7 +22,11 @@
       "yamlloading": "Error loading yaml"
     },
     "form": {
-      "reset": "Reset",
+      "reset": {
+        "button":"Reset",
+        "notification_title": "All data cleared",
+        "notification_text": "All entered data has been cleared"
+      },
       "upload": "Upload",
       "validate": "Validate",
       "generate": "Generate",

diff --git a/src/i18n/locales/fr.json b/src/i18n/locales/fr.json
@@ -22,7 +22,11 @@
       "yamlloading": "Error loading yaml"
     },
     "form": {
-      "reset": "Reset",
+      "reset": {
+        "button":"Reset",
+        "notification_title": "All data cleared",
+        "notification_text": "All entered data has been cleared"
+      },
       "upload": "Upload",
       "validate": "Validate",
       "generate": "Generate",

diff --git a/src/i18n/locales/it.json b/src/i18n/locales/it.json
@@ -22,7 +22,11 @@
       "yamlloading": "Errore nel caricamento dello yaml"
     },
     "form": {
-      "reset": "Reset",
+      "reset": {
+        "button":"Reimposta",
+        "notification_title": "Dati cancellati",
+        "notification_text": "Tutti i dati inseriti sono stati cancellati"
+      },
       "upload": "Carica",
       "validate": "Valida",
       "generate": "Genera",