Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

tidy(ui): ViewerToggleMenu -> ViewerToggle

Browse Source
This commit is contained in:
psychedelicious 2024-08-29 10:58:14 +10:00
parent 9467b937ff
commit 93f1d67fbf
3 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
invokeai/frontend/web/src/features/controlLayers/components/ControlLayersToolbar.tsx
View File

@ -10,7 +10,7 @@ import { ToolSettings } from 'features/controlLayers/components/Tool/ToolSetting
import { CanvasManagerProviderGate } from 'features/controlLayers/contexts/CanvasManagerProviderGate'; import { CanvasManagerProviderGate } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
import { useCanvasUndoRedo } from 'features/controlLayers/hooks/useCanvasUndoRedo'; import { useCanvasUndoRedo } from 'features/controlLayers/hooks/useCanvasUndoRedo';
import { ToggleProgressButton } from 'features/gallery/components/ImageViewer/ToggleProgressButton'; import { ToggleProgressButton } from 'features/gallery/components/ImageViewer/ToggleProgressButton';
import { ViewerToggleMenu } from 'features/gallery/components/ImageViewer/ViewerToggleMenu'; import { ViewerToggle } from 'features/gallery/components/ImageViewer/ViewerToggleMenu';
import { memo } from 'react'; import { memo } from 'react';
export const ControlLayersToolbar = memo(() => { export const ControlLayersToolbar = memo(() => {
@ -30,7 +30,7 @@ export const ControlLayersToolbar = memo(() => {
<ToolFillColorPicker /> <ToolFillColorPicker />
<CanvasModeSwitcher /> <CanvasModeSwitcher />
<CanvasSettingsPopover /> <CanvasSettingsPopover />
<ViewerToggleMenu /> <ViewerToggle />
</Flex> </Flex>
</CanvasManagerProviderGate> </CanvasManagerProviderGate>
); );

7
invokeai/frontend/web/src/features/gallery/components/ImageViewer/ViewerToggleMenu.tsx
View File

@ -1,10 +1,11 @@
import { ButtonGroup, Flex, IconButton, Text, Tooltip } from '@invoke-ai/ui-library'; import { ButtonGroup, Flex, IconButton, Text, Tooltip } from '@invoke-ai/ui-library';
import { useImageViewer } from 'features/gallery/components/ImageViewer/useImageViewer'; import { useImageViewer } from 'features/gallery/components/ImageViewer/useImageViewer';
import { memo } from 'react';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { PiEyeBold, PiPencilBold } from 'react-icons/pi'; import { PiEyeBold, PiPencilBold } from 'react-icons/pi';
export const ViewerToggleMenu = () => { export const ViewerToggle = memo(() => {
const { t } = useTranslation(); const { t } = useTranslation();
const imageViewer = useImageViewer(); const imageViewer = useImageViewer();
useHotkeys('z', imageViewer.onToggle, [imageViewer]); useHotkeys('z', imageViewer.onToggle, [imageViewer]);
@ -52,4 +53,6 @@ export const ViewerToggleMenu = () => {
</ButtonGroup> </ButtonGroup>
</Flex> </Flex>
); );
}; });
ViewerToggle.displayName = 'ViewerToggle';

4
invokeai/frontend/web/src/features/gallery/components/ImageViewer/ViewerToolbar.tsx
View File

@ -7,7 +7,7 @@ import { selectActiveTab } from 'features/ui/store/uiSelectors';
import { memo } from 'react'; import { memo } from 'react';
import CurrentImageButtons from './CurrentImageButtons'; import CurrentImageButtons from './CurrentImageButtons';
import { ViewerToggleMenu } from './ViewerToggleMenu'; import { ViewerToggle } from './ViewerToggleMenu';
const selectShowToggle = createSelector(selectActiveTab, (tab) => { const selectShowToggle = createSelector(selectActiveTab, (tab) => {
if (tab === 'upscaling' || tab === 'workflows') { if (tab === 'upscaling' || tab === 'workflows') {
@ -31,7 +31,7 @@ export const ViewerToolbar = memo(() => {
</Flex> </Flex>
<Flex flex={1} justifyContent="center"> <Flex flex={1} justifyContent="center">
<Flex gap={2} marginInlineStart="auto"> <Flex gap={2} marginInlineStart="auto">
{showToggle && <ViewerToggleMenu />} {showToggle && <ViewerToggle />}
</Flex> </Flex>
</Flex> </Flex>
</Flex> </Flex>