From 69b811b5207742e13297ccd92b786bf7627e746b Mon Sep 17 00:00:00 2001 From: Nicola Benaglia Date: Sat, 10 May 2025 08:26:04 +0200 Subject: [PATCH] Refactor translation and use only a parametric item --- public/locales/en/group.json | 5 +---- src/components/Chat/GroupAnnouncements.tsx | 11 +++++++--- src/components/GlobalActions/JoinGroup.tsx | 15 +++++++++---- src/components/Group/AddGroup.tsx | 3 ++- src/components/Group/AddGroupList.tsx | 3 ++- src/components/Group/Forum/NewThread.tsx | 14 +++++------- src/components/Group/InviteMember.tsx | 3 ++- src/components/Group/ListOfBans.tsx | 5 ++++- .../Group/ListOfGroupPromotions.tsx | 17 ++++++++++---- src/components/Group/ListOfInvites.tsx | 9 ++++++-- src/components/Group/ListOfJoinRequests.tsx | 5 ++++- src/components/Group/ListOfMembers.tsx | 22 +++++++++++++++---- src/components/Group/ManageMembers.tsx | 5 ++++- src/components/Group/UserListOfInvites.tsx | 3 ++- 14 files changed, 84 insertions(+), 36 deletions(-) diff --git a/public/locales/en/group.json b/public/locales/en/group.json index 9b9d030..91b9ce4 100644 --- a/public/locales/en/group.json +++ b/public/locales/en/group.json @@ -32,10 +32,7 @@ "invitation_expiry": "invitation Expiry Time", "join_requests": "join requests", "question": { - "cancel_ban": "would you like to perform a CANCEL_GROUP_BAN transaction?", - "create_group": "would you like to perform an CREATE_GROUP transaction?", - "group_invite": "would you like to perform a GROUP_INVITE transaction?", - "join_group": "would you like to perform an JOIN_GROUP transaction?", + "perform_transaction": "would you like to perform a {{action}} transaction?", "provide_thread": "please provide a thread title" }, "message": { diff --git a/src/components/Chat/GroupAnnouncements.tsx b/src/components/Chat/GroupAnnouncements.tsx index 9ac3ded..c91bfaa 100644 --- a/src/components/Chat/GroupAnnouncements.tsx +++ b/src/components/Chat/GroupAnnouncements.tsx @@ -31,6 +31,7 @@ import { import { RequestQueueWithPromise } from '../../utils/queue/queue'; import { CustomizedSnackbars } from '../Snackbar/Snackbar'; import { addDataPublishesFunc, getDataPublishesFunc } from '../Group/Group'; +import { useTranslation } from 'react-i18next'; const uid = new ShortUniqueId({ length: 8 }); @@ -101,6 +102,7 @@ export const decryptPublishes = async (encryptedMessages: any[], secretKey) => { console.log(error); } }; + export const handleUnencryptedPublishes = (publishes) => { let publishesData = []; publishes.forEach((pub) => { @@ -149,6 +151,7 @@ export const GroupAnnouncements = ({ editorRef.current = editorInstance; }; const [, forceUpdate] = React.useReducer((x) => x + 1, 0); + const { t } = useTranslation(['core', 'group']); const triggerRerender = () => { forceUpdate(); // Trigger re-render by updating the state @@ -209,7 +212,6 @@ export const GroupAnnouncements = ({ ) return; setIsLoading(true); - // initWebsocketMessageGroup() hasInitializedWebsocket.current = true; }, [secretKey, isPrivate]); @@ -287,7 +289,10 @@ export const GroupAnnouncements = ({ const fee = await getFee('ARBITRARY'); await show({ - message: 'Would you like to perform a ARBITRARY transaction?', + message: t('group:question.perform_transaction', { + action: 'ARBITRARY', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); @@ -329,7 +334,7 @@ export const GroupAnnouncements = ({ setTempData(selectedGroup); clearEditorContent(); } - // send chat message + // TODO send chat message } catch (error) { if (!error) return; setInfoSnack({ diff --git a/src/components/GlobalActions/JoinGroup.tsx b/src/components/GlobalActions/JoinGroup.tsx index 6503de4..6243e48 100644 --- a/src/components/GlobalActions/JoinGroup.tsx +++ b/src/components/GlobalActions/JoinGroup.tsx @@ -1,8 +1,7 @@ -import React, { useContext, useEffect, useMemo, useState } from 'react'; +import { useContext, useEffect, useMemo, useState } from 'react'; import { subscribeToEvent, unsubscribeFromEvent } from '../../utils/events'; import { Box, - Button, ButtonBase, CircularProgress, Dialog, @@ -11,13 +10,14 @@ import { Typography, useTheme, } from '@mui/material'; -import { CustomButton, CustomButtonAccept } from '../../styles/App-styles'; +import { CustomButtonAccept } from '../../styles/App-styles'; import { getBaseApiReact, MyContext } from '../../App'; import { getFee } from '../../background'; import { CustomizedSnackbars } from '../Snackbar/Snackbar'; import { FidgetSpinner } from 'react-loader-spinner'; import { useAtom, useSetAtom } from 'jotai'; import { memberGroupsAtom, txListAtom } from '../../atoms/global'; +import { useTranslation } from 'react-i18next'; export const JoinGroup = () => { const { show } = useContext(MyContext); @@ -29,7 +29,9 @@ export const JoinGroup = () => { const [isLoadingInfo, setIsLoadingInfo] = useState(false); const [isOpen, setIsOpen] = useState(false); const theme = useTheme(); + const { t } = useTranslation(['core', 'group']); const [isLoadingJoinGroup, setIsLoadingJoinGroup] = useState(false); + const handleJoinGroup = async (e) => { setGroupInfo(null); const groupId = e?.detail?.groupId; @@ -41,6 +43,7 @@ export const JoinGroup = () => { const groupData = await response.json(); setGroupInfo(groupData); } catch (error) { + console.log(error); } finally { setIsLoadingInfo(false); } @@ -60,12 +63,16 @@ export const JoinGroup = () => { (item) => +item?.groupId === +groupInfo?.groupId ); }, [memberGroups, groupInfo]); + const joinGroup = async (group, isOpen) => { try { const groupId = group.groupId; const fee = await getFee('JOIN_GROUP'); await show({ - message: 'Would you like to perform an JOIN_GROUP transaction?', + message: t('group:question.perform_transaction', { + action: 'JOIN_GROUP', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingJoinGroup(true); diff --git a/src/components/Group/AddGroup.tsx b/src/components/Group/AddGroup.tsx index fca8386..121ff66 100644 --- a/src/components/Group/AddGroup.tsx +++ b/src/components/Group/AddGroup.tsx @@ -118,7 +118,8 @@ export const AddGroup = ({ address, open, setOpen }) => { const fee = await getFee('CREATE_GROUP'); await show({ - message: t('group:question.create_group', { + message: t('group:question.perform_transaction', { + action: 'CREATE_GROUP', postProcess: 'capitalize', }), publishFee: fee.fee + ' QORT', diff --git a/src/components/Group/AddGroupList.tsx b/src/components/Group/AddGroupList.tsx index 971f6e0..c052144 100644 --- a/src/components/Group/AddGroupList.tsx +++ b/src/components/Group/AddGroupList.tsx @@ -113,7 +113,8 @@ export const AddGroupList = ({ setInfoSnack, setOpenSnack }) => { const fee = await getFee('JOIN_GROUP'); await show({ - message: t('group:question.join_group', { + message: t('group:question.perform_transaction', { + action: 'JOIN_GROUP', postProcess: 'capitalize', }), publishFee: fee.fee + ' QORT', diff --git a/src/components/Group/Forum/NewThread.tsx b/src/components/Group/Forum/NewThread.tsx index 94be106..3279058 100644 --- a/src/components/Group/Forum/NewThread.tsx +++ b/src/components/Group/Forum/NewThread.tsx @@ -208,12 +208,6 @@ export const NewThread = ({ } if (errorMsg) { - // dispatch( - // setNotification({ - // msg: errorMsg, - // alertType: "error", - // }) - // ); throw new Error(errorMsg); } @@ -221,13 +215,18 @@ export const NewThread = ({ if (!htmlContent?.trim() || htmlContent?.trim() === '

') throw new Error('Please provide a first message to the thread'); + const fee = await getFee('ARBITRARY'); let feeToShow = fee.fee; + if (!isMessage) { feeToShow = +feeToShow * 2; } await show({ - message: 'Would you like to perform a ARBITRARY transaction?', + message: t('group:question.perform_transaction', { + action: 'ARBITRARY', + postProcess: 'capitalize', + }), publishFee: feeToShow + ' QORT', }); @@ -516,7 +515,6 @@ export const NewThread = ({ overrideMobile customEditorHeight="240px" /> - diff --git a/src/components/Group/InviteMember.tsx b/src/components/Group/InviteMember.tsx index fe1fdb3..1d36137 100644 --- a/src/components/Group/InviteMember.tsx +++ b/src/components/Group/InviteMember.tsx @@ -16,7 +16,8 @@ export const InviteMember = ({ groupId, setInfoSnack, setOpenSnack, show }) => { try { const fee = await getFee('GROUP_INVITE'); await show({ - message: t('group:question.group_invite', { + message: t('group:question.perform_transaction', { + action: 'GROUP_INVITE', postProcess: 'capitalize', }), publishFee: fee.fee + ' QORT', diff --git a/src/components/Group/ListOfBans.tsx b/src/components/Group/ListOfBans.tsx index 0dec68e..0937db1 100644 --- a/src/components/Group/ListOfBans.tsx +++ b/src/components/Group/ListOfBans.tsx @@ -88,7 +88,10 @@ export const ListOfBans = ({ groupId, setInfoSnack, setOpenSnack, show }) => { try { const fee = await getFee('CANCEL_GROUP_BAN'); await show({ - message: t('group:question.cancel_ban', { postProcess: 'capitalize' }), + message: t('group:question.perform_transaction', { + action: 'CANCEL_GROUP_BAN', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingUnban(true); diff --git a/src/components/Group/ListOfGroupPromotions.tsx b/src/components/Group/ListOfGroupPromotions.tsx index d48158b..b32d433 100644 --- a/src/components/Group/ListOfGroupPromotions.tsx +++ b/src/components/Group/ListOfGroupPromotions.tsx @@ -51,6 +51,11 @@ import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import ExpandLessIcon from '@mui/icons-material/ExpandLess'; import { getFee } from '../../background'; import { useAtom, useSetAtom } from 'jotai'; +import { useTranslation } from 'react-i18next'; + +const THIRTY_MINUTES = 30 * 60 * 1000; // 30 minutes in milliseconds +const uid = new ShortUniqueId({ length: 8 }); + export const requestQueuePromos = new RequestQueueWithPromise(3); export function utf8ToBase64(inputString: string): string { @@ -65,13 +70,11 @@ export function utf8ToBase64(inputString: string): string { return base64String; } -const uid = new ShortUniqueId({ length: 8 }); - export function getGroupId(str) { const match = str.match(/group-(\d+)-/); return match ? match[1] : null; } -const THIRTY_MINUTES = 30 * 60 * 1000; // 30 minutes in milliseconds + export const ListOfGroupPromotions = () => { const [popoverAnchor, setPopoverAnchor] = useState(null); const [openPopoverIndex, setOpenPopoverIndex] = useState(null); @@ -98,6 +101,7 @@ export const ListOfGroupPromotions = () => { const setTxList = useSetAtom(txListAtom); const theme = useTheme(); + const { t } = useTranslation(['core', 'group']); const listRef = useRef(); const rowVirtualizer = useVirtualizer({ count: promotions.length, @@ -120,6 +124,7 @@ export const ListOfGroupPromotions = () => { console.log(error); } }, []); + const getPromotions = useCallback(async () => { try { setPromotionTimeInterval(Date.now()); @@ -213,6 +218,7 @@ export const ListOfGroupPromotions = () => { setPopoverAnchor(null); setOpenPopoverIndex(null); }; + const publishPromo = async () => { try { setIsLoadingPublish(true); @@ -264,7 +270,10 @@ export const ListOfGroupPromotions = () => { const groupId = group.groupId; const fee = await getFee('JOIN_GROUP'); await show({ - message: 'Would you like to perform an JOIN_GROUP transaction?', + message: t('group:question.perform_transaction', { + action: 'JOIN_GROUP', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingJoinGroup(true); diff --git a/src/components/Group/ListOfInvites.tsx b/src/components/Group/ListOfInvites.tsx index 4830fea..91f6c75 100644 --- a/src/components/Group/ListOfInvites.tsx +++ b/src/components/Group/ListOfInvites.tsx @@ -18,6 +18,7 @@ import { getNameInfo } from './Group'; import { getFee } from '../../background'; import { LoadingButton } from '@mui/lab'; import { getBaseApiReact } from '../../App'; +import { useTranslation } from 'react-i18next'; export const getMemberInvites = async (groupNumber) => { const response = await fetch( @@ -59,7 +60,7 @@ export const ListOfInvites = ({ const [popoverAnchor, setPopoverAnchor] = useState(null); // Track which list item the popover is anchored to const [openPopoverIndex, setOpenPopoverIndex] = useState(null); // Track which list item has the popover open const [isLoadingCancelInvite, setIsLoadingCancelInvite] = useState(false); - + const { t } = useTranslation(['core', 'group']); const listRef = useRef(); const getInvites = async (groupId) => { @@ -92,8 +93,12 @@ export const ListOfInvites = ({ try { // TODO translate const fee = await getFee('CANCEL_GROUP_INVITE'); + await show({ - message: 'Would you like to perform a CANCEL_GROUP_INVITE transaction?', + message: t('group:question.perform_transaction', { + action: 'CANCEL_GROUP_INVITE', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingCancelInvite(true); diff --git a/src/components/Group/ListOfJoinRequests.tsx b/src/components/Group/ListOfJoinRequests.tsx index 8c51ee2..c75cfd3 100644 --- a/src/components/Group/ListOfJoinRequests.tsx +++ b/src/components/Group/ListOfJoinRequests.tsx @@ -95,7 +95,10 @@ export const ListOfJoinRequests = ({ try { const fee = await getFee('GROUP_INVITE'); // TODO translate await show({ - message: 'Would you like to perform a GROUP_INVITE transaction?', + message: t('group:question.perform_transaction', { + action: 'GROUP_INVITE', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingAccept(true); diff --git a/src/components/Group/ListOfMembers.tsx b/src/components/Group/ListOfMembers.tsx index fb45945..a46e5e8 100644 --- a/src/components/Group/ListOfMembers.tsx +++ b/src/components/Group/ListOfMembers.tsx @@ -19,6 +19,7 @@ import { import { LoadingButton } from '@mui/lab'; import { getFee } from '../../background'; import { getBaseApiReact } from '../../App'; +import { useTranslation } from 'react-i18next'; const cache = new CellMeasurerCache({ fixedWidth: true, @@ -41,6 +42,7 @@ const ListOfMembers = ({ const [isLoadingMakeAdmin, setIsLoadingMakeAdmin] = useState(false); const [isLoadingRemoveAdmin, setIsLoadingRemoveAdmin] = useState(false); const theme = useTheme(); + const { t } = useTranslation(['core', 'group']); const listRef = useRef(); const handlePopoverOpen = (event, index) => { @@ -57,7 +59,10 @@ const ListOfMembers = ({ try { const fee = await getFee('GROUP_KICK'); await show({ - message: 'Would you like to perform a GROUP_KICK transaction?', + message: t('group:question.perform_transaction', { + action: 'GROUP_KICK', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); @@ -106,7 +111,10 @@ const ListOfMembers = ({ try { const fee = await getFee('GROUP_BAN'); // TODO translate await show({ - message: 'Would you like to perform a GROUP_BAN transaction?', + message: t('group:question.perform_transaction', { + action: 'GROUP_BAN', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingBan(true); @@ -155,7 +163,10 @@ const ListOfMembers = ({ try { const fee = await getFee('ADD_GROUP_ADMIN'); await show({ - message: 'Would you like to perform a ADD_GROUP_ADMIN transaction?', + message: t('group:question.perform_transaction', { + action: 'ADD_GROUP_ADMIN', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingMakeAdmin(true); @@ -203,7 +214,10 @@ const ListOfMembers = ({ try { const fee = await getFee('REMOVE_GROUP_ADMIN'); await show({ - message: 'Would you like to perform a REMOVE_GROUP_ADMIN transaction?', + message: t('group:question.perform_transaction', { + action: 'REMOVE_GROUP_ADMIN', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); setIsLoadingRemoveAdmin(true); diff --git a/src/components/Group/ManageMembers.tsx b/src/components/Group/ManageMembers.tsx index 0ff6c59..c340aa1 100644 --- a/src/components/Group/ManageMembers.tsx +++ b/src/components/Group/ManageMembers.tsx @@ -75,7 +75,10 @@ export const ManageMembers = ({ setIsLoadingLeave(true); const fee = await getFee('LEAVE_GROUP'); // TODO translate await show({ - message: 'Would you like to perform an LEAVE_GROUP transaction?', + message: t('group:question.perform_transaction', { + action: 'LEAVE_GROUP', + postProcess: 'capitalize', + }), publishFee: fee.fee + ' QORT', }); diff --git a/src/components/Group/UserListOfInvites.tsx b/src/components/Group/UserListOfInvites.tsx index a9996a3..a57a38c 100644 --- a/src/components/Group/UserListOfInvites.tsx +++ b/src/components/Group/UserListOfInvites.tsx @@ -99,7 +99,8 @@ export const UserListOfInvites = ({ const fee = await getFee('JOIN_GROUP'); await show({ - message: t('group:question.join_group', { + message: t('group:question.perform_transaction', { + action: 'JOIN_GROUP', postProcess: 'capitalize', }), publishFee: fee.fee + ' QORT',