From 49dd316f1714ec376770427d0bc45d4bd76a74a9 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Wed, 7 Aug 2024 17:52:55 +1000
Subject: [PATCH] tidy(ui): clearer component names for ip adapter
---
.../components/CanvasEntityList.tsx | 4 ++--
.../IPAdapter/{IPA.tsx => IPAdapter.tsx} | 8 ++++----
...magePreview.tsx => IPAdapterImagePreview.tsx} | 4 ++--
.../{IPAEntityList.tsx => IPAdapterList.tsx} | 8 ++++----
.../{IPAMethod.tsx => IPAdapterMethod.tsx} | 4 ++--
.../{IPAModelCombobox.tsx => IPAdapterModel.tsx} | 4 ++--
.../{IPASettings.tsx => IPAdapterSettings.tsx} | 16 ++++++++--------
.../RegionalGuidance/RGIPAdapterSettings.tsx | 12 ++++++------
8 files changed, 30 insertions(+), 30 deletions(-)
rename invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/{IPA.tsx => IPAdapter.tsx} (86%)
rename invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/{IPAImagePreview.tsx => IPAdapterImagePreview.tsx} (95%)
rename invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/{IPAEntityList.tsx => IPAdapterList.tsx} (84%)
rename invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/{IPAMethod.tsx => IPAdapterMethod.tsx} (92%)
rename invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/{IPAModelCombobox.tsx => IPAdapterModel.tsx} (94%)
rename invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/{IPASettings.tsx => IPAdapterSettings.tsx} (89%)
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx b/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx
index 1d309d4e12..710decfd0f 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList.tsx
@@ -3,7 +3,7 @@ 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 { IPAEntityList } from 'features/controlLayers/components/IPAdapter/IPAEntityList';
+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 { memo } from 'react';
@@ -15,7 +15,7 @@ export const CanvasEntityList = memo(() => {
<InpaintMask />
<RGEntityList />
<ControlAdapterList />
- <IPAEntityList />
+ <IPAdapterList />
<LayerEntityList />
</Flex>
</ScrollableContent>
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPA.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapter.tsx
similarity index 86%
rename from invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPA.tsx
rename to invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapter.tsx
index a4befcdbdd..4b47536179 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPA.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapter.tsx
@@ -4,7 +4,7 @@ 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 { IPASettings } from 'features/controlLayers/components/IPAdapter/IPASettings';
+import { IPAdapterSettings } from 'features/controlLayers/components/IPAdapter/IPAdapterSettings';
import { EntityIdentifierContext } from 'features/controlLayers/contexts/EntityIdentifierContext';
import type { CanvasEntityIdentifier } from 'features/controlLayers/store/types';
import { memo, useMemo } from 'react';
@@ -13,7 +13,7 @@ type Props = {
id: string;
};
-export const IPA = memo(({ id }: Props) => {
+export const IPAdapter = memo(({ id }: Props) => {
const entityIdentifier = useMemo<CanvasEntityIdentifier>(() => ({ id, type: 'ip_adapter' }), [id]);
const { isOpen, onToggle } = useDisclosure({ defaultIsOpen: true });
@@ -26,10 +26,10 @@ export const IPA = memo(({ id }: Props) => {
<Spacer />
<CanvasEntityDeleteButton />
</CanvasEntityHeader>
- {isOpen && <IPASettings />}
+ {isOpen && <IPAdapterSettings />}
</CanvasEntityContainer>
</EntityIdentifierContext.Provider>
);
});
-IPA.displayName = 'IPA';
+IPAdapter.displayName = 'IPAdapter';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAImagePreview.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterImagePreview.tsx
similarity index 95%
rename from invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAImagePreview.tsx
rename to invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterImagePreview.tsx
index 4dc44c9ae0..9e76aa1b91 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterImagePreview.tsx
@@ -22,7 +22,7 @@ type Props = {
postUploadAction: PostUploadAction;
};
-export const IPAImagePreview = memo(({ image, onChangeImage, ipAdapterId, droppableData, postUploadAction }: Props) => {
+export const IPAdapterImagePreview = memo(({ image, onChangeImage, ipAdapterId, droppableData, postUploadAction }: Props) => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const isConnected = useAppSelector((s) => s.system.isConnected);
@@ -97,4 +97,4 @@ export const IPAImagePreview = memo(({ image, onChangeImage, ipAdapterId, droppa
);
});
-IPAImagePreview.displayName = 'IPAImagePreview';
+IPAdapterImagePreview.displayName = 'IPAdapterImagePreview';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAEntityList.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterList.tsx
similarity index 84%
rename from invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAEntityList.tsx
rename to invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterList.tsx
index 5e04bc6162..348f525ae5 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAEntityList.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterList.tsx
@@ -2,7 +2,7 @@
import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
import { useAppSelector } from 'app/store/storeHooks';
import { CanvasEntityGroupTitle } from 'features/controlLayers/components/common/CanvasEntityGroupTitle';
-import { IPA } from 'features/controlLayers/components/IPAdapter/IPA';
+import { IPAdapter } from 'features/controlLayers/components/IPAdapter/IPAdapter';
import { mapId } from 'features/controlLayers/konva/util';
import { selectCanvasV2Slice } from 'features/controlLayers/store/canvasV2Slice';
import { memo } from 'react';
@@ -12,7 +12,7 @@ const selectEntityIds = createMemoizedSelector(selectCanvasV2Slice, (canvasV2) =
return canvasV2.ipAdapters.entities.map(mapId).reverse();
});
-export const IPAEntityList = memo(() => {
+export const IPAdapterList = memo(() => {
const { t } = useTranslation();
const isSelected = useAppSelector((s) => Boolean(s.canvasV2.selectedEntityIdentifier?.type === 'ip_adapter'));
const ipaIds = useAppSelector(selectEntityIds);
@@ -29,11 +29,11 @@ export const IPAEntityList = memo(() => {
isSelected={isSelected}
/>
{ipaIds.map((id) => (
- <IPA key={id} id={id} />
+ <IPAdapter key={id} id={id} />
))}
</>
);
}
});
-IPAEntityList.displayName = 'IPAEntityList';
+IPAdapterList.displayName = 'IPAdapterList';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAMethod.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterMethod.tsx
similarity index 92%
rename from invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAMethod.tsx
rename to invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterMethod.tsx
index 55c99fa6f7..1e1165fbc7 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAMethod.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterMethod.tsx
@@ -12,7 +12,7 @@ type Props = {
onChange: (method: IPMethodV2) => void;
};
-export const IPAMethod = memo(({ method, onChange }: Props) => {
+export const IPAdapterMethod = memo(({ method, onChange }: Props) => {
const { t } = useTranslation();
const options: { label: string; value: IPMethodV2 }[] = useMemo(
() => [
@@ -41,4 +41,4 @@ export const IPAMethod = memo(({ method, onChange }: Props) => {
);
});
-IPAMethod.displayName = 'IPAMethod';
+IPAdapterMethod.displayName = 'IPAdapterMethod';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAModelCombobox.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterModel.tsx
similarity index 94%
rename from invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAModelCombobox.tsx
rename to invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterModel.tsx
index 34e215dde7..80e322d7f4 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAModelCombobox.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterModel.tsx
@@ -22,7 +22,7 @@ type Props = {
onChangeCLIPVisionModel: (clipVisionModel: CLIPVisionModelV2) => void;
};
-export const IPAModelCombobox = memo(({ modelKey, onChangeModel, clipVisionModel, onChangeCLIPVisionModel }: Props) => {
+export const IPAdapterModel = memo(({ modelKey, onChangeModel, clipVisionModel, onChangeCLIPVisionModel }: Props) => {
const { t } = useTranslation();
const currentBaseModel = useAppSelector((s) => s.canvasV2.params.model?.base);
const [modelConfigs, { isLoading }] = useIPAdapterModels();
@@ -95,4 +95,4 @@ export const IPAModelCombobox = memo(({ modelKey, onChangeModel, clipVisionModel
);
});
-IPAModelCombobox.displayName = 'IPAModelCombobox';
+IPAdapterModel.displayName = 'IPAdapterModel';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPASettings.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterSettings.tsx
similarity index 89%
rename from invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPASettings.tsx
rename to invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterSettings.tsx
index 5121bc27dc..a8d331bde9 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPASettings.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IPAdapter/IPAdapterSettings.tsx
@@ -3,7 +3,7 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { BeginEndStepPct } from 'features/controlLayers/components/common/BeginEndStepPct';
import { CanvasEntitySettings } from 'features/controlLayers/components/common/CanvasEntitySettings';
import { Weight } from 'features/controlLayers/components/common/Weight';
-import { IPAMethod } from 'features/controlLayers/components/IPAdapter/IPAMethod';
+import { IPAdapterMethod } from 'features/controlLayers/components/IPAdapter/IPAdapterMethod';
import { useEntityIdentifierContext } from 'features/controlLayers/contexts/EntityIdentifierContext';
import {
ipaBeginEndStepPctChanged,
@@ -19,10 +19,10 @@ import type { IPAImageDropData } from 'features/dnd/types';
import { memo, useCallback, useMemo } from 'react';
import type { ImageDTO, IPAdapterModelConfig, IPALayerImagePostUploadAction } from 'services/api/types';
-import { IPAImagePreview } from './IPAImagePreview';
-import { IPAModelCombobox } from './IPAModelCombobox';
+import { IPAdapterImagePreview } from './IPAdapterImagePreview';
+import { IPAdapterModel } from './IPAdapterModel';
-export const IPASettings = memo(() => {
+export const IPAdapterSettings = memo(() => {
const dispatch = useAppDispatch();
const { id } = useEntityIdentifierContext();
const ipAdapter = useAppSelector((s) => selectIPAOrThrow(s.canvasV2, id));
@@ -77,7 +77,7 @@ export const IPASettings = memo(() => {
<Flex flexDir="column" gap={4} position="relative" w="full">
<Flex gap={3} alignItems="center" w="full">
<Box minW={0} w="full" transitionProperty="common" transitionDuration="0.1s">
- <IPAModelCombobox
+ <IPAdapterModel
modelKey={ipAdapter.model?.key ?? null}
onChangeModel={onChangeModel}
clipVisionModel={ipAdapter.clipVisionModel}
@@ -87,12 +87,12 @@ export const IPASettings = memo(() => {
</Flex>
<Flex gap={4} w="full" alignItems="center">
<Flex flexDir="column" gap={3} w="full">
- <IPAMethod method={ipAdapter.method} onChange={onChangeIPMethod} />
+ <IPAdapterMethod method={ipAdapter.method} onChange={onChangeIPMethod} />
<Weight weight={ipAdapter.weight} onChange={onChangeWeight} />
<BeginEndStepPct beginEndStepPct={ipAdapter.beginEndStepPct} onChange={onChangeBeginEndStepPct} />
</Flex>
<Flex alignItems="center" justifyContent="center" h={36} w={36} aspectRatio="1/1">
- <IPAImagePreview
+ <IPAdapterImagePreview
image={ipAdapter.imageObject?.image ?? null}
onChangeImage={onChangeImage}
ipAdapterId={ipAdapter.id}
@@ -106,4 +106,4 @@ export const IPASettings = memo(() => {
);
});
-IPASettings.displayName = 'IPASettings';
+IPAdapterSettings.displayName = 'IPAdapterSettings';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx
index 0a79a4368a..325fb48266 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/RegionalGuidance/RGIPAdapterSettings.tsx
@@ -2,9 +2,9 @@ import { Box, Flex, IconButton, Spacer, Text } from '@invoke-ai/ui-library';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { BeginEndStepPct } from 'features/controlLayers/components/common/BeginEndStepPct';
import { Weight } from 'features/controlLayers/components/common/Weight';
-import { IPAImagePreview } from 'features/controlLayers/components/IPAdapter/IPAImagePreview';
-import { IPAMethod } from 'features/controlLayers/components/IPAdapter/IPAMethod';
-import { IPAModelCombobox } from 'features/controlLayers/components/IPAdapter/IPAModelCombobox';
+import { IPAdapterImagePreview } from 'features/controlLayers/components/IPAdapter/IPAdapterImagePreview';
+import { IPAdapterMethod } from 'features/controlLayers/components/IPAdapter/IPAdapterMethod';
+import { IPAdapterModel } from 'features/controlLayers/components/IPAdapter/IPAdapterModel';
import {
rgIPAdapterBeginEndStepPctChanged,
rgIPAdapterCLIPVisionModelChanged,
@@ -107,7 +107,7 @@ export const RGIPAdapterSettings = memo(({ id, ipAdapterId, ipAdapterNumber }: P
<Flex flexDir="column" gap={4} position="relative" w="full">
<Flex gap={3} alignItems="center" w="full">
<Box minW={0} w="full" transitionProperty="common" transitionDuration="0.1s">
- <IPAModelCombobox
+ <IPAdapterModel
modelKey={ipAdapter.model?.key ?? null}
onChangeModel={onChangeModel}
clipVisionModel={ipAdapter.clipVisionModel}
@@ -117,12 +117,12 @@ export const RGIPAdapterSettings = memo(({ id, ipAdapterId, ipAdapterNumber }: P
</Flex>
<Flex gap={4} w="full" alignItems="center">
<Flex flexDir="column" gap={3} w="full">
- <IPAMethod method={ipAdapter.method} onChange={onChangeIPMethod} />
+ <IPAdapterMethod method={ipAdapter.method} onChange={onChangeIPMethod} />
<Weight weight={ipAdapter.weight} onChange={onChangeWeight} />
<BeginEndStepPct beginEndStepPct={ipAdapter.beginEndStepPct} onChange={onChangeBeginEndStepPct} />
</Flex>
<Flex alignItems="center" justifyContent="center" h={36} w={36} aspectRatio="1/1">
- <IPAImagePreview
+ <IPAdapterImagePreview
image={ipAdapter.imageObject?.image ?? null}
onChangeImage={onChangeImage}
ipAdapterId={ipAdapter.id}