Add translation to group

public/locales/en/core.json

@@ -15,8 +15,7 @@
     "export": "export",
     "import": "import",
     "logout": "logout",
-    "refetch_page": "refetch page",
-    "return_to_thread": "return to threads"
+    "refetch_page": "refetch page"
   },
   "core": {
     "block_height": "block height",

public/locales/en/group.json

@@ -1,12 +1,17 @@
 {
+  "action": {
+    "return_to_thread": "return to threads"
+  },
+  "group_invites": "group invites",
   "provide_thread": "please provide a thread title",
   "result": {
     "cannot": {
       "access_name": "Cannot send a message without a access to your name",
       "group_info": "Cannot access group information"
-    }
+    },
+    "loading_threads": "loading threads... please wait."
   },
-  "": "",
+
   "": "",
   "": "",
   "": "",

src/components/Group/Forum/GroupMail.tsx

@@ -121,7 +121,9 @@ export const GroupMail = ({
         });
         setTempPublishedList(tempData);
       }
-    } catch (error) {}
+    } catch (error) {
+      console.log(error);
+    }
   };
 
   const getEncryptedResource = async (

src/components/Group/Forum/Thread.tsx

@@ -608,7 +608,7 @@ export const Thread = ({
           >
             <MailIconImg src={ReturnSVG} />
             <ComposeP>
-              {t('core:action.return_to_thread', { postProcess: 'capitalize' })}
+              {t('group:action.return_to_thread', { postProcess: 'capitalize' })}
             </ComposeP>
           </ShowMessageReturnButton>
           {/* Conditionally render the scroll buttons */}

src/components/Group/Group.tsx

@@ -55,8 +55,6 @@ import { RequestQueueWithPromise } from '../../utils/queue/queue';
 import { WebSocketActive } from './WebsocketActive';
 import { useMessageQueue } from '../../MessageQueueContext';
 import { ContextMenu } from '../ContextMenu';
-import { ReturnIcon } from '../../assets/Icons/ReturnIcon';
-import { ExitIcon } from '../../assets/Icons/ExitIcon';
 import { HomeDesktop } from './HomeDesktop';
 import { IconWrapper } from '../Desktop/DesktopFooter';
 import { DesktopHeader } from '../Desktop/DesktopHeader';
@@ -80,6 +78,7 @@ import LockIcon from '@mui/icons-material/Lock';
 import NoEncryptionGmailerrorredIcon from '@mui/icons-material/NoEncryptionGmailerrorred';
 import { BlockedUsersModal } from './BlockedUsersModal';
 import { WalletsAppWrapper } from './WalletsAppWrapper';
+import { useTranslation } from 'react-i18next';
 
 export const getPublishesFromAdmins = async (admins: string[], groupId) => {
   const queryString = admins.map((name) => `name=${name}`).join('&');
@@ -450,6 +449,7 @@ export const Group = ({
   const [isOpenSideViewGroups, setIsOpenSideViewGroups] = useState(false);
   const [isForceShowCreationKeyPopup, setIsForceShowCreationKeyPopup] =
     useState(false);
+  const { t } = useTranslation(['core', 'group']);
 
   const [groupsProperties, setGroupsProperties] =
     useRecoilState(groupsPropertiesAtom);

src/components/Group/GroupInvites.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { useEffect, useState } from 'react';
 import List from '@mui/material/List';
 import ListItem from '@mui/material/ListItem';
 import ListItemButton from '@mui/material/ListItemButton';
@@ -12,14 +12,13 @@ import { CustomLoader } from '../../common/CustomLoader';
 import { getBaseApiReact } from '../../App';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import ExpandLessIcon from '@mui/icons-material/ExpandLess';
+import { useTranslation } from 'react-i18next';
 
 export const GroupInvites = ({ myAddress, setOpenAddGroup }) => {
-  const [groupsWithJoinRequests, setGroupsWithJoinRequests] = React.useState(
-    []
-  );
-  const [isExpanded, setIsExpanded] = React.useState(false);
+  const [groupsWithJoinRequests, setGroupsWithJoinRequests] = useState([]);
+  const [isExpanded, setIsExpanded] = useState(false);
 
-  const [loading, setLoading] = React.useState(true);
+  const [loading, setLoading] = useState(true);
 
   const getJoinRequests = async () => {
     try {
@@ -38,9 +37,10 @@ export const GroupInvites = ({ myAddress, setOpenAddGroup }) => {
     }
   };
 
+  const { t } = useTranslation(['core', 'group']);
   const theme = useTheme();
 
-  React.useEffect(() => {
+  useEffect(() => {
     if (myAddress) {
       getJoinRequests();
     }
@@ -71,7 +71,7 @@ export const GroupInvites = ({ myAddress, setOpenAddGroup }) => {
             fontSize: '1rem',
           }} // TODO translate
         >
-          Group Invites{' '}
+          {t('group:group_invites', { postProcess: 'capitalize' })}{' '}
           {groupsWithJoinRequests?.length > 0 &&
             ` (${groupsWithJoinRequests?.length})`}
         </Typography>