refactor(ui): split workflow library state into separate slice

Has no business being in the workflow state slice.

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

@@ -16,10 +16,17 @@ import { $openAPISchemaUrl } from 'app/store/nanostores/openAPISchemaUrl';
 import { $projectId, $projectName, $projectUrl } 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 type {
+  WorkflowTagCategory} from 'features/nodes/store/workflowLibrarySlice';
+import {
+  $workflowLibraryCategoriesOptions,
+  $workflowLibraryTagCategoriesOptions,
+  DEFAULT_WORKFLOW_LIBRARY_CATEGORIES,
+  DEFAULT_WORKFLOW_LIBRARY_TAG_CATEGORIES
+} from 'features/nodes/store/workflowLibrarySlice';
 import type { WorkflowCategory } from 'features/nodes/types/workflow';
 import type { PropsWithChildren, ReactNode } from 'react';
 import React, { lazy, memo, useEffect, useLayoutEffect, useMemo } from 'react';
@@ -48,6 +55,7 @@ interface Props extends PropsWithChildren {
   isDebugging?: boolean;
   logo?: ReactNode;
   workflowCategories?: WorkflowCategory[];
+  workflowTagCategories?: WorkflowTagCategory[];
   loggingOverrides?: LoggingOverrides;
 }
 
@@ -68,6 +76,7 @@ const InvokeAIUI = ({
   isDebugging = false,
   logo,
   workflowCategories,
+  workflowTagCategories,
   loggingOverrides,
 }: Props) => {
   useLayoutEffect(() => {
@@ -195,14 +204,24 @@ const InvokeAIUI = ({
 
   useEffect(() => {
     if (workflowCategories) {
-      $workflowCategories.set(workflowCategories);
+      $workflowLibraryCategoriesOptions.set(workflowCategories);
     }
 
     return () => {
-      $workflowCategories.set([]);
+      $workflowLibraryCategoriesOptions.set(DEFAULT_WORKFLOW_LIBRARY_CATEGORIES);
     };
   }, [workflowCategories]);
 
+  useEffect(() => {
+    if (workflowTagCategories) {
+      $workflowLibraryTagCategoriesOptions.set(workflowTagCategories);
+    }
+
+    return () => {
+      $workflowLibraryTagCategoriesOptions.set(DEFAULT_WORKFLOW_LIBRARY_TAG_CATEGORIES);
+    };
+  }, [workflowTagCategories]);
+
   useEffect(() => {
     if (socketOptions) {
       $socketOptions.set(socketOptions);

invokeai/frontend/web/src/app/store/nanostores/workflowCategories.ts

@@ -1,4 +0,0 @@
-import type { WorkflowCategory } from 'features/nodes/types/workflow';
-import { atom } from 'nanostores';
-
-export const $workflowCategories = atom<WorkflowCategory[]>(['user', 'default']);

invokeai/frontend/web/src/app/store/store.ts

@@ -19,6 +19,7 @@ import { galleryPersistConfig, gallerySlice } from 'features/gallery/store/galle
 import { hrfPersistConfig, hrfSlice } from 'features/hrf/store/hrfSlice';
 import { modelManagerV2PersistConfig, modelManagerV2Slice } from 'features/modelManagerV2/store/modelManagerV2Slice';
 import { nodesPersistConfig, nodesSlice, nodesUndoableConfig } from 'features/nodes/store/nodesSlice';
+import { workflowLibraryPersistConfig, workflowLibrarySlice } from 'features/nodes/store/workflowLibrarySlice';
 import { workflowSettingsPersistConfig, workflowSettingsSlice } from 'features/nodes/store/workflowSettingsSlice';
 import { workflowPersistConfig, workflowSlice } from 'features/nodes/store/workflowSlice';
 import { upscalePersistConfig, upscaleSlice } from 'features/parameters/store/upscaleSlice';
@@ -68,6 +69,7 @@ const allReducers = {
   [canvasSettingsSlice.name]: canvasSettingsSlice.reducer,
   [canvasStagingAreaSlice.name]: canvasStagingAreaSlice.reducer,
   [lorasSlice.name]: lorasSlice.reducer,
+  [workflowLibrarySlice.name]: workflowLibrarySlice.reducer,
 };
 
 const rootReducer = combineReducers(allReducers);
@@ -113,6 +115,7 @@ const persistConfigs: { [key in keyof typeof allReducers]?: PersistConfig } = {
   [canvasSettingsPersistConfig.name]: canvasSettingsPersistConfig,
   [canvasStagingAreaPersistConfig.name]: canvasStagingAreaPersistConfig,
   [lorasPersistConfig.name]: lorasPersistConfig,
+  [workflowLibraryPersistConfig.name]: workflowLibraryPersistConfig,
 };
 
 const unserialize: UnserializeFunction = (data, key) => {