Save translations

public/locales/en/core.json

@@ -7,7 +7,7 @@
   "continue": "continue",
   "description": "description",
   "edit": "edit",
-  "error": "an error occurred",
+
   "last_height": "last height",
   "loading": "loading...",
   "logout": "logout",
@@ -15,7 +15,19 @@
   "payment_notification": "payment notification",
   "price": "price",
   "q_mail": "q-mail",
-  "save": "save",
+  "result": {
+    "error": {
+      "generic": "an error occurred",
+      "save_qdn": "Unable to save to QDN"
+    },
+    "success": {
+      "publish_qdn": "Sucessfully published to QDN"
+    }
+  },
+  "save_options": {
+    "publish_qdn": "Would you like to publish your settings to QDN (encrypted) ?",
+    "save": "save"
+  },
   "settings": "settings",
   "supply": "supply",
   "title": "title",

public/locales/it/tutorial.json

@@ -12,7 +12,7 @@
   "initial": {
     "6_qort": "avere almeno 6 QORT nel proprio wallet",
     "explore": "esplora",
-    "general_chat": "chat generaleat",
+    "general_chat": "chat generale",
     "getting_started": "come iniziare",
     "register_name": "registra un nome",
     "see_apps": "vedi le apps",

src/components/Save/Save.tsx

@@ -1,6 +1,6 @@
-import React, { useContext, useEffect, useMemo, useState } from 'react';
+import { useContext, useEffect, useMemo, useState } from 'react';
 import { useRecoilState, useSetRecoilState } from 'recoil';
-import isEqual from 'lodash/isEqual'; // Import deep comparison utility
+import isEqual from 'lodash/isEqual'; // TODO Import deep comparison utility
 import {
   canSaveSettingToQdnAtom,
   hasSettingsChangedAtom,
@@ -26,6 +26,7 @@ import {
   base64ToUint8Array,
   uint8ArrayToObject,
 } from '../../backgroundFunctions/encryption';
+import { useTranslation } from 'react-i18next';
 
 export const handleImportClick = async () => {
   const fileInput = document.createElement('input');
@@ -77,6 +78,8 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
   const [anchorEl, setAnchorEl] = useState(null);
   const { show } = useContext(MyContext);
 
+  const { t } = useTranslation(['core']);
+
   const hasChanged = useMemo(() => {
     const newChanges = {
       sortablePinnedApps: pinnedApps.map((item) => {
@@ -146,8 +149,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
         const fee = await getFee('ARBITRARY');
 
         await show({
-          message:
+          message: t('core:save.publish_qnd', { postProcess: 'capitalize' }),
-            'Would you like to publish your settings to QDN (encrypted) ?',
           publishFee: fee.fee + ' QORT',
         });
         const response = await new Promise((res, rej) => {
@@ -165,7 +167,10 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
               rej(response.error);
             })
             .catch((error) => {
-              rej(error.message || 'An error occurred');
+              rej(
+                error.message ||
+                  t('core:result.error.generic', { postProcess: 'capitalize' })
+              );
             });
         });
         if (response?.identifier) {
@@ -173,7 +178,9 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
           setSettingsQdnLastUpdated(Date.now());
           setInfoSnack({
             type: 'success',
-            message: 'Sucessfully published to QDN',
+            message: t('core:result.success.publish_qdn', {
+              postProcess: 'capitalize',
+            }),
           });
           setOpenSnack(true);
           setAnchorEl(null);
@@ -182,7 +189,11 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
     } catch (error) {
       setInfoSnack({
         type: 'error',
-        message: error?.message || 'Unable to save to QDN',
+        message:
+          error?.message ||
+          t('core:result.error.save_qdn', {
+            postProcess: 'capitalize',
+          }),
       });
       setOpenSnack(true);
     } finally {
@@ -214,7 +225,9 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
         {isDesktop ? (
           <IconWrapper
             disableWidth={disableWidth}
-            label="Save"
+            label={t('core:save_options.save', {
+              postProcess: 'capitalize',
+            })}
             selected={false}
           >
             <SaveIcon
@@ -225,6 +238,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
           <SaveIcon color={hasChanged && !isLoading ? '#5EB049' : undefined} />
         )}
       </ButtonBase>
+
       <Popover
         open={!!anchorEl}
         anchorEl={anchorEl}
@@ -247,19 +261,19 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
         {isUsingImportExportSettings && (
           <Box
             sx={{
-              padding: '15px',
               display: 'flex',
               flexDirection: 'column',
               gap: 1,
+              padding: '15px',
               width: '100%',
             }}
           >
             <Box
               sx={{
-                width: '100%',
+                alignItems: 'center',
                 display: 'flex',
                 flexDirection: 'column',
-                alignItems: 'center',
+                width: '100%',
               }}
             >
               <Typography
@@ -268,7 +282,8 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
                 }}
               >
                 You are using the export/import way of saving settings.
-              </Typography>
+              </Typography>{' '}
+              // TODO: translate
               <Spacer height="40px" />
               <Button
                 size="small"
@@ -302,10 +317,10 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
         {!isUsingImportExportSettings && (
           <Box
             sx={{
-              padding: '15px',
               display: 'flex',
               flexDirection: 'column',
               gap: 1,
+              padding: '15px',
               width: '100%',
             }}
           >
@@ -346,7 +361,9 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
                       You have unsaved changes to your pinned apps. Save them to
                       QDN.
                     </Typography>
+
                     <Spacer height="10px" />
+
                     <LoadingButton
                       sx={{
                         backgroundColor: 'var(--green)',
@@ -535,6 +552,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => {
             >
               Import
             </ButtonBase>
+
             <ButtonBase
               onClick={async () => {
                 try {