♻️ Add translations for board customize page

This commit is contained in:
Meier Lukas
2023-08-05 17:18:05 +02:00
parent 6aff6dbedc
commit 73589623d4
15 changed files with 87 additions and 57 deletions

View File

@@ -18,11 +18,7 @@ import Editor from 'react-simple-code-editor';
import { useBoardCustomizationFormContext } from '../form';
export const AppearanceCustomization = () => {
const { t } = useTranslation([
'settings/customization/page-appearance',
'settings/customization/color-selector',
]);
const theme = useMantineTheme();
const { t } = useTranslation('settings/customization/page-appearance');
const form = useBoardCustomizationFormContext();
return (
@@ -45,7 +41,7 @@ type ColorSelectorProps = {
type: 'primaryColor' | 'secondaryColor';
};
const ColorSelector = ({ type }: ColorSelectorProps) => {
const { t } = useTranslation('settings/customization/color-selector');
const { t } = useTranslation('boards/customize');
const theme = useMantineTheme();
const form = useBoardCustomizationFormContext();
@@ -55,7 +51,7 @@ const ColorSelector = ({ type }: ColorSelectorProps) => {
}));
return (
<Input.Wrapper label={type}>
<Input.Wrapper label={t(`settings.appearance.${type}`)}>
<Group>
{colors.map(({ color, swatch }) => (
<ColorSwatch

View File

@@ -1,5 +1,4 @@
import { Button, Checkbox, Grid, Stack } from '@mantine/core';
import { IconDeviceFloppy } from '@tabler/icons-react';
import { Checkbox, Grid, Stack } from '@mantine/core';
import { useTranslation } from 'next-i18next';
import { useBoardCustomizationFormContext } from '../form';

View File

@@ -15,12 +15,12 @@ import { Trans, useTranslation } from 'next-i18next';
import Link from 'next/link';
import { useEditModeStore } from '~/components/Dashboard/Views/useEditModeStore';
import { useNamedWrapperColumnCount } from '~/components/Dashboard/Wrappers/gridstack/store';
import { BoardHeadOverride } from '~/components/layout/Meta/BoardHeadOverride';
import { HeaderActionButton } from '~/components/layout/header/ActionButton';
import { useConfigContext } from '~/config/provider';
import { env } from '~/env';
import { api } from '~/utils/api';
import { HeaderActionButton } from '~/components/layout/header/ActionButton';
import { BoardHeadOverride } from '~/components/layout/Meta/BoardHeadOverride';
import { MainLayout } from './MainLayout';
type BoardLayoutProps = {
@@ -68,10 +68,10 @@ const DockerButton = () => {
const CustomizeBoardButton = () => {
const { name } = useConfigContext();
console.log('name', name);
const { t } = useTranslation('boards/common');
return (
<Tooltip label="Customize board">
<Tooltip label={t('header.customize')}>
<HeaderActionButton component={Link} href={`/board/${name}/customize`}>
<IconSettings size={20} stroke={1.5} />
</HeaderActionButton>
@@ -158,7 +158,7 @@ const ToggleEditModeButton = () => {
if (enabled) {
return (
<Button.Group>
<Tooltip label={t('button.disabled')}>
<Tooltip label={t('button.enabled')}>
<HeaderActionButton onClick={save}>
<IconEditCircleOff size={20} stroke={1.5} />
</HeaderActionButton>