From bea0cba038db27ea8d7af8061dd0fecef84c4a7e Mon Sep 17 00:00:00 2001 From: psychedelicious <4822129+psychedelicious@users.noreply.github.com> Date: Tue, 25 Jun 2024 19:23:18 +1000 Subject: [PATCH] tidy(ui): type "Dimensions" -> "Size" --- .../features/controlLayers/store/bboxReducers.ts | 4 ++-- .../web/src/features/controlLayers/store/types.ts | 2 +- .../util/getScaledBoundingBoxDimensions.ts | 4 ++-- .../components/ImageViewer/ImageComparison.tsx | 4 ++-- .../ImageViewer/ImageComparisonHover.tsx | 6 +++--- .../ImageViewer/ImageComparisonSlider.tsx | 6 +++--- .../gallery/components/ImageViewer/common.ts | 14 +++++++------- .../nodes/util/graph/generation/addImageToImage.ts | 6 +++--- .../nodes/util/graph/generation/addInpaint.ts | 6 +++--- .../nodes/util/graph/generation/addOutpaint.ts | 6 +++--- .../nodes/util/graph/generation/addTextToImage.ts | 6 +++--- 11 files changed, 32 insertions(+), 32 deletions(-) diff --git a/invokeai/frontend/web/src/features/controlLayers/store/bboxReducers.ts b/invokeai/frontend/web/src/features/controlLayers/store/bboxReducers.ts index f2e814290e..ded7d30a49 100644 --- a/invokeai/frontend/web/src/features/controlLayers/store/bboxReducers.ts +++ b/invokeai/frontend/web/src/features/controlLayers/store/bboxReducers.ts @@ -1,12 +1,12 @@ import type { PayloadAction, SliceCaseReducers } from '@reduxjs/toolkit'; -import type { BoundingBoxScaleMethod, CanvasV2State, Dimensions } from 'features/controlLayers/store/types'; +import type { BoundingBoxScaleMethod, CanvasV2State, Size } from 'features/controlLayers/store/types'; import { getScaledBoundingBoxDimensions } from 'features/controlLayers/util/getScaledBoundingBoxDimensions'; import { getOptimalDimension } from 'features/parameters/util/optimalDimension'; import type { IRect } from 'konva/lib/types'; import { pick } from 'lodash-es'; export const bboxReducers = { - scaledBboxChanged: (state, action: PayloadAction>) => { + scaledBboxChanged: (state, action: PayloadAction>) => { state.layers.imageCache = null; state.bbox.scaledSize = { ...state.bbox.scaledSize, ...action.payload }; }, diff --git a/invokeai/frontend/web/src/features/controlLayers/store/types.ts b/invokeai/frontend/web/src/features/controlLayers/store/types.ts index 1d2b57922c..0f8b048a6c 100644 --- a/invokeai/frontend/web/src/features/controlLayers/store/types.ts +++ b/invokeai/frontend/web/src/features/controlLayers/store/types.ts @@ -780,7 +780,7 @@ export const isBoundingBoxScaleMethod = (v: unknown): v is BoundingBoxScaleMetho export type CanvasEntity = LayerEntity | ControlAdapterEntity | RegionEntity | InpaintMaskEntity | IPAdapterEntity; export type CanvasEntityIdentifier = Pick; -export type Dimensions = { +export type Size = { width: number; height: number; }; diff --git a/invokeai/frontend/web/src/features/controlLayers/util/getScaledBoundingBoxDimensions.ts b/invokeai/frontend/web/src/features/controlLayers/util/getScaledBoundingBoxDimensions.ts index d98d03f33e..e35e11e226 100644 --- a/invokeai/frontend/web/src/features/controlLayers/util/getScaledBoundingBoxDimensions.ts +++ b/invokeai/frontend/web/src/features/controlLayers/util/getScaledBoundingBoxDimensions.ts @@ -1,6 +1,6 @@ import { roundToMultiple } from 'common/util/roundDownToMultiple'; import { CANVAS_GRID_SIZE_FINE } from 'features/controlLayers/konva/constants'; -import type { Dimensions } from 'features/controlLayers/store/types'; +import type { Size } from 'features/controlLayers/store/types'; /** * Scales the bounding box dimensions to the optimal dimension. The optimal dimensions should be the trained dimension @@ -8,7 +8,7 @@ import type { Dimensions } from 'features/controlLayers/store/types'; * @param dimensions The un-scaled bbox dimensions * @param optimalDimension The optimal dimension to scale the bbox to */ -export const getScaledBoundingBoxDimensions = (dimensions: Dimensions, optimalDimension: number): Dimensions => { +export const getScaledBoundingBoxDimensions = (dimensions: Size, optimalDimension: number): Size => { const { width, height } = dimensions; const scaledDimensions = { width, height }; diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparison.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparison.tsx index ff97a5a687..3e1583cf6e 100644 --- a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparison.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparison.tsx @@ -1,6 +1,6 @@ import { useAppSelector } from 'app/store/storeHooks'; import { IAINoContentFallback } from 'common/components/IAIImageFallback'; -import type { Dimensions } from 'features/controlLayers/store/types'; +import type { Size } from 'features/controlLayers/store/types'; import { selectComparisonImages } from 'features/gallery/components/ImageViewer/common'; import { ImageComparisonHover } from 'features/gallery/components/ImageViewer/ImageComparisonHover'; import { ImageComparisonSideBySide } from 'features/gallery/components/ImageViewer/ImageComparisonSideBySide'; @@ -10,7 +10,7 @@ import { useTranslation } from 'react-i18next'; import { PiImagesBold } from 'react-icons/pi'; type Props = { - containerDims: Dimensions; + containerDims: Size; }; export const ImageComparison = memo(({ containerDims }: Props) => { diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonHover.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonHover.tsx index 11f9da928b..83afa376cd 100644 --- a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonHover.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonHover.tsx @@ -3,7 +3,7 @@ import { useAppSelector } from 'app/store/storeHooks'; import { useBoolean } from 'common/hooks/useBoolean'; import { preventDefault } from 'common/util/stopPropagation'; import { TRANSPARENCY_CHECKER_PATTERN } from 'features/controlLayers/konva/constants'; -import type { Dimensions } from 'features/controlLayers/store/types'; +import type { Size } from 'features/controlLayers/store/types'; import { ImageComparisonLabel } from 'features/gallery/components/ImageViewer/ImageComparisonLabel'; import { memo, useMemo, useRef } from 'react'; @@ -14,11 +14,11 @@ export const ImageComparisonHover = memo(({ firstImage, secondImage, containerDi const comparisonFit = useAppSelector((s) => s.gallery.comparisonFit); const imageContainerRef = useRef(null); const mouseOver = useBoolean(false); - const fittedDims = useMemo( + const fittedDims = useMemo( () => fitDimsToContainer(containerDims, firstImage), [containerDims, firstImage] ); - const compareImageDims = useMemo( + const compareImageDims = useMemo( () => getSecondImageDims(comparisonFit, fittedDims, firstImage, secondImage), [comparisonFit, fittedDims, firstImage, secondImage] ); diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonSlider.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonSlider.tsx index 00b25b1b32..2a9da09516 100644 --- a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonSlider.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonSlider.tsx @@ -2,7 +2,7 @@ import { Box, Flex, Icon, Image } from '@invoke-ai/ui-library'; import { useAppSelector } from 'app/store/storeHooks'; import { preventDefault } from 'common/util/stopPropagation'; import { TRANSPARENCY_CHECKER_PATTERN } from 'features/controlLayers/konva/constants'; -import type { Dimensions } from 'features/controlLayers/store/types'; +import type { Size } from 'features/controlLayers/store/types'; import { ImageComparisonLabel } from 'features/gallery/components/ImageViewer/ImageComparisonLabel'; import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { PiCaretLeftBold, PiCaretRightBold } from 'react-icons/pi'; @@ -31,12 +31,12 @@ export const ImageComparisonSlider = memo(({ firstImage, secondImage, containerD const rafRef = useRef(null); const lastMoveTimeRef = useRef(0); - const fittedDims = useMemo( + const fittedDims = useMemo( () => fitDimsToContainer(containerDims, firstImage), [containerDims, firstImage] ); - const compareImageDims = useMemo( + const compareImageDims = useMemo( () => getSecondImageDims(comparisonFit, fittedDims, firstImage, secondImage), [comparisonFit, fittedDims, firstImage, secondImage] ); diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/common.ts b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/common.ts index ac3d7b172b..7c58ad2aff 100644 --- a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/common.ts +++ b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/common.ts @@ -1,5 +1,5 @@ import { createMemoizedSelector } from 'app/store/createMemoizedSelector'; -import type { Dimensions } from 'features/controlLayers/store/types'; +import type { Size } from 'features/controlLayers/store/types'; import { selectGallerySlice } from 'features/gallery/store/gallerySlice'; import type { ComparisonFit } from 'features/gallery/store/types'; import type { ImageDTO } from 'services/api/types'; @@ -9,10 +9,10 @@ export const DROP_SHADOW = 'drop-shadow(0px 0px 4px rgb(0, 0, 0)) drop-shadow(0p export type ComparisonProps = { firstImage: ImageDTO; secondImage: ImageDTO; - containerDims: Dimensions; + containerDims: Size; }; -export const fitDimsToContainer = (containerDims: Dimensions, imageDims: Dimensions): Dimensions => { +export const fitDimsToContainer = (containerDims: Size, imageDims: Size): Size => { // Fall back to the image's dimensions if the container has no dimensions if (containerDims.width === 0 || containerDims.height === 0) { return { width: imageDims.width, height: imageDims.height }; @@ -46,10 +46,10 @@ export const fitDimsToContainer = (containerDims: Dimensions, imageDims: Dimensi */ export const getSecondImageDims = ( comparisonFit: ComparisonFit, - fittedDims: Dimensions, - firstImageDims: Dimensions, - secondImageDims: Dimensions -): Dimensions => { + fittedDims: Size, + firstImageDims: Size, + secondImageDims: Size +): Size => { const width = comparisonFit === 'fill' ? fittedDims.width : (fittedDims.width * secondImageDims.width) / firstImageDims.width; const height = diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addImageToImage.ts b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addImageToImage.ts index 3a839bf3a8..32e36a5c82 100644 --- a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addImageToImage.ts +++ b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addImageToImage.ts @@ -1,5 +1,5 @@ import type { KonvaNodeManager } from 'features/controlLayers/konva/nodeManager'; -import type { CanvasV2State, Dimensions } from 'features/controlLayers/store/types'; +import type { CanvasV2State, Size } from 'features/controlLayers/store/types'; import type { Graph } from 'features/nodes/util/graph/generation/Graph'; import { isEqual, pick } from 'lodash-es'; import type { Invocation } from 'services/api/types'; @@ -10,8 +10,8 @@ export const addImageToImage = async ( l2i: Invocation<'l2i'>, denoise: Invocation<'denoise_latents'>, vaeSource: Invocation<'main_model_loader' | 'sdxl_model_loader' | 'seamless' | 'vae_loader'>, - originalSize: Dimensions, - scaledSize: Dimensions, + originalSize: Size, + scaledSize: Size, bbox: CanvasV2State['bbox'], denoising_start: number ): Promise> => { diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addInpaint.ts b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addInpaint.ts index 8c7c7b7d7c..41e18071b5 100644 --- a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addInpaint.ts +++ b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addInpaint.ts @@ -1,5 +1,5 @@ import type { KonvaNodeManager } from 'features/controlLayers/konva/nodeManager'; -import type { CanvasV2State, Dimensions } from 'features/controlLayers/store/types'; +import type { CanvasV2State, Size } from 'features/controlLayers/store/types'; import type { Graph } from 'features/nodes/util/graph/generation/Graph'; import type { ParameterPrecision } from 'features/parameters/types/parameterSchemas'; import { isEqual, pick } from 'lodash-es'; @@ -12,8 +12,8 @@ export const addInpaint = async ( denoise: Invocation<'denoise_latents'>, vaeSource: Invocation<'main_model_loader' | 'sdxl_model_loader' | 'seamless' | 'vae_loader'>, modelLoader: Invocation<'main_model_loader' | 'sdxl_model_loader'>, - originalSize: Dimensions, - scaledSize: Dimensions, + originalSize: Size, + scaledSize: Size, bbox: CanvasV2State['bbox'], compositing: CanvasV2State['compositing'], denoising_start: number, diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addOutpaint.ts b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addOutpaint.ts index 86a37f85df..29102cc2e3 100644 --- a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addOutpaint.ts +++ b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addOutpaint.ts @@ -1,5 +1,5 @@ import type { KonvaNodeManager } from 'features/controlLayers/konva/nodeManager'; -import type { CanvasV2State, Dimensions } from 'features/controlLayers/store/types'; +import type { CanvasV2State, Size } from 'features/controlLayers/store/types'; import type { Graph } from 'features/nodes/util/graph/generation/Graph'; import { getInfill } from 'features/nodes/util/graph/graphBuilderUtils'; import type { ParameterPrecision } from 'features/parameters/types/parameterSchemas'; @@ -13,8 +13,8 @@ export const addOutpaint = async ( denoise: Invocation<'denoise_latents'>, vaeSource: Invocation<'main_model_loader' | 'sdxl_model_loader' | 'seamless' | 'vae_loader'>, modelLoader: Invocation<'main_model_loader' | 'sdxl_model_loader'>, - originalSize: Dimensions, - scaledSize: Dimensions, + originalSize: Size, + scaledSize: Size, bbox: CanvasV2State['bbox'], compositing: CanvasV2State['compositing'], denoising_start: number, diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addTextToImage.ts b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addTextToImage.ts index bc11f76be2..6a80c325fa 100644 --- a/invokeai/frontend/web/src/features/nodes/util/graph/generation/addTextToImage.ts +++ b/invokeai/frontend/web/src/features/nodes/util/graph/generation/addTextToImage.ts @@ -1,4 +1,4 @@ -import type { Dimensions } from 'features/controlLayers/store/types'; +import type { Size } from 'features/controlLayers/store/types'; import type { Graph } from 'features/nodes/util/graph/generation/Graph'; import { isEqual } from 'lodash-es'; import type { Invocation } from 'services/api/types'; @@ -6,8 +6,8 @@ import type { Invocation } from 'services/api/types'; export const addTextToImage = ( g: Graph, l2i: Invocation<'l2i'>, - originalSize: Dimensions, - scaledSize: Dimensions + originalSize: Size, + scaledSize: Size ): Invocation<'img_resize' | 'l2i'> => { if (!isEqual(scaledSize, originalSize)) { // We need to resize the output image back to the original size