chore(ui): clean up unused files/packages

invokeai/frontend/web/src/features/ui/components/common/Scrollable.tsx

@@ -1,88 +0,0 @@
-import { Box, ChakraProps } from '@chakra-ui/react';
-import { throttle } from 'lodash-es';
-import { ReactNode, useEffect, useRef } from 'react';
-
-const scrollShadowBaseStyles: ChakraProps['sx'] = {
-  position: 'absolute',
-  width: 'full',
-  height: 24,
-  left: 0,
-  pointerEvents: 'none',
-  transition: 'opacity 0.2s ease-in-out',
-};
-
-type ScrollableProps = {
-  children: ReactNode;
-};
-
-const Scrollable = ({ children }: ScrollableProps) => {
-  const scrollableRef = useRef<HTMLDivElement>(null);
-  const topShadowRef = useRef<HTMLDivElement>(null);
-  const bottomShadowRef = useRef<HTMLDivElement>(null);
-
-  const updateScrollShadowOpacity = throttle(
-    () => {
-      if (
-        !scrollableRef.current ||
-        !topShadowRef.current ||
-        !bottomShadowRef.current
-      ) {
-        return;
-      }
-      const { scrollTop, scrollHeight, offsetHeight } = scrollableRef.current;
-
-      if (scrollTop > 0) {
-        topShadowRef.current.style.opacity = '1';
-      } else {
-        topShadowRef.current.style.opacity = '0';
-      }
-
-      if (scrollTop >= scrollHeight - offsetHeight) {
-        bottomShadowRef.current.style.opacity = '0';
-      } else {
-        bottomShadowRef.current.style.opacity = '1';
-      }
-    },
-    33,
-    { leading: true }
-  );
-
-  useEffect(() => {
-    updateScrollShadowOpacity();
-  }, [updateScrollShadowOpacity]);
-
-  return (
-    <Box position="relative" w="full" h="full">
-      <Box
-        ref={scrollableRef}
-        position="absolute"
-        w="full"
-        h="full"
-        overflowY="scroll"
-        onScroll={updateScrollShadowOpacity}
-      >
-        {children}
-      </Box>
-      <Box
-        ref={bottomShadowRef}
-        sx={{
-          ...scrollShadowBaseStyles,
-          bottom: 0,
-          boxShadow:
-            'inset 0 -3.5rem 2rem -2rem var(--invokeai-colors-base-900)',
-        }}
-      ></Box>
-      <Box
-        ref={topShadowRef}
-        sx={{
-          ...scrollShadowBaseStyles,
-          top: 0,
-          boxShadow:
-            'inset 0 3.5rem 2rem -2rem var(--invokeai-colors-base-900)',
-        }}
-      ></Box>
-    </Box>
-  );
-};
-
-export default Scrollable;

invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasBeta/UnifiedCanvasToolbar/UnifiedCanvasMergeVisible.tsx

@@ -3,7 +3,6 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import IAIIconButton from 'common/components/IAIIconButton';
 import { canvasMerged } from 'features/canvas/store/actions';
 import { isStagingSelector } from 'features/canvas/store/canvasSelectors';
-import { mergeAndUploadCanvas } from 'features/canvas/store/thunks/mergeAndUploadCanvas';
 import { getCanvasBaseLayer } from 'features/canvas/util/konvaInstanceProvider';
 import { useHotkeys } from 'react-hotkeys-hook';
 import { useTranslation } from 'react-i18next';

invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasWorkarea.tsx

@@ -1,19 +0,0 @@
-import { useAppSelector } from 'app/store/storeHooks';
-import { memo } from 'react';
-import { RootState } from 'app/store/store';
-import UnifiedCanvasContentBeta from './UnifiedCanvasBeta/UnifiedCanvasContentBeta';
-import UnifiedCanvasContent from './UnifiedCanvasContent';
-
-const CanvasWorkspace = () => {
-  const shouldUseCanvasBetaLayout = useAppSelector(
-    (state: RootState) => state.ui.shouldUseCanvasBetaLayout
-  );
-
-  return shouldUseCanvasBetaLayout ? (
-    <UnifiedCanvasContentBeta />
-  ) : (
-    <UnifiedCanvasContent />
-  );
-};
-
-export default memo(CanvasWorkspace);

invokeai/frontend/web/src/features/ui/hooks/useDirection.ts

@@ -1,14 +0,0 @@
-import { useTheme } from '@chakra-ui/react';
-import { useMemo } from 'react';
-import { LangDirection } from '../components/common/ResizableDrawer/types';
-
-export const useLangDirection = () => {
-  const theme = useTheme();
-
-  const langDirection = useMemo(
-    () => theme.direction as LangDirection,
-    [theme.direction]
-  );
-
-  return langDirection;
-};