tidy(ui): type "Dimensions" -> "Size"

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<Partial<Dimensions>>) => {
+  scaledBboxChanged: (state, action: PayloadAction<Partial<Size>>) => {
     state.layers.imageCache = null;
     state.bbox.scaledSize = { ...state.bbox.scaledSize, ...action.payload };
   },

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<CanvasEntity, 'id' | 'type'>;
 
-export type Dimensions = {
+export type Size = {
   width: number;
   height: number;
 };

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 };

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) => {

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<HTMLDivElement>(null);
   const mouseOver = useBoolean(false);
-  const fittedDims = useMemo<Dimensions>(
+  const fittedDims = useMemo<Size>(
     () => fitDimsToContainer(containerDims, firstImage),
     [containerDims, firstImage]
   );
-  const compareImageDims = useMemo<Dimensions>(
+  const compareImageDims = useMemo<Size>(
     () => getSecondImageDims(comparisonFit, fittedDims, firstImage, secondImage),
     [comparisonFit, fittedDims, firstImage, secondImage]
   );

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<number | null>(null);
   const lastMoveTimeRef = useRef<number>(0);
 
-  const fittedDims = useMemo<Dimensions>(
+  const fittedDims = useMemo<Size>(
     () => fitDimsToContainer(containerDims, firstImage),
     [containerDims, firstImage]
   );
 
-  const compareImageDims = useMemo<Dimensions>(
+  const compareImageDims = useMemo<Size>(
     () => getSecondImageDims(comparisonFit, fittedDims, firstImage, secondImage),
     [comparisonFit, fittedDims, firstImage, secondImage]
   );

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,
+  fittedDims: Size,
-  firstImageDims: Dimensions,
+  firstImageDims: Size,
-  secondImageDims: Dimensions
+  secondImageDims: Size
-): Dimensions => {
+): Size => {
   const width =
     comparisonFit === 'fill' ? fittedDims.width : (fittedDims.width * secondImageDims.width) / firstImageDims.width;
   const height =

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,
+  originalSize: Size,
-  scaledSize: Dimensions,
+  scaledSize: Size,
   bbox: CanvasV2State['bbox'],
   denoising_start: number
 ): Promise<Invocation<'img_resize' | 'l2i'>> => {

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,
+  originalSize: Size,
-  scaledSize: Dimensions,
+  scaledSize: Size,
   bbox: CanvasV2State['bbox'],
   compositing: CanvasV2State['compositing'],
   denoising_start: number,

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,
+  originalSize: Size,
-  scaledSize: Dimensions,
+  scaledSize: Size,
   bbox: CanvasV2State['bbox'],
   compositing: CanvasV2State['compositing'],
   denoising_start: number,

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,
+  originalSize: Size,
-  scaledSize: Dimensions
+  scaledSize: Size
 ): Invocation<'img_resize' | 'l2i'> => {
   if (!isEqual(scaledSize, originalSize)) {
     // We need to resize the output image back to the original size