diff --git a/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx b/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx index 710decfd0f..9b3c9d3bc7 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx @@ -1,11 +1,10 @@ -/* eslint-disable i18next/no-literal-string */ import { Flex } from '@invoke-ai/ui-library'; import ScrollableContent from 'common/components/OverlayScrollbars/ScrollableContent'; import { ControlAdapterList } from 'features/controlLayers/components/ControlAdapter/ControlAdapterList'; import { InpaintMask } from 'features/controlLayers/components/InpaintMask/InpaintMask'; import { IPAdapterList } from 'features/controlLayers/components/IPAdapter/IPAdapterList'; import { LayerEntityList } from 'features/controlLayers/components/Layer/LayerEntityList'; -import { RGEntityList } from 'features/controlLayers/components/RegionalGuidance/RGEntityList'; +import { RegionalGuidanceEntityList } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceEntityList'; import { memo } from 'react'; export const CanvasEntityList = memo(() => { @@ -13,7 +12,7 @@ export const CanvasEntityList = memo(() => { - + diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RG.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidance.tsx similarity index 61% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RG.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidance.tsx index e197ac0837..68f0a9784b 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RG.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidance.tsx @@ -4,21 +4,21 @@ import { CanvasEntityDeleteButton } from 'features/controlLayers/components/comm import { CanvasEntityEnabledToggle } from 'features/controlLayers/components/common/CanvasEntityEnabledToggle'; import { CanvasEntityHeader } from 'features/controlLayers/components/common/CanvasEntityHeader'; import { CanvasEntityTitle } from 'features/controlLayers/components/common/CanvasEntityTitle'; -import { RGActionsMenu } from 'features/controlLayers/components/RegionalGuidance/RGActionsMenu'; -import { RGBadges } from 'features/controlLayers/components/RegionalGuidance/RGBadges'; -import { RGSettings } from 'features/controlLayers/components/RegionalGuidance/RGSettings'; +import { RegionalGuidanceActionsMenu } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceActionsMenu'; +import { RegionalGuidanceBadges } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceBadges'; +import { RegionalGuidanceSettings } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettings'; import { EntityIdentifierContext } from 'features/controlLayers/contexts/EntityIdentifierContext'; import type { CanvasEntityIdentifier } from 'features/controlLayers/store/types'; import { memo, useMemo } from 'react'; -import { RGMaskFillColorPicker } from './RGMaskFillColorPicker'; -import { RGSettingsPopover } from './RGSettingsPopover'; +import { RegionalGuidanceMaskFillColorPicker } from './RegionalGuidanceMaskFillColorPicker'; +import { RegionalGuidanceSettingsPopover } from './RegionalGuidanceSettingsPopover'; type Props = { id: string; }; -export const RG = memo(({ id }: Props) => { +export const RegionalGuidance = memo(({ id }: Props) => { const entityIdentifier = useMemo(() => ({ id, type: 'regional_guidance' }), [id]); const { isOpen, onToggle } = useDisclosure({ defaultIsOpen: true }); return ( @@ -28,16 +28,16 @@ export const RG = memo(({ id }: Props) => { - - - - + + + + - {isOpen && } + {isOpen && } ); }); -RG.displayName = 'RG'; +RegionalGuidance.displayName = 'RegionalGuidance'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGActionsMenu.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceActionsMenu.tsx similarity index 95% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGActionsMenu.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceActionsMenu.tsx index 0f59f275df..e8d9db8885 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGActionsMenu.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceActionsMenu.tsx @@ -15,7 +15,7 @@ import { memo, useCallback, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { PiPlusBold } from 'react-icons/pi'; -export const RGActionsMenu = memo(() => { +export const RegionalGuidanceActionsMenu = memo(() => { const { id } = useEntityIdentifierContext(); const { t } = useTranslation(); const dispatch = useAppDispatch(); @@ -59,4 +59,4 @@ export const RGActionsMenu = memo(() => { ); }); -RGActionsMenu.displayName = 'RGActionsMenu'; +RegionalGuidanceActionsMenu.displayName = 'RegionalGuidanceActionsMenu'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGBadges.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceBadges.tsx similarity index 87% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGBadges.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceBadges.tsx index 82eea7b0a0..541a2a25e3 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGBadges.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceBadges.tsx @@ -5,7 +5,7 @@ import { selectRGOrThrow } from 'features/controlLayers/store/regionsReducers'; import { memo } from 'react'; import { useTranslation } from 'react-i18next'; -export const RGBadges = memo(() => { +export const RegionalGuidanceBadges = memo(() => { const { id } = useEntityIdentifierContext(); const { t } = useTranslation(); const autoNegative = useAppSelector((s) => selectRGOrThrow(s.canvasV2, id).autoNegative); @@ -21,4 +21,4 @@ export const RGBadges = memo(() => { ); }); -RGBadges.displayName = 'RGBadges'; +RegionalGuidanceBadges.displayName = 'RegionalGuidanceBadges'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGDeletePromptButton.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceDeletePromptButton.tsx similarity index 75% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGDeletePromptButton.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceDeletePromptButton.tsx index 4e994b43ec..f44ede94d9 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGDeletePromptButton.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceDeletePromptButton.tsx @@ -7,7 +7,7 @@ type Props = { onDelete: () => void; }; -export const RGDeletePromptButton = memo(({ onDelete }: Props) => { +export const RegionalGuidanceDeletePromptButton = memo(({ onDelete }: Props) => { const { t } = useTranslation(); return ( @@ -21,4 +21,4 @@ export const RGDeletePromptButton = memo(({ onDelete }: Props) => { ); }); -RGDeletePromptButton.displayName = 'RGDeletePromptButton'; +RegionalGuidanceDeletePromptButton.displayName = 'RegionalGuidanceDeletePromptButton'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGEntityList.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceEntityList.tsx similarity index 80% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGEntityList.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceEntityList.tsx index a00fea3e0a..6a864d99cb 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGEntityList.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceEntityList.tsx @@ -1,7 +1,7 @@ import { createMemoizedSelector } from 'app/store/createMemoizedSelector'; import { useAppSelector } from 'app/store/storeHooks'; import { CanvasEntityGroupTitle } from 'features/controlLayers/components/common/CanvasEntityGroupTitle'; -import { RG } from 'features/controlLayers/components/RegionalGuidance/RG'; +import { RegionalGuidance } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidance'; import { mapId } from 'features/controlLayers/konva/util'; import { selectCanvasV2Slice } from 'features/controlLayers/store/canvasV2Slice'; import { memo } from 'react'; @@ -11,7 +11,7 @@ const selectEntityIds = createMemoizedSelector(selectCanvasV2Slice, (canvasV2) = return canvasV2.regions.entities.map(mapId).reverse(); }); -export const RGEntityList = memo(() => { +export const RegionalGuidanceEntityList = memo(() => { const { t } = useTranslation(); const isSelected = useAppSelector((s) => Boolean(s.canvasV2.selectedEntityIdentifier?.type === 'regional_guidance')); const rgIds = useAppSelector(selectEntityIds); @@ -28,11 +28,11 @@ export const RGEntityList = memo(() => { isSelected={isSelected} /> {rgIds.map((id) => ( - + ))} ); } }); -RGEntityList.displayName = 'RGEntityList'; +RegionalGuidanceEntityList.displayName = 'RegionalGuidanceEntityList'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapterSettings.tsx similarity index 96% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapterSettings.tsx index 325fb48266..ed8f4b5804 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapterSettings.tsx @@ -28,7 +28,7 @@ type Props = { ipAdapterNumber: number; }; -export const RGIPAdapterSettings = memo(({ id, ipAdapterId, ipAdapterNumber }: Props) => { +export const RegionalGuidanceIPAdapterSettings = memo(({ id, ipAdapterId, ipAdapterNumber }: Props) => { const dispatch = useAppDispatch(); const onDeleteIPAdapter = useCallback(() => { dispatch(rgIPAdapterDeleted({ id, ipAdapterId })); @@ -136,4 +136,4 @@ export const RGIPAdapterSettings = memo(({ id, ipAdapterId, ipAdapterNumber }: P ); }); -RGIPAdapterSettings.displayName = 'RGIPAdapterSettings'; +RegionalGuidanceIPAdapterSettings.displayName = 'RegionalGuidanceIPAdapterSettings'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapters.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapters.tsx similarity index 63% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapters.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapters.tsx index a6df88f1bc..ef26749ff1 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapters.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapters.tsx @@ -1,6 +1,6 @@ import { Divider, Flex } from '@invoke-ai/ui-library'; import { useAppSelector } from 'app/store/storeHooks'; -import { RGIPAdapterSettings } from 'features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings'; +import { RegionalGuidanceIPAdapterSettings } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapterSettings'; import { selectRGOrThrow } from 'features/controlLayers/store/regionsReducers'; import { memo } from 'react'; @@ -8,7 +8,7 @@ type Props = { id: string; }; -export const RGIPAdapters = memo(({ id }: Props) => { +export const RegionalGuidanceIPAdapters = memo(({ id }: Props) => { const ipAdapterIds = useAppSelector((s) => selectRGOrThrow(s.canvasV2, id).ipAdapters.map(({ id }) => id)); if (ipAdapterIds.length === 0) { @@ -24,11 +24,11 @@ export const RGIPAdapters = memo(({ id }: Props) => { )} - + ))} ); }); -RGIPAdapters.displayName = 'RGLayerIPAdapterList'; +RegionalGuidanceIPAdapters.displayName = 'RegionalGuidanceLayerIPAdapterList'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGMaskFillColorPicker.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceMaskFillColorPicker.tsx similarity index 92% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGMaskFillColorPicker.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceMaskFillColorPicker.tsx index 2f1489cfb0..da26f8940c 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGMaskFillColorPicker.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceMaskFillColorPicker.tsx @@ -10,7 +10,7 @@ import { memo, useCallback } from 'react'; import type { RgbColor } from 'react-colorful'; import { useTranslation } from 'react-i18next'; -export const RGMaskFillColorPicker = memo(() => { +export const RegionalGuidanceMaskFillColorPicker = memo(() => { const entityIdentifier = useEntityIdentifierContext(); const { t } = useTranslation(); const dispatch = useAppDispatch(); @@ -46,4 +46,4 @@ export const RGMaskFillColorPicker = memo(() => { ); }); -RGMaskFillColorPicker.displayName = 'RGMaskFillColorPicker'; +RegionalGuidanceMaskFillColorPicker.displayName = 'RegionalGuidanceMaskFillColorPicker'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGNegativePrompt.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceNegativePrompt.tsx similarity index 84% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGNegativePrompt.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceNegativePrompt.tsx index db879be4f0..b35f2ece44 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGNegativePrompt.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceNegativePrompt.tsx @@ -1,6 +1,6 @@ import { Box, Textarea } from '@invoke-ai/ui-library'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; -import { RGDeletePromptButton } from 'features/controlLayers/components/RegionalGuidance/RGDeletePromptButton'; +import { RegionalGuidanceDeletePromptButton } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceDeletePromptButton'; import { rgNegativePromptChanged } from 'features/controlLayers/store/canvasV2Slice'; import { selectRGOrThrow } from 'features/controlLayers/store/regionsReducers'; import { PromptOverlayButtonWrapper } from 'features/parameters/components/Prompts/PromptOverlayButtonWrapper'; @@ -14,7 +14,7 @@ type Props = { id: string; }; -export const RGNegativePrompt = memo(({ id }: Props) => { +export const RegionalGuidanceNegativePrompt = memo(({ id }: Props) => { const prompt = useAppSelector((s) => selectRGOrThrow(s.canvasV2, id).negativePrompt ?? ''); const dispatch = useAppDispatch(); const textareaRef = useRef(null); @@ -50,7 +50,7 @@ export const RGNegativePrompt = memo(({ id }: Props) => { fontSize="sm" /> - + @@ -58,4 +58,4 @@ export const RGNegativePrompt = memo(({ id }: Props) => { ); }); -RGNegativePrompt.displayName = 'RGNegativePrompt'; +RegionalGuidanceNegativePrompt.displayName = 'RegionalGuidanceNegativePrompt'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGPositivePrompt.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidancePositivePrompt.tsx similarity index 84% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGPositivePrompt.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidancePositivePrompt.tsx index 49bca080da..cd04eee31d 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGPositivePrompt.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidancePositivePrompt.tsx @@ -1,6 +1,6 @@ import { Box, Textarea } from '@invoke-ai/ui-library'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; -import { RGDeletePromptButton } from 'features/controlLayers/components/RegionalGuidance/RGDeletePromptButton'; +import { RegionalGuidanceDeletePromptButton } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceDeletePromptButton'; import { rgPositivePromptChanged } from 'features/controlLayers/store/canvasV2Slice'; import { selectRGOrThrow } from 'features/controlLayers/store/regionsReducers'; import { PromptOverlayButtonWrapper } from 'features/parameters/components/Prompts/PromptOverlayButtonWrapper'; @@ -14,7 +14,7 @@ type Props = { id: string; }; -export const RGPositivePrompt = memo(({ id }: Props) => { +export const RegionalGuidancePositivePrompt = memo(({ id }: Props) => { const prompt = useAppSelector((s) => selectRGOrThrow(s.canvasV2, id).positivePrompt ?? ''); const dispatch = useAppDispatch(); const textareaRef = useRef(null); @@ -50,7 +50,7 @@ export const RGPositivePrompt = memo(({ id }: Props) => { minH={28} /> - + @@ -58,4 +58,4 @@ export const RGPositivePrompt = memo(({ id }: Props) => { ); }); -RGPositivePrompt.displayName = 'RGPositivePrompt'; +RegionalGuidancePositivePrompt.displayName = 'RegionalGuidancePositivePrompt'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGSettings.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettings.tsx similarity index 63% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGSettings.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettings.tsx index c13081d644..f7f96fd79f 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGSettings.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettings.tsx @@ -5,11 +5,11 @@ import { useEntityIdentifierContext } from 'features/controlLayers/contexts/Enti import { selectRGOrThrow } from 'features/controlLayers/store/regionsReducers'; import { memo } from 'react'; -import { RGIPAdapters } from './RGIPAdapters'; -import { RGNegativePrompt } from './RGNegativePrompt'; -import { RGPositivePrompt } from './RGPositivePrompt'; +import { RegionalGuidanceIPAdapters } from './RegionalGuidanceIPAdapters'; +import { RegionalGuidanceNegativePrompt } from './RegionalGuidanceNegativePrompt'; +import { RegionalGuidancePositivePrompt } from './RegionalGuidancePositivePrompt'; -export const RGSettings = memo(() => { +export const RegionalGuidanceSettings = memo(() => { const { id } = useEntityIdentifierContext(); const hasPositivePrompt = useAppSelector((s) => selectRGOrThrow(s.canvasV2, id).positivePrompt !== null); const hasNegativePrompt = useAppSelector((s) => selectRGOrThrow(s.canvasV2, id).negativePrompt !== null); @@ -18,11 +18,11 @@ export const RGSettings = memo(() => { return ( {!hasPositivePrompt && !hasNegativePrompt && !hasIPAdapters && } - {hasPositivePrompt && } - {hasNegativePrompt && } - {hasIPAdapters && } + {hasPositivePrompt && } + {hasNegativePrompt && } + {hasIPAdapters && } ); }); -RGSettings.displayName = 'RGSettings'; +RegionalGuidanceSettings.displayName = 'RegionalGuidanceSettings'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGSettingsPopover.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettingsPopover.tsx similarity index 93% rename from invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGSettingsPopover.tsx rename to invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettingsPopover.tsx index b82469fafc..0565026cfd 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGSettingsPopover.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RegionalGuidanceSettingsPopover.tsx @@ -20,7 +20,7 @@ import { memo, useCallback } from 'react'; import { useTranslation } from 'react-i18next'; import { PiGearSixBold } from 'react-icons/pi'; -export const RGSettingsPopover = memo(() => { +export const RegionalGuidanceSettingsPopover = memo(() => { const entityIdentifier = useEntityIdentifierContext(); const { t } = useTranslation(); const dispatch = useAppDispatch(); @@ -60,4 +60,4 @@ export const RGSettingsPopover = memo(() => { ); }); -RGSettingsPopover.displayName = 'RGSettingsPopover'; +RegionalGuidanceSettingsPopover.displayName = 'RegionalGuidanceSettingsPopover';