diff --git a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx
index 0ae8f04d9d..12611943bc 100644
--- a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx
+++ b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx
@@ -14,17 +14,17 @@ import { $openAPISchemaUrl } from 'app/store/nanostores/openAPISchemaUrl';
 import { $projectId } from 'app/store/nanostores/projectId';
 import { $queueId, DEFAULT_QUEUE_ID } from 'app/store/nanostores/queueId';
 import { $store } from 'app/store/nanostores/store';
+import { $workflowCategories } from 'app/store/nanostores/workflowCategories';
 import { createStore } from 'app/store/store';
 import type { PartialAppConfig } from 'app/types/invokeai';
 import Loading from 'common/components/Loading/Loading';
 import AppDndContext from 'features/dnd/components/AppDndContext';
+import type { WorkflowCategory } from 'features/nodes/types/workflow';
 import type { PropsWithChildren, ReactNode } from 'react';
 import React, { lazy, memo, useEffect, useMemo } from 'react';
 import { Provider } from 'react-redux';
 import { addMiddleware, resetMiddlewares } from 'redux-dynamic-middlewares';
 import type { ManagerOptions, SocketOptions } from 'socket.io-client';
-import { WorkflowCategory } from '../../features/nodes/types/workflow';
-import { $workflowCategories } from '../store/nanostores/workflowCategories';
 
 const App = lazy(() => import('./App'));
 const ThemeLocaleProvider = lazy(() => import('./ThemeLocaleProvider'));
diff --git a/invokeai/frontend/web/src/app/store/nanostores/workflowCategories.ts b/invokeai/frontend/web/src/app/store/nanostores/workflowCategories.ts
index 6ffc4cf77f..a643219c66 100644
--- a/invokeai/frontend/web/src/app/store/nanostores/workflowCategories.ts
+++ b/invokeai/frontend/web/src/app/store/nanostores/workflowCategories.ts
@@ -1,4 +1,7 @@
+import type { WorkflowCategory } from 'features/nodes/types/workflow';
 import { atom } from 'nanostores';
-import { WorkflowCategory } from '../../../features/nodes/types/workflow';
 
-export const $workflowCategories = atom<WorkflowCategory[]>(["user", "default"]);
+export const $workflowCategories = atom<WorkflowCategory[]>([
+  'user',
+  'default',
+]);
diff --git a/invokeai/frontend/web/src/features/workflowLibrary/components/WorkflowLibraryList.tsx b/invokeai/frontend/web/src/features/workflowLibrary/components/WorkflowLibraryList.tsx
index a3f4b154c2..0aeab01680 100644
--- a/invokeai/frontend/web/src/features/workflowLibrary/components/WorkflowLibraryList.tsx
+++ b/invokeai/frontend/web/src/features/workflowLibrary/components/WorkflowLibraryList.tsx
@@ -11,10 +11,10 @@ import {
   Input,
   InputGroup,
   InputRightElement,
-  Spacer,
 } from '@invoke-ai/ui';
 import { useStore } from '@nanostores/react';
 import { $projectId } from 'app/store/nanostores/projectId';
+import { $workflowCategories } from 'app/store/nanostores/workflowCategories';
 import {
   IAINoContentFallback,
   IAINoContentFallbackWithSpinner,
@@ -34,7 +34,6 @@ import type {
 } from 'services/api/types';
 import { useDebounce } from 'use-debounce';
 import { z } from 'zod';
-import { $workflowCategories } from '../../../app/store/nanostores/workflowCategories';
 
 const PER_PAGE = 10;
 
@@ -170,11 +169,12 @@ const WorkflowLibraryList = () => {
         h={16}
         flexShrink={0}
         flexGrow={0}
-        justifyContent={'space-between'}
+        justifyContent="space-between"
       >
         <ButtonGroup alignSelf="flex-end">
           {workflowCategories.map((category) => (
             <Button
+              key={category}
               variant={selectedCategory === category ? undefined : 'ghost'}
               onClick={handleSetCategory.bind(null, category)}
               isChecked={selectedCategory === category}