chore(ui): lint

Author: psychedelicious

invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/SimpleSession.tsx

@@ -1,21 +1,11 @@
 import { Flex, Tab, TabList, TabPanel, TabPanels, Tabs } from '@invoke-ai/ui-library';
-import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { GenerateLaunchpadPanel } from 'features/controlLayers/components/SimpleSession/GenerateLaunchpadPanel';
 import { ImageViewer } from 'features/gallery/components/ImageViewer/ImageViewer2';
 import { ProgressImage } from 'features/gallery/components/ImageViewer/ProgressImage2';
 import { ViewerToolbar } from 'features/gallery/components/ImageViewer/ViewerToolbar2';
-import { selectShowGenerateTabSplashScreen } from 'features/ui/store/uiSelectors';
-import { showGenerateTabSplashScreenChanged } from 'features/ui/store/uiSlice';
-import { memo, useCallback } from 'react';
+import { memo } from 'react';
 
 export const SimpleSession = memo(() => {
-  const showGenerateTabSplashScreen = useAppSelector(selectShowGenerateTabSplashScreen);
-  const dispatch = useAppDispatch();
-
-  const showSplashScreen = useCallback(() => {
-    dispatch(showGenerateTabSplashScreenChanged(true));
-  }, [dispatch]);
-
   return (
     <Tabs w="full" h="full" px={2}>
       <TabList>

invokeai/frontend/web/src/features/controlLayers/components/StartOverButton.tsx

@@ -2,7 +2,7 @@ import { IconButton } from '@invoke-ai/ui-library';
 import { useIsRegionFocused } from 'common/hooks/focus';
 import { useCanvasManager } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
 import { useRegisteredHotkeys } from 'features/system/components/HotkeysModal/useHotkeyData';
-import { memo } from 'react';
+import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { PiArrowsOutBold } from 'react-icons/pi';
 
@@ -11,6 +11,10 @@ export const CanvasToolbarResetViewButton = memo(() => {
   const canvasManager = useCanvasManager();
   const isCanvasFocused = useIsRegionFocused('canvas');
 
+  const fitLayersToStage = useCallback(() => {
+    canvasManager.stage.fitLayersToStage();
+  }, [canvasManager.stage]);
+
   useRegisteredHotkeys({
     id: 'fitLayersToCanvas',
     category: 'canvas',
@@ -58,7 +62,7 @@ export const CanvasToolbarResetViewButton = memo(() => {
     <IconButton
       tooltip={t('hotkeys.canvas.fitLayersToCanvas.title')}
       aria-label={t('hotkeys.canvas.fitLayersToCanvas.title')}
-      onClick={canvasManager.stage.fitLayersToStage}
+      onClick={fitLayersToStage}
       icon={<PiArrowsOutBold />}
       variant="link"
       alignSelf="stretch"

invokeai/frontend/web/src/features/controlLayers/components/Toolbar/CanvasToolbarResetViewButton.tsx

@@ -1,16 +1,14 @@
 import { Box, Flex } from '@invoke-ai/ui-library';
-import { useStore } from '@nanostores/react';
 import { useAppSelector } from 'app/store/storeHooks';
 import { CanvasAlertsInvocationProgress } from 'features/controlLayers/components/CanvasAlerts/CanvasAlertsInvocationProgress';
 import { DndImage } from 'features/dnd/DndImage';
 import ImageMetadataViewer from 'features/gallery/components/ImageMetadataViewer/ImageMetadataViewer';
 import NextPrevImageButtons from 'features/gallery/components/NextPrevImageButtons';
-import { selectShouldShowImageDetails, selectShouldShowProgressInViewer } from 'features/ui/store/uiSelectors';
+import { selectShouldShowImageDetails } from 'features/ui/store/uiSelectors';
 import type { AnimationProps } from 'framer-motion';
 import { AnimatePresence, motion } from 'framer-motion';
 import { memo, useCallback, useRef, useState } from 'react';
 import type { ImageDTO } from 'services/api/types';
-import { $hasLastProgressImage } from 'services/events/stores';
 
 import { NoContentForViewer } from './NoContentForViewer';
 
@@ -82,9 +80,6 @@ export const CurrentImagePreview = memo(({ imageDTO }: { imageDTO?: ImageDTO })
 CurrentImagePreview.displayName = 'CurrentImagePreview';
 
 const ImageContent = memo(({ imageDTO }: { imageDTO?: ImageDTO }) => {
-  const hasProgressImage = useStore($hasLastProgressImage);
-  const shouldShowProgressInViewer = useAppSelector(selectShouldShowProgressInViewer);
-
   if (!imageDTO) {
     return <NoContentForViewer />;
   }

invokeai/frontend/web/src/features/gallery/components/ImageViewer/CurrentImagePreview2.tsx

@@ -1,4 +1,3 @@
-import type { FormLabelProps } from '@invoke-ai/ui-library';
 import { Flex, StandaloneAccordion } from '@invoke-ai/ui-library';
 import { skipToken } from '@reduxjs/toolkit/query';
 import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
@@ -13,14 +12,6 @@ import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useGetModelConfigQuery } from 'services/api/endpoints/models';
 
-const formLabelProps: FormLabelProps = {
-  minW: '9.2rem',
-};
-
-const formLabelProps2: FormLabelProps = {
-  flexGrow: 1,
-};
-
 export const AdvancedSettingsAccordion = memo(() => {
   const vaeKey = useAppSelector(selectVAEKey);
   const { currentData: vaeConfig } = useGetModelConfigQuery(vaeKey ?? skipToken);

invokeai/frontend/web/src/features/settingsAccordions/components/AdvancedSettingsAccordion/UpscaleTabAdvancedSettingsAccordion.tsx

@@ -10,54 +10,16 @@ import { GenerateTabAutoLayout } from 'features/ui/layouts/generate-tab-auto-lay
 import { UpscalingTabAutoLayout } from 'features/ui/layouts/upscaling-tab-auto-layout';
 import { WorkflowsTabAutoLayout } from 'features/ui/layouts/workflows-tab-auto-layout';
 import { selectActiveTabIndex } from 'features/ui/store/uiSelectors';
-import { $isLeftPanelOpen, $isRightPanelOpen } from 'features/ui/store/uiSlice';
-import type { CSSProperties } from 'react';
 import { memo } from 'react';
 
 import { TabMountGate } from './TabMountGate';
 import ModelManagerTab from './tabs/ModelManagerTab';
 import QueueTab from './tabs/QueueTab';
 
-const panelStyles: CSSProperties = { position: 'relative', height: '100%', width: '100%', minWidth: 0 };
-
-const onLeftPanelCollapse = (isCollapsed: boolean) => $isLeftPanelOpen.set(!isCollapsed);
-const onRightPanelCollapse = (isCollapsed: boolean) => $isRightPanelOpen.set(!isCollapsed);
-
 export const AppContent = memo(() => {
   const tabIndex = useAppSelector(selectActiveTabIndex);
   useDndMonitor();
 
-  // useRegisteredHotkeys({
-  //   id: 'resetPanelLayout',
-  //   category: 'app',
-  //   callback: () => {
-  //     leftPanel.reset();
-  //     rightPanel.reset();
-  //   },
-  //   dependencies: [leftPanel.reset, rightPanel.reset],
-  // });
-  // useRegisteredHotkeys({
-  //   id: 'togglePanels',
-  //   category: 'app',
-  //   callback: () => {
-  //     if (leftPanel.isCollapsed || rightPanel.isCollapsed) {
-  //       leftPanel.expand();
-  //       rightPanel.expand();
-  //     } else {
-  //       leftPanel.collapse();
-  //       rightPanel.collapse();
-  //     }
-  //   },
-  //   dependencies: [
-  //     leftPanel.isCollapsed,
-  //     rightPanel.isCollapsed,
-  //     leftPanel.expand,
-  //     rightPanel.expand,
-  //     leftPanel.collapse,
-  //     rightPanel.collapse,
-  //   ],
-  // });
-
   return (
     <Tabs index={tabIndex} display="flex" w="full" h="full" p={0} overflow="hidden">
       <TabList>