diff --git a/public/locales/en/group.json b/public/locales/en/group.json
index 28191ca..09b8c38 100644
--- a/public/locales/en/group.json
+++ b/public/locales/en/group.json
@@ -12,7 +12,10 @@
"join_group": "join group",
"kick_member": "kick member from group",
"invite_member": "invite member",
+ "leave_group": "leave group",
+ "load_members": "load members with names",
"make_admin": "make an admin",
+ "manage_members": "manage members",
"refetch_page": "refetch page",
"remove_admin": "remove as admin",
"return_to_thread": "return to threads"
@@ -27,6 +30,7 @@
"group": {
"closed": "closed (private) - users need permission to join",
"description": "description of group",
+ "id": "group id",
"invites": "group invites",
"management": "group management",
"member_number": "number of members",
@@ -36,11 +40,8 @@
},
"invitation_expiry": "invitation Expiry Time",
"invitees_list": "invitees list",
+ "join_link": "join group link",
"join_requests": "join requests",
- "question": {
- "perform_transaction": "would you like to perform a {{action}} transaction?",
- "provide_thread": "please provide a thread title"
- },
"message": {
"generic": {
"already_in_group": "you are already in this group!",
@@ -48,6 +49,7 @@
"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",
+ "loading_members": "loading member list with names... please wait.",
"no_display": "nothing to display",
"no_selection": "no group selected",
"not_part_group": "you are not part of the encrypted group of members. Wait until an admin re-encrypts the keys.",
@@ -79,6 +81,9 @@
"group_join_request": "requested to join Group {{group_name}}: awaiting confirmation",
"group_join_outcome": "requested to join Group {{group_name}}: success!",
"group_kick": "successfully kicked member from group. It may take a couple of minutes for the changes to propagate",
+ "group_leave": "successfully requested to leave group. It may take a couple of minutes for the changes to propagate",
+ "group_leave_name": "left group {{group_name}}: awaiting confirmation",
+ "group_leave_label": "left group {{name}}: success!",
"group_member_admin": "successfully made member an admin. It may take a couple of minutes for the changes to propagate",
"group_remove_member": "successfully removed member as an admin. It may take a couple of minutes for the changes to propagate",
"invitation_cancellation": "successfully canceled invitation. It may take a couple of minutes for the changes to propagate",
@@ -89,5 +94,10 @@
"unbanned_user": "successfully unbanned user. It may take a couple of minutes for the changes to propagate",
"user_joined": "user successfully joined!"
}
- }
+ },
+ "question": {
+ "perform_transaction": "would you like to perform a {{action}} transaction?",
+ "provide_thread": "please provide a thread title"
+ },
+ "thread_posts": "new thread posts"
}
diff --git a/src/components/Group/ListOfThreadPostsWatched.tsx b/src/components/Group/ListOfThreadPostsWatched.tsx
index e3dfac6..b03588c 100644
--- a/src/components/Group/ListOfThreadPostsWatched.tsx
+++ b/src/components/Group/ListOfThreadPostsWatched.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';
@@ -9,10 +9,12 @@ import { Box, Typography } from '@mui/material';
import { Spacer } from '../../common/Spacer';
import { CustomLoader } from '../../common/CustomLoader';
import VisibilityIcon from '@mui/icons-material/Visibility';
+import { useTranslation } from 'react-i18next';
export const ListOfThreadPostsWatched = () => {
- const [posts, setPosts] = React.useState([]);
- const [loading, setLoading] = React.useState(true);
+ const [posts, setPosts] = useState([]);
+ const [loading, setLoading] = useState(true);
+ const { t } = useTranslation(['core', 'group']);
const getPosts = async () => {
try {
@@ -42,7 +44,10 @@ export const ListOfThreadPostsWatched = () => {
rej(response.error);
})
.catch((error) => {
- rej(error.message || 'An error occurred');
+ rej(
+ error.message ||
+ t('core:message.error.generic', { postProcess: 'capitalize' })
+ );
});
});
} catch (error) {
@@ -52,7 +57,7 @@ export const ListOfThreadPostsWatched = () => {
}
};
- React.useEffect(() => {
+ useEffect(() => {
getPosts();
}, []);
@@ -73,14 +78,18 @@ export const ListOfThreadPostsWatched = () => {
width: '322px',
}}
>
-
- New Thread Posts:
+ {t('group:thread_posts', {
+ postProcess: 'capitalize',
+ })}
+ :
+
@@ -98,9 +107,9 @@ export const ListOfThreadPostsWatched = () => {
{loading && posts.length === 0 && (
@@ -109,11 +118,11 @@ export const ListOfThreadPostsWatched = () => {
{!loading && posts.length === 0 && (
{
color: 'rgba(255, 255, 255, 0.2)',
}}
>
- Nothing to display
+ {t('group:message.generic.no_display', {
+ postProcess: 'capitalize',
+ })}
)}
@@ -131,11 +142,11 @@ export const ListOfThreadPostsWatched = () => {
{posts?.map((post) => {
diff --git a/src/components/Group/ManageMembers.tsx b/src/components/Group/ManageMembers.tsx
index c340aa1..5768f97 100644
--- a/src/components/Group/ManageMembers.tsx
+++ b/src/components/Group/ManageMembers.tsx
@@ -1,4 +1,14 @@
-import * as React from 'react';
+import {
+ forwardRef,
+ Fragment,
+ ReactElement,
+ Ref,
+ SyntheticEvent,
+ useCallback,
+ useContext,
+ useEffect,
+ useState,
+} from 'react';
import Button from '@mui/material/Button';
import Dialog from '@mui/material/Dialog';
import AppBar from '@mui/material/AppBar';
@@ -25,6 +35,7 @@ import { Spacer } from '../../common/Spacer';
import InsertLinkIcon from '@mui/icons-material/InsertLink';
import { useSetAtom } from 'jotai';
import { txListAtom } from '../../atoms/global';
+import { useTranslation } from 'react-i18next';
function a11yProps(index: number) {
return {
@@ -33,37 +44,35 @@ function a11yProps(index: number) {
};
}
-const Transition = React.forwardRef(function Transition(
+const Transition = forwardRef(function Transition(
props: TransitionProps & {
- children: React.ReactElement;
+ children: ReactElement;
},
- ref: React.Ref
+ ref: Ref
) {
return ;
});
export const ManageMembers = ({
- address,
open,
setOpen,
selectedGroup,
-
isAdmin,
isOwner,
}) => {
- const [membersWithNames, setMembersWithNames] = React.useState([]);
- const [tab, setTab] = React.useState('create');
- const [value, setValue] = React.useState(0);
- const [openSnack, setOpenSnack] = React.useState(false);
- const [infoSnack, setInfoSnack] = React.useState(null);
- const [isLoadingMembers, setIsLoadingMembers] = React.useState(false);
- const [isLoadingLeave, setIsLoadingLeave] = React.useState(false);
- const [groupInfo, setGroupInfo] = React.useState(null);
- const handleChange = (event: React.SyntheticEvent, newValue: number) => {
+ const [membersWithNames, setMembersWithNames] = useState([]);
+ const [value, setValue] = useState(0);
+ const [openSnack, setOpenSnack] = useState(false);
+ const [infoSnack, setInfoSnack] = useState(null);
+ const [isLoadingMembers, setIsLoadingMembers] = useState(false);
+ const [isLoadingLeave, setIsLoadingLeave] = useState(false);
+ const [groupInfo, setGroupInfo] = useState(null);
+ const handleChange = (event: SyntheticEvent, newValue: number) => {
setValue(newValue);
};
const theme = useTheme();
- const { show } = React.useContext(MyContext);
+ const { t } = useTranslation(['core', 'group']);
+ const { show } = useContext(MyContext);
const setTxList = useSetAtom(txListAtom);
const handleClose = () => {
@@ -73,7 +82,7 @@ export const ManageMembers = ({
const handleLeaveGroup = async () => {
try {
setIsLoadingLeave(true);
- const fee = await getFee('LEAVE_GROUP'); // TODO translate
+ const fee = await getFee('LEAVE_GROUP');
await show({
message: t('group:question.perform_transaction', {
action: 'LEAVE_GROUP',
@@ -93,8 +102,14 @@ export const ManageMembers = ({
{
...response,
type: 'leave-group',
- label: `Left Group ${selectedGroup?.groupName}: awaiting confirmation`,
- labelDone: `Left Group ${selectedGroup?.groupName}: success!`,
+ label: t('group:message.success.group_leave_name', {
+ group_name: selectedGroup?.groupName,
+ postProcess: 'capitalize',
+ }),
+ labelDone: t('group:message.success.group_leave_label', {
+ group_name: selectedGroup?.groupName,
+ postProcess: 'capitalize',
+ }),
done: false,
groupId: selectedGroup?.groupId,
},
@@ -103,8 +118,9 @@ export const ManageMembers = ({
res(response);
setInfoSnack({
type: 'success',
- message:
- 'Successfully requested to leave group. It may take a couple of minutes for the changes to propagate',
+ message: t('group:message.success.group_leave', {
+ postProcess: 'capitalize',
+ }),
});
setOpenSnack(true);
return;
@@ -112,7 +128,10 @@ export const ManageMembers = ({
rej(response.error);
})
.catch((error) => {
- rej(error.message || 'An error occurred');
+ rej(
+ error.message ||
+ t('core:message.error.generic', { postProcess: 'capitalize' })
+ );
});
});
} catch (error) {
@@ -122,7 +141,7 @@ export const ManageMembers = ({
}
};
- const getMembersWithNames = React.useCallback(async (groupId) => {
+ const getMembersWithNames = useCallback(async (groupId) => {
try {
setIsLoadingMembers(true);
const res = await getGroupMembers(groupId);
@@ -153,7 +172,7 @@ export const ManageMembers = ({
}
};
- React.useEffect(() => {
+ useEffect(() => {
if (selectedGroup?.groupId) {
getMembers(selectedGroup?.groupId);
getGroupInfo(selectedGroup?.groupId);
@@ -164,7 +183,7 @@ export const ManageMembers = ({
setValue(4);
};
- React.useEffect(() => {
+ useEffect(() => {
subscribeToEvent('openGroupJoinRequest', openGroupJoinRequestFunc);
return () => {
@@ -173,7 +192,7 @@ export const ManageMembers = ({
}, []);
return (
-
+
-
+
);
};