chore(ui): format

invokeai/frontend/web/src/app/components/AppErrorBoundaryFallback.tsx

@@ -4,7 +4,11 @@ import { InvText } from 'common/components/InvText/wrapper';
 import newGithubIssueUrl from 'new-github-issue-url';
 import { memo, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiArrowCounterClockwiseBold,PiArrowSquareOutBold, PiCopyBold } from 'react-icons/pi'
+import {
+  PiArrowCounterClockwiseBold,
+  PiArrowSquareOutBold,
+  PiCopyBold,
+} from 'react-icons/pi';
 import { serializeError } from 'serialize-error';
 
 type Props = {

invokeai/frontend/web/src/common/components/IAIDndImage.tsx

@@ -22,7 +22,7 @@ import type {
   SyntheticEvent,
 } from 'react';
 import { memo, useCallback, useMemo, useState } from 'react';
-import { PiImageBold, PiUploadSimpleBold } from 'react-icons/pi'
+import { PiImageBold, PiUploadSimpleBold } from 'react-icons/pi';
 import type { ImageDTO, PostUploadAction } from 'services/api/types';
 
 import IAIDraggable from './IAIDraggable';

invokeai/frontend/web/src/common/components/IAIImageFallback.tsx

@@ -1,7 +1,7 @@
 import type { As, FlexProps, StyleProps } from '@chakra-ui/react';
 import { Flex, Icon, Skeleton, Spinner } from '@chakra-ui/react';
 import { memo, useMemo } from 'react';
-import { PiImageBold } from 'react-icons/pi'
+import { PiImageBold } from 'react-icons/pi';
 import type { ImageDTO } from 'services/api/types';
 
 import { InvText } from './InvText/wrapper';

invokeai/frontend/web/src/features/controlAdapters/components/ControlAdapterImagePreview.tsx

@@ -25,7 +25,11 @@ import {
 import { activeTabNameSelector } from 'features/ui/store/uiSelectors';
 import { memo, useCallback, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiArrowCounterClockwiseBold,PiFloppyDiskBold, PiRulerBold } from 'react-icons/pi'
+import {
+  PiArrowCounterClockwiseBold,
+  PiFloppyDiskBold,
+  PiRulerBold,
+} from 'react-icons/pi';
 import {
   useAddImageToBoardMutation,
   useChangeImageIsIntermediateMutation,
@@ -210,7 +214,9 @@ const ControlAdapterImagePreview = ({ isSmall, id }: Props) => {
       <>
         <IAIDndImageIcon
           onClick={handleResetControlImage}
-          icon={controlImage ? <PiArrowCounterClockwiseBold size={16} /> : undefined}
+          icon={
+            controlImage ? <PiArrowCounterClockwiseBold size={16} /> : undefined
+          }
           tooltip={t('controlnet.resetControlImage')}
         />
         <IAIDndImageIcon

invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsPreview.tsx

@@ -9,7 +9,7 @@ import ScrollableContent from 'common/components/OverlayScrollbars/ScrollableCon
 import { selectDynamicPromptsSlice } from 'features/dynamicPrompts/store/dynamicPromptsSlice';
 import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiWarningCircleBold } from 'react-icons/pi'
+import { PiWarningCircleBold } from 'react-icons/pi';
 
 const selectPrompts = createMemoizedSelector(
   selectDynamicPromptsSlice,

invokeai/frontend/web/src/features/embedding/AddEmbeddingButton.tsx

@@ -2,7 +2,7 @@ import { InvIconButton } from 'common/components/InvIconButton/InvIconButton';
 import { InvTooltip } from 'common/components/InvTooltip/InvTooltip';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiCodeBold } from 'react-icons/pi'
+import { PiCodeBold } from 'react-icons/pi';
 
 type Props = {
   isOpen: boolean;

invokeai/frontend/web/src/features/gallery/components/Boards/BoardContextMenu.tsx

@@ -14,7 +14,7 @@ import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
 import { addToast } from 'features/system/store/systemSlice';
 import { memo, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiDownloadBold, PiPlusBold } from 'react-icons/pi'
+import { PiDownloadBold, PiPlusBold } from 'react-icons/pi';
 import { useBulkDownloadImagesMutation } from 'services/api/endpoints/images';
 import { useBoardName } from 'services/api/hooks/useBoardName';
 import type { BoardDTO } from 'services/api/types';

invokeai/frontend/web/src/features/gallery/components/Boards/GalleryBoardContextMenuItems.tsx

@@ -1,7 +1,7 @@
 import { InvMenuItem } from 'common/components/InvMenu/InvMenuItem';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiTrashSimpleBold } from 'react-icons/pi'
+import { PiTrashSimpleBold } from 'react-icons/pi';
 import type { BoardDTO } from 'services/api/types';
 
 type Props = {
@@ -20,7 +20,11 @@ const GalleryBoardContextMenuItems = ({ board, setBoardToDelete }: Props) => {
 
   return (
     <>
-      <InvMenuItem color="error.300" icon={<PiTrashSimpleBold />} onClick={handleDelete}>
+      <InvMenuItem
+        color="error.300"
+        icon={<PiTrashSimpleBold />}
+        onClick={handleDelete}
+      >
         {t('boards.deleteBoard')}
       </InvMenuItem>
     </>

invokeai/frontend/web/src/features/gallery/components/ImageGrid/GalleryImageGrid.tsx

@@ -11,7 +11,7 @@ import { useOverlayScrollbars } from 'overlayscrollbars-react';
 import type { CSSProperties } from 'react';
 import { memo, useCallback, useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiImageBold, PiWarningCircleBold } from 'react-icons/pi'
+import { PiImageBold, PiWarningCircleBold } from 'react-icons/pi';
 import type {
   GridComponents,
   ItemContent,

invokeai/frontend/web/src/features/gallery/components/NextPrevImageButtons.tsx

@@ -5,7 +5,11 @@ import { useGalleryImages } from 'features/gallery/hooks/useGalleryImages';
 import { useGalleryNavigation } from 'features/gallery/hooks/useGalleryNavigation';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiCaretDoubleRightBold,PiCaretLeftBold, PiCaretRightBold } from 'react-icons/pi'
+import {
+  PiCaretDoubleRightBold,
+  PiCaretLeftBold,
+  PiCaretRightBold,
+} from 'react-icons/pi';
 
 const nextPrevButtonStyles: ChakraProps['sx'] = {
   color: 'base.100',

invokeai/frontend/web/src/features/modelManager/subpanels/AddModelsPanel/SearchFolderForm.tsx

@@ -11,7 +11,11 @@ import {
 import type { CSSProperties } from 'react';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiArrowsCounterClockwiseBold, PiMagnifyingGlassBold, PiTrashSimpleBold } from 'react-icons/pi';
+import {
+  PiArrowsCounterClockwiseBold,
+  PiMagnifyingGlassBold,
+  PiTrashSimpleBold,
+} from 'react-icons/pi';
 import { useGetModelsInFolderQuery } from 'services/api/endpoints/models';
 
 type SearchFolderForm = {

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeClassificationIcon.tsx

@@ -4,7 +4,7 @@ import { useNodeClassification } from 'features/nodes/hooks/useNodeClassificatio
 import type { Classification } from 'features/nodes/types/common';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiFlaskBold, PiHammerBold } from 'react-icons/pi'
+import { PiFlaskBold, PiHammerBold } from 'react-icons/pi';
 
 interface Props {
   nodeId: string;

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeInfoIcon.tsx

@@ -8,7 +8,7 @@ import { useNodeTemplate } from 'features/nodes/hooks/useNodeTemplate';
 import { isInvocationNodeData } from 'features/nodes/types/invocation';
 import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiInfoBold } from 'react-icons/pi'
+import { PiInfoBold } from 'react-icons/pi';
 
 interface Props {
   nodeId: string;

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeStatusIndicator.tsx

@@ -10,7 +10,11 @@ import type { NodeExecutionState } from 'features/nodes/types/invocation';
 import { zNodeStatus } from 'features/nodes/types/invocation';
 import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiCheckBold, PiDotsThreeOutlineFill, PiWarningBold } from 'react-icons/pi'
+import {
+  PiCheckBold,
+  PiDotsThreeOutlineFill,
+  PiWarningBold,
+} from 'react-icons/pi';
 
 type Props = {
   nodeId: string;
@@ -122,7 +126,13 @@ type StatusIconProps = {
 const StatusIcon = memo((props: StatusIconProps) => {
   const { progress, status } = props.nodeExecutionState;
   if (status === zNodeStatus.enum.PENDING) {
-    return <Icon as={PiDotsThreeOutlineFill} boxSize={iconBoxSize} color="base.300" />;
+    return (
+      <Icon
+        as={PiDotsThreeOutlineFill}
+        boxSize={iconBoxSize}
+        color="base.300"
+      />
+    );
   }
   if (status === zNodeStatus.enum.IN_PROGRESS) {
     return progress === null ? (

invokeai/frontend/web/src/features/sdxl/components/SDXLPrompts/SDXLConcatButton.tsx

@@ -4,7 +4,7 @@ import { InvTooltip } from 'common/components/InvTooltip/InvTooltip';
 import { setShouldConcatSDXLStylePrompt } from 'features/sdxl/store/sdxlSlice';
 import { memo, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiLinkSimpleBold,PiLinkSimpleBreakBold } from 'react-icons/pi';
+import { PiLinkSimpleBold, PiLinkSimpleBreakBold } from 'react-icons/pi';
 
 export const SDXLConcatButton = memo(() => {
   const shouldConcatSDXLStylePrompt = useAppSelector(
@@ -31,7 +31,13 @@ export const SDXLConcatButton = memo(() => {
       <InvIconButton
         aria-label={label}
         onClick={handleShouldConcatPromptChange}
-        icon={shouldConcatSDXLStylePrompt ? <PiLinkSimpleBold size={14} /> : <PiLinkSimpleBreakBold size={14} />}
+        icon={
+          shouldConcatSDXLStylePrompt ? (
+            <PiLinkSimpleBold size={14} />
+          ) : (
+            <PiLinkSimpleBreakBold size={14} />
+          )
+        }
         variant="promptOverlay"
         fontSize={12}
         px={0.5}