Translate labels and aria-labels

This commit is contained in:
Nicola Benaglia 2025-05-20 22:46:45 +02:00
parent 71475c2e77
commit 4abaf06489
18 changed files with 92 additions and 26 deletions

View File

@ -541,7 +541,9 @@ const WalletItem = ({ wallet, updateWalletItem, idx, setSelectedWallet }) => {
setIsEdit(true);
}}
edge="end"
aria-label="edit"
aria-label={t('core:action.edit', {
postProcess: 'capitalizeFirstChar',
})}
>
<EditIcon />
</IconButton>

View File

@ -109,7 +109,9 @@ export const AppsDevModeNavBar = () => {
<Tabs
orientation="vertical"
ref={tabsRef}
aria-label="basic tabs example"
aria-label={t('core:basic_tabs_example', {
postProcess: 'capitalizeFirstChar',
})}
variant="scrollable" // Make tabs scrollable
scrollButtons={true}
sx={{

View File

@ -183,7 +183,9 @@ export const AppsNavBarDesktop = ({ disableBack }) => {
<Tabs
orientation="vertical"
ref={tabsRef}
aria-label="basic tabs example"
aria-label={t('core:basic_tabs_example', {
postProcess: 'capitalizeFirstChar',
})}
variant="scrollable" // Make tabs scrollable
scrollButtons={true}
sx={{

View File

@ -311,7 +311,9 @@ export const AppsPrivate = ({ myName }) => {
<Tabs
value={valueTabPrivateApp}
onChange={handleChange}
aria-label="basic tabs example"
aria-label={t('core:basic_tabs_example', {
postProcess: 'capitalizeFirstChar',
})}
variant={'fullWidth'}
scrollButtons="auto"
sx={{

View File

@ -22,9 +22,12 @@ import {
subscribeToEvent,
unsubscribeFromEvent,
} from '../utils/events';
import { useTranslation } from 'react-i18next';
export const BuyQortInformation = ({ balance }) => {
const [isOpen, setIsOpen] = useState(false);
const theme = useTheme();
const { t } = useTranslation(['auth', 'core', 'group']);
const openBuyQortInfoFunc = useCallback(
(e) => {
@ -33,8 +36,6 @@ export const BuyQortInformation = ({ balance }) => {
[setIsOpen]
);
const theme = useTheme();
useEffect(() => {
subscribeToEvent('openBuyQortInfo', openBuyQortInfoFunc);
@ -62,7 +63,7 @@ export const BuyQortInformation = ({ balance }) => {
maxWidth: '90vw',
padding: '10px',
width: '400px',
}}
}} // TODO translate
>
<Typography>
Get QORT using Qortal's crosschain trade portal
@ -113,7 +114,9 @@ export const BuyQortInformation = ({ balance }) => {
maxWidth: 360,
width: '100%',
}}
aria-label="contacts"
aria-label={t('core:contact_other', {
postProcess: 'capitalizeFirstChar',
})}
>
<ListItem disablePadding>
<ListItemIcon>

View File

@ -7,6 +7,7 @@ import { HomeIcon } from '../../assets/Icons/HomeIcon';
import { Save } from '../Save/Save';
import { enabledDevModeAtom } from '../../atoms/global';
import { useAtom } from 'jotai';
import { useTranslation } from 'react-i18next';
export const IconWrapper = ({
children,
@ -65,8 +66,8 @@ export const DesktopFooter = ({
setIsOpenSideViewGroups,
}) => {
const [isEnabledDevMode, setIsEnabledDevMode] = useAtom(enabledDevModeAtom);
const theme = useTheme();
const { t } = useTranslation(['auth', 'core', 'group']);
if (hide) return;
return (
@ -105,7 +106,12 @@ export const DesktopFooter = ({
setIsOpenSideViewGroups(false);
}}
>
<IconWrapper label="Apps" selected={isApps}>
<IconWrapper
label={t('core:app_other', {
postProcess: 'capitalizeFirstChar',
})}
selected={isApps}
>
<img src={AppIcon} />
</IconWrapper>
</ButtonBase>
@ -115,7 +121,12 @@ export const DesktopFooter = ({
setDesktopSideView('groups');
}}
>
<IconWrapper label="Groups" selected={isGroups}>
<IconWrapper
label={t('group:group.group_other', {
postProcess: 'capitalizeFirstChar',
})}
selected={isGroups}
>
<HubsIcon
height={30}
color={

View File

@ -233,7 +233,9 @@ export const AddGroup = ({ address, open, setOpen }) => {
</Typography>
<IconButton
aria-label="close"
aria-label={t('core:action.close', {
postProcess: 'capitalizeFirstChar',
})}
color="inherit"
edge="start"
onClick={handleClose}
@ -259,7 +261,9 @@ export const AddGroup = ({ address, open, setOpen }) => {
<Tabs
value={value}
onChange={handleChange}
aria-label="basic tabs example"
aria-label={t('core:basic_tabs_example', {
postProcess: 'capitalizeFirstChar',
})}
variant={'fullWidth'}
scrollButtons="auto"
allowScrollButtonsMobile

View File

@ -1648,7 +1648,9 @@ export const Group = ({
? theme.palette.text.primary
: theme.palette.text.secondary
}
label="Groups"
label={t('group:group.group_other', {
postProcess: 'capitalizeFirstChar',
})}
selected={desktopSideView === 'groups'}
customWidth="75px"
>

View File

@ -162,7 +162,12 @@ export const GroupInvites = ({ myAddress, setOpenAddGroup }) => {
}}
disablePadding
secondaryAction={
<IconButton edge="end" aria-label="comments">
<IconButton
edge="end"
aria-label={t('core:comment_other', {
postProcess: 'capitalizeFirstChar',
})}
>
<GroupAddIcon
sx={{
color: theme.palette.text.primary,

View File

@ -245,7 +245,12 @@ export const GroupJoinRequests = ({
}}
disablePadding
secondaryAction={
<IconButton edge="end" aria-label="comments">
<IconButton
edge="end"
aria-label={t('core:comment_other', {
postProcess: 'capitalizeFirstChar',
})}
>
<GroupAddIcon
sx={{
color: theme.palette.text.primary,

View File

@ -164,7 +164,12 @@ export const ListOfThreadPostsWatched = () => {
}}
disablePadding
secondaryAction={
<IconButton edge="end" aria-label="comments">
<IconButton
edge="end"
aria-label={t('core:comment_other', {
postProcess: 'capitalizeFirstChar',
})}
>
<VisibilityIcon
sx={{
color: 'red',

View File

@ -215,7 +215,9 @@ export const ManageMembers = ({
</Typography>
<IconButton
aria-label="close"
aria-label={t('core:action.close', {
postProcess: 'capitalizeFirstChar',
})}
color="inherit"
edge="start"
onClick={handleClose}
@ -237,7 +239,9 @@ export const ManageMembers = ({
<Tabs
value={value}
onChange={handleChange}
aria-label="basic tabs example"
aria-label={t('core:basic_tabs_example', {
postProcess: 'capitalizeFirstChar',
})}
variant="scrollable" // Make tabs scrollable
scrollButtons="auto" // Show scroll buttons automatically
allowScrollButtonsMobile // Show scroll buttons on mobile as well

View File

@ -170,7 +170,9 @@ export const Settings = ({ open, setOpen, rawWallet }) => {
edge="start"
color="inherit"
onClick={handleClose}
aria-label="close"
aria-label={t('core:action.close', {
postProcess: 'capitalizeFirstChar',
})}
>
<CloseIcon />
</IconButton>

View File

@ -51,7 +51,10 @@ const LanguageSelector = () => {
background: 'none',
cursor: 'pointer',
}}
aria-label={`Current language: ${name}`}
aria-label={t('core:current_language', {
language: name,
postProcess: 'capitalizeFirstChar',
})}
>
{flag}
</button>

View File

@ -581,7 +581,9 @@ export const Minting = ({ setIsOpenMinting, myAddress, show }) => {
}}
color="inherit"
onClick={() => setIsOpenMinting(false)}
aria-label="close"
aria-label={t('core:action.close', {
postProcess: 'capitalizeFirstChar',
})}
>
<CloseIcon />
</IconButton>

View File

@ -346,7 +346,9 @@ export const RegisterName = ({
<List
sx={{ width: '100%', maxWidth: 360, bgcolor: 'background.paper' }}
aria-label="contacts"
aria-label={t('core:contact_other', {
postProcess: 'capitalizeFirstChar',
})}
>
<ListItem disablePadding>
<ListItemIcon>

View File

@ -46,7 +46,9 @@ export const Tutorials = () => {
}}
value={multiNumber}
onChange={(e, value) => setMultiNumber(value)}
aria-label="basic tabs example"
aria-label={t('core:basic_tabs_example', {
postProcess: 'capitalizeFirstChar',
})}
>
{openTutorialModal?.multi?.map((item, index) => {
return (
@ -66,7 +68,9 @@ export const Tutorials = () => {
<DialogTitle sx={{ m: 0, p: 2 }}>{selectedTutorial?.title}</DialogTitle>
<IconButton
aria-label="close"
aria-label={t('core:action.close', {
postProcess: 'capitalizeFirstChar',
})}
onClick={handleClose}
sx={{
position: 'absolute',
@ -112,7 +116,9 @@ export const Tutorials = () => {
</DialogTitle>
<IconButton
aria-label="close"
aria-label={t('core:action.close', {
postProcess: 'capitalizeFirstChar',
})}
onClick={handleClose}
sx={{
position: 'absolute',

View File

@ -101,15 +101,19 @@
"apps_official": "official Apps",
"attachment": "attachment",
"balance": "balance:",
"basic_tabs_example": "basic tabs example",
"category": "category",
"category_other": "categories",
"chat": "chat",
"comment_other": "comments",
"contact_other": "contacts",
"core": {
"block_height": "block height",
"information": "core information",
"peers": "connected peers",
"version": "core version"
},
"current_language": "current language: {{ language }}",
"dev": "dev",
"domain": "domain",
"ui": {