Merge pull request #206 from wwWallet/fix/messages-issues

Update and Refine Locale Texts

Author: gkatrakazas

src/components/Layout.js

@@ -6,7 +6,7 @@ import logo from '../assets/images/wallet_white.png';
 import { useLocation, useNavigate } from 'react-router-dom';
 import { CSSTransition } from 'react-transition-group';
 import { useSessionStorage } from '../components/useStorage';
-import { Trans } from 'react-i18next';
+import { Trans, useTranslation } from 'react-i18next';
 import { useApi } from '../api';
 
 const Layout = ({ children, isPermissionGranted, tokenSentInSession }) => {
@@ -18,6 +18,7 @@ const Layout = ({ children, isPermissionGranted, tokenSentInSession }) => {
 	const api = useApi();
 	const [isMessageNoGrantedVisible, setIsMessageNoGrantedVisible,] = api.useClearOnClearSession(useSessionStorage('isMessageNoGrantedVisible', null));
 	const [isMessageGrantedVisible, setIsMessageGrantedVisible,] = api.useClearOnClearSession(useSessionStorage('isMessageGrantedVisible', null));
+	const { t } = useTranslation();
 
 	const handleNavigate = (path) => {
 		if (location.pathname === path) {
@@ -63,7 +64,7 @@ const Layout = ({ children, isPermissionGranted, tokenSentInSession }) => {
 					className="text-white text-xl font-bold cursor-pointer"
 					onClick={() => handleNavigate('/')}
 				>
-					wwWallet
+					{t('common.walletName')}
 				</h1>
 				<button className="text-white" onClick={toggleSidebar}>
 					<GiHamburgerMenu size={24} />

src/components/Popups/SelectCredentials.js

@@ -103,11 +103,11 @@ function SelectCredentials({ showPopup, setShowPopup, setSelectionMap, conforman
 								onClick={() => { setApplyTransition(true); setShowRequestedFields(!showRequestedFields) }}
 								className="px-2 py-2 text-white cursor-pointer flex items-center bg-custom-blue hover:bg-custom-blue-hover font-medium rounded-lg text-sm px-4 py-2 text-center dark:bg-custom-blue-hover dark:hover:bg-custom-blue-hover"
 							>
-								{showRequestedFields ? 'Hide Credentials Details' : 'Show Requested Fields'}
+								{showRequestedFields ? `${t('selectCredentialPopup.requestedFieldsHide')}` : `${t('selectCredentialPopup.requestedFieldsShow')}`}
 							</button>
 						</div>
 
-						<hr className="my-2 border-t border-gray-300 py-2" />
+						<hr className="border-t border-gray-300 py-1" />
 
 						<div
 							className={`overflow-hidden transition-height ${showRequestedFields ? 'max-h-96' : 'max-h-0'}`}
@@ -116,7 +116,7 @@ function SelectCredentials({ showPopup, setShowPopup, setSelectionMap, conforman
 						>
 							{renderContent && (
 								<>
-									<p className='mb-2 text-sm italic text-gray-700'>The following fields were requested from the verifier{verifierDomainName}</p>
+									<p className='mb-2 text-sm italic text-gray-700'>{t('selectCredentialPopup.requestedFieldsinfo')} {verifierDomainName}</p>
 									<textarea
 										readOnly
 										value={requestedFields.join('\n')}

src/locales/en.json

@@ -184,7 +184,10 @@
 		"title": "Scan the QR Code"
 	},
 	"selectCredentialPopup": {
-		"description": "Please select one of the above credentials to proceed with the presentation",
+		"description": "Please select one of the credentials below to proceed with the presentation",
+		"requestedFieldsHide": "Hide Requested Fields",
+		"requestedFieldsinfo": "The following fields were requested from the verifier",
+		"requestedFieldsShow": "Show Requested Fields",
 		"title": "Select an Option:"
 	},
 	"sidebar": {