feat(ui): use translations for rp features

This commit is contained in:
psychedelicious 2024-04-19 22:30:20 +10:00 committed by Kent Keirsey
parent bb371cfeca
commit c613839740
6 changed files with 25 additions and 8 deletions

View File

@ -137,7 +137,8 @@
"green": "Green",
"blue": "Blue",
"alpha": "Alpha",
"selected": "Selected"
"selected": "Selected",
"viewer": "Viewer"
},
"controlnet": {
"controlAdapter_one": "Control Adapter",
@ -1508,11 +1509,16 @@
"storeNotInitialized": "Store is not initialized"
},
"regionalPrompts": {
"deleteAll": "Delete All",
"addLayer": "Add Layer",
"moveToFront": "Move to Front",
"moveToBack": "Move to Back",
"moveForward": "Move Forward",
"moveBackward": "Move Backward",
"brushSize": "Brush Size"
"brushSize": "Brush Size",
"regionalPrompts": "Regional Prompts",
"enableRegionalPrompts": "Enable $t(regionalPrompts.regionalPrompts)",
"layerOpacity": "Layer Opacity",
"autoNegative": "Auto Negative"
}
}

View File

@ -2,14 +2,16 @@ import { Button } from '@invoke-ai/ui-library';
import { useAppDispatch } from 'app/store/storeHooks';
import { allLayersDeleted } from 'features/regionalPrompts/store/regionalPromptsSlice';
import { memo, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
export const DeleteAllLayersButton = memo(() => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const onClick = useCallback(() => {
dispatch(allLayersDeleted());
}, [dispatch]);
return <Button onClick={onClick}>Delete All</Button>;
return <Button onClick={onClick}>{t('regionalPrompts.deleteAll')}</Button>;
});
DeleteAllLayersButton.displayName = 'DeleteAllLayersButton';

View File

@ -19,7 +19,7 @@ export const PromptLayerOpacity = memo(() => {
);
return (
<FormControl>
<FormLabel>Layer Opacity</FormLabel>
<FormLabel>{t('regionalPrompts.layerOpacity')}</FormLabel>
<CompositeSlider
min={0.25}
max={1}

View File

@ -18,7 +18,7 @@ export const RPEnabledSwitch = memo(() => {
return (
<FormControl flexGrow={0} gap={2} w="min-content">
<FormLabel m={0}>Enable RP</FormLabel>
<FormLabel>{t('regionalPrompts.enableRegionalPrompts')}</FormLabel>
<Switch isChecked={isEnabled} onChange={onChange} />
</FormControl>
);

View File

@ -54,7 +54,7 @@ export const RPLayerAutoNegativeCombobox = memo(({ layerId }: Props) => {
return (
<FormControl flexGrow={0} gap={2} w="min-content">
<FormLabel m={0}>AutoNegative</FormLabel>
<FormLabel m={0}>{t('regionalPrompts.autoNegative')}</FormLabel>
<Combobox value={value} options={options} onChange={onChange} isSearchable={false} sx={{ w: '5.2rem' }} />
</FormControl>
);

View File

@ -1,15 +1,24 @@
import { Box, Tab, TabList, TabPanel, TabPanels, Tabs } from '@invoke-ai/ui-library';
import { useAppSelector } from 'app/store/storeHooks';
import CurrentImageDisplay from 'features/gallery/components/CurrentImage/CurrentImageDisplay';
import { RegionalPromptsEditor } from 'features/regionalPrompts/components/RegionalPromptsEditor';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
const TextToImageTab = () => {
const { t } = useTranslation();
const noOfRPLayers = useAppSelector(
(s) => s.regionalPrompts.present.layers.filter((l) => l.kind === 'regionalPromptLayer' && l.isVisible).length
);
return (
<Box position="relative" w="full" h="full" p={2} borderRadius="base">
<Tabs variant="line" isLazy={true} display="flex" flexDir="column" w="full" h="full">
<TabList>
<Tab>Viewer</Tab>
<Tab>Regional Prompts</Tab>
<Tab>{t('common.viewer')}</Tab>
<Tab>
{t('regionalPrompts.regionalPrompts')}
{noOfRPLayers > 0 ? ` (${noOfRPLayers})` : ''}
</Tab>
</TabList>
<TabPanels w="full" h="full">