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

Add localization support (#333)

Browse source 
* Add updated i18n config and en locale
This commit is contained in:
Jeff 2023-10-30 19:22:45 -07:00 • committed by GitHub
parent 11863fd4c1
commit 8430b1ec95
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
90 changed files with 2679 additions and 908 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/renderer/features/sidebar/components/action-bar.tsx
View file

@ -1,4 +1,5 @@
import { Grid, Group } from '@mantine/core';
import { useTranslation } from 'react-i18next';
import { RiSearchLine, RiMenuFill, RiArrowLeftSLine, RiArrowRightSLine } from 'react-icons/ri';
import { useNavigate } from 'react-router';
import styled from 'styled-components';
@ -19,6 +20,7 @@ const ActionsContainer = styled.div`
`;
export const ActionBar = () => {
const { t } = useTranslation();
const cq = useContainerQuery({ md: 300 });
const navigate = useNavigate();
const { open } = useCommandPalette();
@ -36,7 +38,7 @@ export const ActionBar = () => {
<TextInput
readOnly
icon={<RiSearchLine />}
placeholder="Search"
placeholder={t('common.search', { postProcess: 'titleCase' })}
size="md"
onClick={open}
onKeyDown={(e) => {

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

@ -1,6 +1,7 @@
import { useMemo } from 'react';
import { Group, UnstyledButton } from '@mantine/core';
import { motion } from 'framer-motion';
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { RiArrowLeftSLine, RiArrowRightSLine, RiMenuFill } from 'react-icons/ri';
import { NavLink, useNavigate } from 'react-router-dom';
import styled from 'styled-components';
@ -24,6 +25,7 @@ const SidebarContainer = styled(motion.div)<{ $windowBarStyle: Platform }>`
`;
export const CollapsedSidebar = () => {
const { t } = useTranslation();
const navigate = useNavigate();
const { windowBarStyle } = useWindowSettings();
const { sidebarItems, sidebarCollapsedNavigation } = useGeneralSettings();
@ -74,7 +76,7 @@ export const CollapsedSidebar = () => {
activeIcon={<RiMenuFill size="25" />}
component={UnstyledButton}
icon={<RiMenuFill size="25" />}
label="Menu"
label={t('common.menu', { postProcess: 'titleCase' })}
/>
</DropdownMenu.Target>
<DropdownMenu.Dropdown>

17
src/renderer/features/sidebar/components/sidebar-playlist-list.tsx
View file

@ -1,6 +1,7 @@
import { useCallback, useMemo, useState } from 'react';
import { Flex, Group } from '@mantine/core';
import { useDebouncedValue } from '@mantine/hooks';
import { useTranslation } from 'react-i18next';
import { RiAddBoxFill, RiAddCircleFill, RiPlayFill } from 'react-icons/ri';
import { generatePath } from 'react-router';
import { Link } from 'react-router-dom';
@ -20,6 +21,7 @@ interface SidebarPlaylistListProps {
}
const PlaylistRow = ({ index, data, style }: ListChildComponentProps) => {
const { t } = useTranslation();
const path = data?.items[index].id
? data.defaultFullPlaylist
? generatePath(AppRoute.PLAYLISTS_DETAIL_SONGS, { playlistId: data.items[index].id })
@ -71,7 +73,10 @@ const PlaylistRow = ({ index, data, style }: ListChildComponentProps) => {
<Button
compact
size="md"
tooltip={{ label: 'Play', openDelay: 500 }}
tooltip={{
label: t('player.play', { postProcess: 'sentenceCase' }),
openDelay: 500,
}}
variant="default"
onClick={() => {
if (!data?.items?.[index].id) return;
@ -83,7 +88,10 @@ const PlaylistRow = ({ index, data, style }: ListChildComponentProps) => {
<Button
compact
size="md"
tooltip={{ label: 'Add to queue', openDelay: 500 }}
tooltip={{
label: t('player.addLast', { postProcess: 'sentenceCase' }),
openDelay: 500,
}}
variant="default"
onClick={() => {
if (!data?.items?.[index].id) return;
@ -95,7 +103,10 @@ const PlaylistRow = ({ index, data, style }: ListChildComponentProps) => {
<Button
compact
size="md"
tooltip={{ label: 'Add to queue next', openDelay: 500 }}
tooltip={{
label: t('player.addNext', { postProcess: 'sentenceCase' }),
openDelay: 500,
}}
variant="default"
onClick={() => {
if (!data?.items?.[index].id) return;

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

@ -1,7 +1,8 @@
import { MouseEvent, useMemo } from 'react';
import { Box, Center, Divider, Group, Stack } from '@mantine/core';
import { closeAllModals, openModal } from '@mantine/modals';
import { AnimatePresence, motion } from 'framer-motion';
import { MouseEvent, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { RiAddFill, RiArrowDownSLine, RiDiscLine, RiListUnordered } from 'react-icons/ri';
import { Link, useLocation } from 'react-router-dom';
import styled from 'styled-components';
@ -68,6 +69,7 @@ const SidebarImage = styled.img`
`;
export const Sidebar = () => {
const { t } = useTranslation();
const location = useLocation();
const sidebar = useSidebarStore();
const { setSideBar } = useAppStoreActions();
@ -89,7 +91,7 @@ export const Sidebar = () => {
openModal({
children: <CreatePlaylistForm onCancel={() => closeAllModals()} />,
size: server?.type === ServerType?.NAVIDROME ? 'xl' : 'sm',
title: 'Create Playlist',
title: t('form.createPlaylist.title', { postProcess: 'titleCase' }),
});
};
@ -176,7 +178,7 @@ export const Sidebar = () => {
fw="600"
sx={{ fontSize: '1.2rem' }}
>
Playlists
{t('page.sidebar.playlists', { postProcess: 'titleCase' })}
</Box>
{playlistsQuery.isLoading && <Spinner />}
</Group>
@ -184,7 +186,12 @@ export const Sidebar = () => {
<Button
compact
size="md"
tooltip={{ label: 'Create playlist', openDelay: 500 }}
tooltip={{
label: t('action.createPlaylist', {
postProcess: 'sentenceCase',
}),
openDelay: 500,
}}
variant="default"
onClick={handleCreatePlaylistModal}
>
@ -195,7 +202,12 @@ export const Sidebar = () => {
component={Link}
size="md"
to={AppRoute.PLAYLISTS}
tooltip={{ label: 'Playlist list', openDelay: 500 }}
tooltip={{
label: t('action.viewPlaylists', {
postProcess: 'sentenceCase',
}),
openDelay: 500,
}}
variant="default"
onClick={(e) => e.stopPropagation()}
>
@ -223,7 +235,9 @@ export const Sidebar = () => {
onClick={expandFullScreenPlayer}
>
<Tooltip
label="Toggle fullscreen player"
label={t('player.toggleFullScreenPlayer', {
postProcess: 'sentenceCase',
})}
openDelay={500}
>
{upsizedImageUrl ? (
@ -248,7 +262,10 @@ export const Sidebar = () => {
radius={100}
size="md"
sx={{ cursor: 'default', position: 'absolute', right: 5, top: 5 }}
tooltip={{ label: 'Collapse', openDelay: 500 }}
tooltip={{
label: t('common.collapse', { postProcess: 'titleCase' }),
openDelay: 500,
}}
variant="default"
onClick={(e) => {
e.stopPropagation();