antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-01 18:33:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Add missing translation keys to sidebar

Browse source
This commit is contained in:
jeffvli 2023-11-01 05:40:42 -07:00
parent d517afdfd3
commit b05d532941
3 changed files with 54 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/renderer/features/settings/components/general/sidebar-settings.tsx
View file

@ -7,6 +7,20 @@ import { MdDragIndicator } from 'react-icons/md';
import { Button, Checkbox, Switch } from '/@/renderer/components'; import { Button, Checkbox, Switch } from '/@/renderer/components';
import { useSettingsStoreActions, useGeneralSettings } from '../../../../store/settings.store'; import { useSettingsStoreActions, useGeneralSettings } from '../../../../store/settings.store';
import { SettingsOptions } from '/@/renderer/features/settings/components/settings-option'; import { SettingsOptions } from '/@/renderer/features/settings/components/settings-option';
import i18n from '/@/i18n/i18n';
const translatedSidebarItemMap = {
Albums: i18n.t('page.sidebar.albums', { postProcess: 'titleCase' }),
Artists: i18n.t('page.sidebar.artists', { postProcess: 'titleCase' }),
Folders: i18n.t('page.sidebar.folders', { postProcess: 'titleCase' }),
Genres: i18n.t('page.sidebar.genres', { postProcess: 'titleCase' }),
Home: i18n.t('page.sidebar.home', { postProcess: 'titleCase' }),
'Now Playing': i18n.t('page.sidebar.nowPlaying', { postProcess: 'titleCase' }),
Playlists: i18n.t('page.sidebar.playlists', { postProcess: 'titleCase' }),
Search: i18n.t('page.sidebar.search', { postProcess: 'titleCase' }),
Settings: i18n.t('page.sidebar.settings', { postProcess: 'titleCase' }),
Tracks: i18n.t('page.sidebar.tracks', { postProcess: 'titleCase' }),
};
const DragHandle = ({ dragControls }: any) => { const DragHandle = ({ dragControls }: any) => {
return ( return (
@ -48,7 +62,7 @@ const DraggableSidebarItem = ({ item, handleChangeDisabled }: DraggableSidebarIt
onChange={(e) => handleChangeDisabled(item.id, e.target.checked)} onChange={(e) => handleChangeDisabled(item.id, e.target.checked)}
/> />
<DragHandle dragControls={dragControls} /> <DragHandle dragControls={dragControls} />
{item.id} {translatedSidebarItemMap[item.id as keyof typeof translatedSidebarItemMap]}
</Group> </Group>
</Reorder.Item> </Reorder.Item>
); );

21
src/renderer/features/sidebar/components/collapsed-sidebar.tsx
View file

@ -30,6 +30,22 @@ export const CollapsedSidebar = () => {
const { windowBarStyle } = useWindowSettings(); const { windowBarStyle } = useWindowSettings();
const { sidebarItems, sidebarCollapsedNavigation } = useGeneralSettings(); const { sidebarItems, sidebarCollapsedNavigation } = useGeneralSettings();
const translatedSidebarItemMap = useMemo(
() => ({
Albums: t('page.sidebar.albums', { postProcess: 'titleCase' }),
Artists: t('page.sidebar.artists', { postProcess: 'titleCase' }),
Folders: t('page.sidebar.folders', { postProcess: 'titleCase' }),
Genres: t('page.sidebar.genres', { postProcess: 'titleCase' }),
Home: t('page.sidebar.home', { postProcess: 'titleCase' }),
'Now Playing': t('page.sidebar.nowPlaying', { postProcess: 'titleCase' }),
Playlists: t('page.sidebar.playlists', { postProcess: 'titleCase' }),
Search: t('page.sidebar.search', { postProcess: 'titleCase' }),
Settings: t('page.sidebar.settings', { postProcess: 'titleCase' }),
Tracks: t('page.sidebar.tracks', { postProcess: 'titleCase' }),
}),
[t],
);
const sidebarItemsWithRoute: SidebarItemType[] = useMemo(() => { const sidebarItemsWithRoute: SidebarItemType[] = useMemo(() => {
if (!sidebarItems) return []; if (!sidebarItems) return [];
@ -37,10 +53,13 @@ export const CollapsedSidebar = () => {
.filter((item) => !item.disabled) .filter((item) => !item.disabled)
.map((item) => ({ .map((item) => ({
...item, ...item,
label:
translatedSidebarItemMap[item.id as keyof typeof translatedSidebarItemMap] ??
item.label,
})); }));
return items; return items;
}, [sidebarItems]); }, [sidebarItems, translatedSidebarItemMap]);
return ( return (
<SidebarContainer $windowBarStyle={windowBarStyle}> <SidebarContainer $windowBarStyle={windowBarStyle}>

20
src/renderer/features/sidebar/components/sidebar.tsx
View file

@ -78,6 +78,21 @@ export const Sidebar = () => {
const imageUrl = useCurrentSong()?.imageUrl; const imageUrl = useCurrentSong()?.imageUrl;
const server = useCurrentServer(); const server = useCurrentServer();
const translatedSidebarItemMap = useMemo(
() => ({
Albums: t('page.sidebar.albums', { postProcess: 'titleCase' }),
Artists: t('page.sidebar.artists', { postProcess: 'titleCase' }),
Folders: t('page.sidebar.folders', { postProcess: 'titleCase' }),
Genres: t('page.sidebar.genres', { postProcess: 'titleCase' }),
Home: t('page.sidebar.home', { postProcess: 'titleCase' }),
'Now Playing': t('page.sidebar.nowPlaying', { postProcess: 'titleCase' }),
Playlists: t('page.sidebar.playlists', { postProcess: 'titleCase' }),
Search: t('page.sidebar.search', { postProcess: 'titleCase' }),
Settings: t('page.sidebar.settings', { postProcess: 'titleCase' }),
Tracks: t('page.sidebar.tracks', { postProcess: 'titleCase' }),
}),
[t],
);
const upsizedImageUrl = imageUrl const upsizedImageUrl = imageUrl
?.replace(/size=\d+/, 'size=450') ?.replace(/size=\d+/, 'size=450')
.replace(/width=\d+/, 'width=450') .replace(/width=\d+/, 'width=450')
@ -121,10 +136,13 @@ export const Sidebar = () => {
.filter((item) => !item.disabled) .filter((item) => !item.disabled)
.map((item) => ({ .map((item) => ({
...item, ...item,
label:
translatedSidebarItemMap[item.id as keyof typeof translatedSidebarItemMap] ??
item.label,
})); }));
return items; return items;
}, [sidebarItems]); }, [sidebarItems, translatedSidebarItemMap]);
return ( return (
<SidebarContainer <SidebarContainer