Add translations

public/locales/en/core.json

@@ -35,28 +35,17 @@
     "one": "one"
   },
   "description": "description",
+  "downloading_qdn": "downloading from QDN",
   "fee": {
     "payment": "payment fee",
     "publish": "publish fee"
   },
   "general_settings": "general settings",
-  "page": {
-    "last": "last",
-    "first": "first",
-    "next": "next",
-    "previous": "previous"
-  },
-  "downloading_qdn": "downloading from QDN",
   "invite_list": "invite list",
   "last_height": "last height",
   "loading": "loading...",
   "loading_posts": "loading posts... please wait.",
   "message_us": "please message us on Telegram or Discord if you need 4 QORT to start chatting without any limitations",
-  "minting_status": "minting status",
-  "new_user": "are you a new user?",
-  "payment_notification": "payment notification",
-  "price": "price",
-  "q_mail": "q-mail",
   "message": {
     "error": {
       "generic": "an error occurred",
@@ -76,6 +65,17 @@
       "transfer": "the transfer was succesful!"
     }
   },
+  "minting_status": "minting status",
+  "new_user": "are you a new user?",
+  "page": {
+    "last": "last",
+    "first": "first",
+    "next": "next",
+    "previous": "previous"
+  },
+  "payment_notification": "payment notification",
+  "price": "price",
+  "q_mail": "q-mail",
   "save_options": {
     "no_pinned_changes": "you currently do not have any changes to your pinned apps",
     "overwrite_changes": "the app was unable to download your existing QDN-saved pinned apps. Would you like to overwrite those changes?",

public/locales/en/group.json

@@ -25,7 +25,8 @@
     "description": "description of group",
     "invites": "group invites",
     "management": "group management",
-    "name": "name of group",
+    "member_number": "number of members",
+    "name": "group name",
     "open": "open (public)",
     "type": "group type"
   },
@@ -37,6 +38,8 @@
   },
   "message": {
     "generic": {
+      "already_in_group": "you are already in this group!",
+      "closed_group": "this is a closed/private group, so you will need to wait until an admin accepts your request",
       "descrypt_wallet": "decrypting wallet...",
       "encryption_key": "the group's first common encryption key is in the process of creation. Please wait a few minutes for it to be retrieved by the network. Checking every 2 minutes...",
       "group_invited_you": "{{group}} has invited you",
@@ -64,6 +67,8 @@
       "group_join": "successfully requested to join group. It may take a couple of minutes for the changes to propagate",
       "group_join_name": "joined group {{group_name}}: awaiting confirmation",
       "group_join_label": "joined group {{name}}: success!",
+      "group_join_request": "requested to join Group {{group_name}}: awaiting confirmation",
+      "group_join_outcome": "requested to join Group {{group_name}}: success!",
       "loading_threads": "loading threads... please wait.",
       "unbanned_user": "successfully unbanned user. It may take a couple of minutes for the changes to propagate"
     }

src/components/Auth/DownloadWallet.tsx

@@ -63,6 +63,7 @@ export const DownloadWallet = ({
       wallet,
       qortAddress: rawWallet.address0,
     });
+
     return {
       wallet,
       qortAddress: rawWallet.address0,

src/components/Desktop/DesktopFooter.tsx

@@ -3,10 +3,8 @@ import Box from '@mui/material/Box';
 import { HubsIcon } from '../../assets/Icons/HubsIcon';
 import { MessagingIcon } from '../../assets/Icons/MessagingIcon';
 import AppIcon from '../../assets/svgs/AppIcon.svg';
-
 import { HomeIcon } from '../../assets/Icons/HomeIcon';
 import { Save } from '../Save/Save';
-
 import { enabledDevModeAtom } from '../../atoms/global';
 import { useAtom } from 'jotai';
 

src/components/Desktop/DesktopHeader.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { useState } from 'react';
 import { ButtonBase, Typography, useTheme } from '@mui/material';
 import Box from '@mui/material/Box';
 import { NotificationIcon2 } from '../../assets/Icons/NotificationIcon2';
@@ -81,18 +81,18 @@ export const DesktopHeader = ({
   setGroupSection,
   isPrivate,
 }) => {
-  const [value, setValue] = React.useState(0);
+  const [value, setValue] = useState(0);
   const theme = useTheme();
   return (
     <Box
       sx={{
-        width: '100%',
-        display: 'flex',
         alignItems: 'center',
+        display: 'flex',
         height: '70px', // Footer height
-        zIndex: 1,
         justifyContent: 'space-between',
         padding: '10px',
+        width: '100%',
+        zIndex: 1,
       }}
     >
       <Box
@@ -126,11 +126,12 @@ export const DesktopHeader = ({
             : selectedGroup?.groupName}
         </Typography>
       </Box>
+
       <Box
         sx={{
+          alignItems: 'center',
           display: 'flex',
           gap: '20px',
-          alignItems: 'center',
           visibility: selectedGroup?.groupId === '0' ? 'hidden' : 'visibile',
         }}
       >
@@ -219,6 +220,7 @@ export const DesktopHeader = ({
             />
           </IconWrapper>
         </ButtonBase>
+
         <ButtonBase
           onClick={() => {
             setOpenManageMembers(true);
@@ -226,17 +228,18 @@ export const DesktopHeader = ({
         >
           <IconWrapper
             color={theme.palette.text.secondary}
+            customHeight="55px"
             label="Members"
             selected={false}
-            customHeight="55px"
           >
             <MembersIcon
+              color={theme.palette.text.secondary}
               height={25}
               width={20}
-              color={theme.palette.text.secondary}
             />
           </IconWrapper>
         </ButtonBase>
+
         <ButtonBase
           onClick={() => {
             setGroupSection('adminSpace');

src/components/Drawer/Drawer.tsx

@@ -1,5 +1,6 @@
 import Box from '@mui/material/Box';
 import Drawer from '@mui/material/Drawer';
+
 export const DrawerComponent = ({ open, setOpen, children }) => {
   const toggleDrawer = (newOpen: boolean) => () => {
     setOpen(newOpen);

src/components/Explore/Explore.tsx

@@ -40,6 +40,7 @@ export const Explore = ({ setDesktopViewMode }) => {
           }}
           src={qTradeLogo}
         />
+
         <Typography
           sx={{
             fontSize: '1rem',
@@ -66,6 +67,7 @@ export const Explore = ({ setDesktopViewMode }) => {
             color: theme.palette.text.primary,
           }}
         />
+
         <Typography
           sx={{
             fontSize: '1rem',
@@ -94,6 +96,7 @@ export const Explore = ({ setDesktopViewMode }) => {
             color: theme.palette.text.primary,
           }}
         />
+
         <Typography
           sx={{
             fontSize: '1rem',
@@ -102,6 +105,7 @@ export const Explore = ({ setDesktopViewMode }) => {
           {t('tutorial:initial.general_chat', { postProcess: 'capitalize' })}
         </Typography>
       </ButtonBase>
+
       <ButtonBase
         sx={{
           '&:hover': { backgroundColor: theme.palette.background.paper },
@@ -119,6 +123,7 @@ export const Explore = ({ setDesktopViewMode }) => {
             color: theme.palette.text.primary,
           }}
         />
+
         <Typography
           sx={{
             fontSize: '1rem',

src/components/GlobalActions/GlobalActions.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { JoinGroup } from './JoinGroup';
 
 export const GlobalActions = () => {

src/components/GlobalActions/JoinGroup.tsx

@@ -68,6 +68,7 @@ export const JoinGroup = () => {
     try {
       const groupId = group.groupId;
       const fee = await getFee('JOIN_GROUP');
+
       await show({
         message: t('group:question.perform_transaction', {
           action: 'JOIN_GROUP',
@@ -75,7 +76,9 @@ export const JoinGroup = () => {
         }),
         publishFee: fee.fee + ' QORT',
       });
+
       setIsLoadingJoinGroup(true);
+
       await new Promise((res, rej) => {
         window
           .sendMessage('joinGroup', {
@@ -85,8 +88,9 @@ export const JoinGroup = () => {
             if (!response?.error) {
               setInfoSnack({
                 type: 'success',
-                message:
+                message: t('group:message.success.group_join', {
-                  'Successfully requested to join group. It may take a couple of minutes for the changes to propagate',
+                  postProcess: 'capitalize',
+                }),
               });
 
               if (isOpen) {
@@ -94,8 +98,14 @@ export const JoinGroup = () => {
                   {
                     ...response,
                     type: 'joined-group',
-                    label: `Joined Group ${group?.groupName}: awaiting confirmation`,
+                    label: t('group:message.success.group_join_label', {
-                    labelDone: `Joined Group ${group?.groupName}: success!`,
+                      group_name: group?.groupName,
+                      postProcess: 'capitalize',
+                    }),
+                    labelDone: t('group:message.success.group_join_label', {
+                      group_name: group?.groupName,
+                      postProcess: 'capitalize',
+                    }),
                     done: false,
                     groupId,
                   },
@@ -106,15 +116,20 @@ export const JoinGroup = () => {
                   {
                     ...response,
                     type: 'joined-group-request',
-                    label: `Requested to join Group ${group?.groupName}: awaiting confirmation`,
+                    label: t('group:message.success.group_join_request', {
-                    labelDone: `Requested to join Group ${group?.groupName}: success!`,
+                      group_name: group?.groupName,
+                      postProcess: 'capitalize',
+                    }),
+                    labelDone: t('group:message.success.group_join_outcome', {
+                      group_name: group?.groupName,
+                      postProcess: 'capitalize',
+                    }),
                     done: false,
                     groupId,
                   },
                   ...prev,
                 ]);
               }
-
               setOpenSnack(true);
               res(response);
               return;
@@ -130,7 +145,9 @@ export const JoinGroup = () => {
           .catch((error) => {
             setInfoSnack({
               type: 'error',
-              message: error.message || 'An error occurred',
+              message:
+                error.message ||
+                t('core:message.error.generic', { postProcess: 'capitalize' }),
             });
             setOpenSnack(true);
             rej(error);
@@ -138,10 +155,12 @@ export const JoinGroup = () => {
       });
       setIsLoadingJoinGroup(false);
     } catch (error) {
+      console.log(error);
     } finally {
       setIsLoadingJoinGroup(false);
     }
   };
+
   return (
     <>
       <Dialog
@@ -153,32 +172,31 @@ export const JoinGroup = () => {
           {!groupInfo && (
             <Box
               sx={{
-                width: '325px',
-                height: '150px',
-                display: 'flex',
                 alignItems: 'center',
+                display: 'flex',
+                height: '150px',
                 justifyContent: 'center',
+                width: '325px',
               }}
             >
-              {' '}
               <CircularProgress
                 size={25}
                 sx={{
                   color: theme.palette.text.primary,
                 }}
-              />{' '}
+              />
             </Box>
           )}
           <Box
             sx={{
-              width: '325px',
+              alignItems: 'center',
-              height: 'auto',
-              maxHeight: '400px',
               display: !groupInfo ? 'none' : 'flex',
               flexDirection: 'column',
-              alignItems: 'center',
               gap: '10px',
+              height: 'auto',
+              maxHeight: '400px',
               padding: '10px',
+              width: '325px',
             }}
           >
             <Typography
@@ -187,16 +205,20 @@ export const JoinGroup = () => {
                 fontWeight: 600,
               }}
             >
-              Group name: {` ${groupInfo?.groupName}`}
+              {t('group:group.name', { postProcess: 'capitalize' })}:{' '}
+              {` ${groupInfo?.groupName}`}
             </Typography>
+
             <Typography
               sx={{
                 fontSize: '15px',
                 fontWeight: 600,
               }}
             >
-              Number of members: {` ${groupInfo?.memberCount}`}
+              {t('group:group.member_number', { postProcess: 'capitalize' })}:{' '}
+              {` ${groupInfo?.memberCount}`}
             </Typography>
+
             {groupInfo?.description && (
               <Typography
                 sx={{
@@ -214,7 +236,9 @@ export const JoinGroup = () => {
                   fontWeight: 600,
                 }}
               >
-                *You are already in this group!
+                {t('group:message.generic.already_in_group', {
+                  postProcess: 'capitalize',
+                })}
               </Typography>
             )}
             {!isInGroup && groupInfo?.isOpen === false && (
@@ -224,12 +248,14 @@ export const JoinGroup = () => {
                   fontWeight: 600,
                 }}
               >
-                *This is a closed/private group, so you will need to wait until
+                {t('group:message.generic.closed_group', {
-                an admin accepts your request
+                  postProcess: 'capitalize',
+                })}
               </Typography>
             )}
           </Box>
         </DialogContent>
+
         <DialogActions>
           <ButtonBase
             onClick={() => {
@@ -249,7 +275,9 @@ export const JoinGroup = () => {
                 opacity: isInGroup ? 0.1 : 1,
               }}
             >
-              Join
+              {t('core:action.join', {
+                postProcess: 'capitalize',
+              })}
             </CustomButtonAccept>
           </ButtonBase>
 
@@ -262,7 +290,9 @@ export const JoinGroup = () => {
             }}
             onClick={() => setIsOpen(false)}
           >
-            Close
+            {t('core:action.close', {
+              postProcess: 'capitalize',
+            })}
           </CustomButtonAccept>
         </DialogActions>
       </Dialog>
@@ -276,14 +306,14 @@ export const JoinGroup = () => {
       {isLoadingJoinGroup && (
         <Box
           sx={{
-            position: 'absolute',
+            alignItems: 'center',
-            top: 0,
-            left: 0,
-            right: 0,
             bottom: 0,
             display: 'flex',
             justifyContent: 'center',
-            alignItems: 'center',
+            left: 0,
+            position: 'absolute',
+            right: 0,
+            top: 0,
           }}
         >
           <FidgetSpinner

src/components/Group/AddGroup.tsx

@@ -331,6 +331,7 @@ export const AddGroup = ({ address, open, setOpen }) => {
                       postProcess: 'capitalize',
                     })}
                   </Label>
+
                   <Input
                     placeholder={t('group:group.name', {
                       postProcess: 'capitalize',
@@ -339,6 +340,7 @@ export const AddGroup = ({ address, open, setOpen }) => {
                     onChange={(e) => setName(e.target.value)}
                   />
                 </Box>
+
                 <Box
                   sx={{
                     display: 'flex',

src/components/Group/AddGroupList.tsx

@@ -158,8 +158,14 @@ export const AddGroupList = ({ setInfoSnack, setOpenSnack }) => {
                   {
                     ...response,
                     type: 'joined-group-request',
-                    label: `Requested to join Group ${group?.groupName}: awaiting confirmation`,
+                    label: t('group:message.success.group_join_request', {
-                    labelDone: `Requested to join Group ${group?.groupName}: success!`,
+                      group_name: group?.groupName,
+                      postProcess: 'capitalize',
+                    }),
+                    labelDone: t('group:message.success.group_join_outcome', {
+                      group_name: group?.groupName,
+                      postProcess: 'capitalize',
+                    }),
                     done: false,
                     groupId,
                   },

src/components/Home/QortPrice.tsx

@@ -168,6 +168,7 @@ export const QortPrice = () => {
           )}
         </Box>
       </Tooltip>
+
       <Box
         sx={{
           display: 'flex',
@@ -198,6 +199,7 @@ export const QortPrice = () => {
           </Typography>
         )}
       </Box>
+
       <Tooltip
         title={
           <span style={{ fontSize: '14px', fontWeight: 700 }}>