From 075999489107c52a289808052722346dfd1105c2 Mon Sep 17 00:00:00 2001 From: Nicola Benaglia Date: Fri, 16 May 2025 19:03:08 +0200 Subject: [PATCH] Add translation for chat section --- .../Chat/AnnouncementDiscussion.tsx | 49 ++++++++++++------- src/components/Chat/AnnouncementItem.tsx | 19 ++++--- src/components/Chat/AnnouncementList.tsx | 23 +++------ src/i18n/locales/en/core.json | 4 ++ 4 files changed, 56 insertions(+), 39 deletions(-) diff --git a/src/components/Chat/AnnouncementDiscussion.tsx b/src/components/Chat/AnnouncementDiscussion.tsx index e4c2538..3715215 100644 --- a/src/components/Chat/AnnouncementDiscussion.tsx +++ b/src/components/Chat/AnnouncementDiscussion.tsx @@ -1,4 +1,4 @@ -import React, { useMemo, useRef, useState } from 'react'; +import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import TipTap from './TipTap'; import { AuthenticatedContainerInnerTop, @@ -8,7 +8,7 @@ import { Box, CircularProgress, useTheme } from '@mui/material'; import { objectToBase64 } from '../../qdn/encryption/group-encryption'; import ShortUniqueId from 'short-unique-id'; import { LoadingSnackbar } from '../Snackbar/LoadingSnackbar'; -import { getBaseApi, getFee } from '../../background'; +import { getFee } from '../../background'; import { decryptPublishes, getTempPublish, @@ -24,6 +24,7 @@ import { pauseAllQueues, resumeAllQueues, } from '../../App'; +import { useTranslation } from 'react-i18next'; const tempKey = 'accouncement-comment'; @@ -39,10 +40,10 @@ export const AnnouncementDiscussion = ({ isPrivate, }) => { const theme = useTheme(); + const { t } = useTranslation(['auth', 'core', 'group']); const [isSending, setIsSending] = useState(false); const [isLoading, setIsLoading] = useState(false); const [isFocusedParent, setIsFocusedParent] = useState(false); - const [comments, setComments] = useState([]); const [tempPublishedList, setTempPublishedList] = useState([]); const firstMountRef = useRef(false); @@ -100,7 +101,12 @@ export const AnnouncementDiscussion = ({ rej(response.error); }) .catch((error) => { - rej(error.message || 'An error occurred'); + rej( + error.message || + t('core:message.error.generic', { + postProcess: 'capitalizeFirst', + }) + ); }); }); } catch (error) { @@ -131,9 +137,13 @@ export const AnnouncementDiscussion = ({ pauseAllQueues(); const fee = await getFee('ARBITRARY'); await show({ - message: 'Would you like to perform a ARBITRARY transaction?', + message: t('core:question.perform_transaction', { + action: 'ARBITRARY', + postProcess: 'capitalizeFirst', + }), publishFee: fee.fee + ' QORT', }); + if (isSending) return; if (editorRef.current) { const htmlContent = editorRef.current.getHTML(); @@ -155,10 +165,11 @@ export const AnnouncementDiscussion = ({ : await encryptChatMessage(message64, secretKeyObject); const randomUid = uid.rnd(); const identifier = `cm-${selectedAnnouncement.identifier}-${randomUid}`; + const res = await publishAnc({ encryptedData: encryptSingle, identifier, - }); + }); // TODO remove unused? const dataToSaveToStorage = { name: myName, @@ -168,12 +179,13 @@ export const AnnouncementDiscussion = ({ created: Date.now(), announcementId: selectedAnnouncement.identifier, }; + await saveTempPublish({ data: dataToSaveToStorage, key: tempKey }); setTempData(); clearEditorContent(); } - // send chat message + // TODO send chat message } catch (error) { console.error(error); } finally { @@ -182,14 +194,12 @@ export const AnnouncementDiscussion = ({ } }; - const getComments = React.useCallback( + const getComments = useCallback( async (selectedAnnouncement, isPrivate) => { try { setIsLoading(true); const offset = 0; - - // dispatch(setIsLoadingGlobal(true)) const identifier = `cm-${selectedAnnouncement.identifier}`; const url = `${getBaseApiReact()}${getArbitraryEndpointReact()}?mode=ALL&service=DOCUMENT&identifier=${identifier}&limit=20&includemetadata=false&offset=${offset}&reverse=true&prefix=true`; const response = await fetch(url, { @@ -209,8 +219,6 @@ export const AnnouncementDiscussion = ({ console.log(error); } finally { setIsLoading(false); - - // dispatch(setIsLoadingGlobal(false)) } }, [secretKey] @@ -259,7 +267,7 @@ export const AnnouncementDiscussion = ({ return sortedList; }, [tempPublishedList, comments]); - React.useEffect(() => { + useEffect(() => { if (!secretKey && isPrivate) return; if (selectedAnnouncement && !firstMountRef.current && isPrivate !== null) { getComments(selectedAnnouncement, isPrivate); @@ -299,6 +307,7 @@ export const AnnouncementDiscussion = ({ + +
+ - {` Close`} + {t('core:action.close', { postProcess: 'capitalizeFirst' })} )} )} - {` Publish Comment`} + {t('core:action.publish_comment', { + postProcess: 'capitalizeFirst', + })} @@ -410,7 +423,9 @@ export const AnnouncementDiscussion = ({ diff --git a/src/components/Chat/AnnouncementItem.tsx b/src/components/Chat/AnnouncementItem.tsx index e6ad671..e8d8ced 100644 --- a/src/components/Chat/AnnouncementItem.tsx +++ b/src/components/Chat/AnnouncementItem.tsx @@ -1,14 +1,14 @@ -import React, { useEffect, useState } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import { MessageDisplay } from './MessageDisplay'; import { Avatar, Box, Typography, useTheme } from '@mui/material'; import { formatTimestamp } from '../../utils/time'; import ChatBubbleIcon from '@mui/icons-material/ChatBubble'; import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos'; -import { getBaseApi } from '../../background'; import { requestQueueCommentCount } from './GroupAnnouncements'; import { CustomLoader } from '../../common/CustomLoader'; import { getArbitraryEndpointReact, getBaseApiReact } from '../../App'; import { WrapperUserAction } from '../WrapperUserAction'; +import { useTranslation } from 'react-i18next'; export const AnnouncementItem = ({ message, @@ -18,12 +18,12 @@ export const AnnouncementItem = ({ myName, }) => { const theme = useTheme(); + const { t } = useTranslation(['auth', 'core', 'group']); const [commentLength, setCommentLength] = useState(0); - const getNumberOfComments = React.useCallback(async () => { + + const getNumberOfComments = useCallback(async () => { try { const offset = 0; - - // dispatch(setIsLoadingGlobal(true)) const identifier = `cm-${message.identifier}`; const url = `${getBaseApiReact()}${getArbitraryEndpointReact()}?mode=ALL&service=DOCUMENT&identifier=${identifier}&limit=0&includemetadata=false&offset=${offset}&reverse=true&prefix=true`; @@ -84,6 +84,7 @@ export const AnnouncementItem = ({ {message?.name?.charAt(0)} + + {!messageData?.decryptedData && ( )} + {messageData?.decryptedData?.message && ( <> {messageData?.type === 'notification' ? ( @@ -150,6 +153,7 @@ export const AnnouncementItem = ({ + {!disableComment && ( - Leave comment + {t('core:action.leave_comment', { + postProcess: 'capitalizeFirst', + })} )} + { - const listRef = useRef(null); const [messages, setMessages] = useState(initialMessages); + const { t } = useTranslation(['auth', 'core', 'group']); useEffect(() => { cache.clearAll(); @@ -36,9 +37,9 @@ export const AnnouncementList = ({ flexDirection: 'column', flexGrow: 1, flexShrink: 1, + overflow: 'auto', position: 'relative', width: '100%', - overflow: 'auto', }} > {messages.map((message) => { @@ -69,19 +70,7 @@ export const AnnouncementList = ({ ); })} - {/* - {({ height, width }) => ( - - )} - */} + {showLoadMore && ( - Load older announcements + {t('core:action.load_announcements', { + postProcess: 'capitalizeFirst', + })} )} diff --git a/src/i18n/locales/en/core.json b/src/i18n/locales/en/core.json index 57b37ed..bf92f0c 100644 --- a/src/i18n/locales/en/core.json +++ b/src/i18n/locales/en/core.json @@ -31,6 +31,8 @@ "import": "import", "invite": "invite", "join": "join", + "leave_comment": "leave comment", + "load_announcements": "load older announcements", "login": "login", "logout": "logout", "new": { @@ -46,6 +48,7 @@ "post_message": "post message", "publish": "publish", "publish_app": "publish your app", + "publish_comment": "publish comment", "register_name": "register name", "remove": "remove", "return_apps_dashboard": "return to Apps Dashboard", @@ -104,6 +107,7 @@ "member": "member list" }, "loading": "loading...", + "loading_comments": "loading comments... please wait.", "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", "message": {