feat: add 'project' workflow category

invokeai/app/services/workflow_records/workflow_records_common.py

@@ -32,6 +32,7 @@ class WorkflowRecordOrderBy(str, Enum, metaclass=MetaEnum):
 class WorkflowCategory(str, Enum, metaclass=MetaEnum):
     User = "user"
     Default = "default"
+    Project = "project"
 
 
 class WorkflowMeta(BaseModel):

invokeai/frontend/web/public/locales/en.json

@@ -1626,7 +1626,8 @@
         "workflows": "Workflows",
         "workflowLibrary": "Workflow Library",
         "userWorkflows": "My Workflows",
-        "defaultWorkflows": "Default Workflows",
+        "defaultWorkflows": "Defaults",
+        "projectWorkflows": "Project",
         "openWorkflow": "Open Workflow",
         "uploadWorkflow": "Upload Workflow",
         "deleteWorkflow": "Delete Workflow",
@@ -1636,9 +1637,7 @@
         "saveWorkflowAs": "Save Workflow As",
         "problemSavingWorkflow": "Problem Saving Workflow",
         "workflowSaved": "Workflow Saved",
-        "noRecentWorkflows": "No Recent Workflows",
+        "noWorkflows": "No Workflows",
-        "noUserWorkflows": "No User Workflows",
-        "noSystemWorkflows": "No System Workflows",
         "problemLoading": "Problem Loading Workflows",
         "loading": "Loading Workflows",
         "noDescription": "No description",

invokeai/frontend/web/src/features/nodes/types/workflow.ts

@@ -14,7 +14,7 @@ export type XYPosition = z.infer<typeof zXYPosition>;
 export const zDimension = z.number().gt(0).nullish();
 export type Dimension = z.infer<typeof zDimension>;
 
-export const zWorkflowCategory = z.enum(['user', 'default']);
+export const zWorkflowCategory = z.enum(['user', 'default', 'project']);
 export type WorkflowCategory = z.infer<typeof zWorkflowCategory>;
 // #endregion
 

invokeai/frontend/web/src/features/workflowLibrary/components/WorkflowLibraryList.tsx

@@ -10,6 +10,8 @@ import {
   Spacer,
 } from '@chakra-ui/react';
 import { SelectItem } from '@mantine/core';
+import { useStore } from '@nanostores/react';
+import { $projectId } from 'app/store/nanostores/projectId';
 import IAIButton from 'common/components/IAIButton';
 import {
   IAINoContentFallback,
@@ -35,13 +37,16 @@ import { useDebounce } from 'use-debounce';
 
 const PER_PAGE = 10;
 
-const ORDER_BY_DATA: SelectItem[] = [
+const BASE_ORDER_BY_DATA: SelectItem[] = [
-  { value: 'opened_at', label: 'Opened' },
   { value: 'created_at', label: 'Created' },
   { value: 'updated_at', label: 'Updated' },
   { value: 'name', label: 'Name' },
 ];
 
+const OPENED_AT_ORDER_BY_EXTRAS: SelectItem[] = [
+  { value: 'opened_at', label: 'Opened' },
+];
+
 const DIRECTION_DATA: SelectItem[] = [
   { value: 'ASC', label: 'Ascending' },
   { value: 'DESC', label: 'Descending' },
@@ -55,14 +60,21 @@ const WorkflowLibraryList = () => {
   const [order_by, setOrderBy] = useState<WorkflowRecordOrderBy>('opened_at');
   const [direction, setDirection] = useState<SQLiteDirection>('ASC');
   const [debouncedQuery] = useDebounce(query, 500);
+  const projectId = useStore($projectId);
+  const orderByData = useMemo<SelectItem[]>(() => {
+    if (category === 'project') {
+      return BASE_ORDER_BY_DATA;
+    }
+    return [...BASE_ORDER_BY_DATA, ...OPENED_AT_ORDER_BY_EXTRAS];
+  }, [category]);
 
   const queryArg = useMemo<Parameters<typeof useListWorkflowsQuery>[0]>(() => {
-    if (category === 'user') {
+    if (category === 'default') {
       return {
         page,
         per_page: PER_PAGE,
-        order_by,
+        order_by: 'name' as const,
-        direction,
+        direction: 'ASC' as const,
         category,
         query: debouncedQuery,
       };
@@ -70,8 +82,8 @@ const WorkflowLibraryList = () => {
     return {
       page,
       per_page: PER_PAGE,
-      order_by: 'name' as const,
+      order_by,
-      direction: 'ASC' as const,
+      direction,
       category,
       query: debouncedQuery,
     };
@@ -137,6 +149,15 @@ const WorkflowLibraryList = () => {
     setPage(0);
   }, []);
 
+  const handleSetProjectCategory = useCallback(() => {
+    setCategory('project');
+    setPage(0);
+    // Projects can't be sorted by opened_at
+    if (order_by === 'opened_at') {
+      setOrderBy('name');
+    }
+  }, [order_by]);
+
   return (
     <>
       <Flex gap={4} alignItems="center" h={10} flexShrink={0} flexGrow={0}>
@@ -148,6 +169,15 @@ const WorkflowLibraryList = () => {
           >
             {t('workflows.userWorkflows')}
           </IAIButton>
+          {projectId && (
+            <IAIButton
+              variant={category === 'project' ? undefined : 'ghost'}
+              onClick={handleSetProjectCategory}
+              isChecked={category === 'project'}
+            >
+              {t('workflows.projectWorkflows')}
+            </IAIButton>
+          )}
           <IAIButton
             variant={category === 'default' ? undefined : 'ghost'}
             onClick={handleSetDefaultCategory}
@@ -157,12 +187,12 @@ const WorkflowLibraryList = () => {
           </IAIButton>
         </ButtonGroup>
         <Spacer />
-        {category === 'user' && (
+        {category !== 'default' && (
           <>
             <IAIMantineSelect
               label={t('common.orderBy')}
               value={order_by}
-              data={ORDER_BY_DATA}
+              data={orderByData}
               onChange={handleChangeOrderBy}
               formControlProps={{
                 w: 48,
@@ -223,7 +253,7 @@ const WorkflowLibraryList = () => {
           </Flex>
         </ScrollableContent>
       ) : (
-        <IAINoContentFallback label={t('workflows.noUserWorkflows')} />
+        <IAINoContentFallback label={t('workflows.noWorkflows')} />
       )}
       <Divider />
       {data && (

invokeai/frontend/web/src/main.tsx

@@ -3,5 +3,5 @@ import ReactDOM from 'react-dom/client';
 import InvokeAIUI from './app/components/InvokeAIUI';
 
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
-  <InvokeAIUI />
+  <InvokeAIUI projectId="test" />
 );