import from local gallery and frontend notif changes

Author: deep1401

src/renderer/components/TaskLibrary/NewTaskModal.tsx

@@ -18,7 +18,8 @@ import {
   Alert,
 } from '@mui/joy';
 import * as chatAPI from 'renderer/lib/transformerlab-api-sdk';
-import useSWR from 'swr';
+import { useNotification } from 'renderer/components/Shared/NotificationSystem';
+import { useAPI } from 'renderer/lib/api-client/hooks';
 
 interface NewTaskModalProps {
   open: boolean;
@@ -32,12 +33,10 @@ export default function NewTaskModal({ open, onClose, onSuccess }: NewTaskModalP
   const [selectedTaskId, setSelectedTaskId] = useState('');
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [error, setError] = useState('');
+  const { addNotification } = useNotification();
 
   // Fetch existing REMOTE tasks
-  const { data: remoteTasksResp } = useSWR(
-    chatAPI.getAPIFullPath('tasks', ['getAll'], {}),
-    chatAPI.fetcher
-  );
+  const { data: remoteTasksResp } = useAPI('tasks', ['getAll'], {});
 
   const remoteTasks = Array.isArray(remoteTasksResp)
     ? remoteTasksResp.filter((task: any) => task.remote_task === true)
@@ -71,6 +70,10 @@ export default function NewTaskModal({ open, onClose, onSuccess }: NewTaskModalP
       const result = await response.json();
 
       if (result.status === 'success') {
+        addNotification({
+          type: 'success',
+          message: `Task "${taskName}" successfully exported to local gallery!`,
+        });
         onSuccess?.();
         onClose();
         setTaskName('');
@@ -80,6 +83,10 @@ export default function NewTaskModal({ open, onClose, onSuccess }: NewTaskModalP
         setError(result.message || 'Failed to create task');
       }
     } catch (err) {
+      addNotification({
+        type: 'danger',
+        message: `Failed to export task: ${err}`,
+      });
       setError('Network error occurred');
     } finally {
       setIsSubmitting(false);

src/renderer/components/TaskLibrary/TaskLibrary.tsx

@@ -18,23 +18,19 @@ import {
 } from 'lucide-react';
 
 import { useExperimentInfo } from 'renderer/lib/ExperimentInfoContext';
+import { useNotification } from 'renderer/components/Shared/NotificationSystem';
 import TaskModal from './TaskModal';
 import NewTaskModal from './NewTaskModal';
 import * as chatAPI from 'renderer/lib/transformerlab-api-sdk';
-import useSWR from 'swr';
+import { useAPI } from 'renderer/lib/api-client/hooks';
 import Chip from '@mui/joy/Chip';
 
-export default function TaskLibrary({}) {
+export default function TaskLibrary() {
   const { experimentInfo } = useExperimentInfo();
+  const { addNotification } = useNotification();
 
-  const { data: localGalleryResp } = useSWR(
-    chatAPI.getAPIFullPath('tasks', ['localGallery'], {}),
-    chatAPI.fetcher
-  );
-  const { data: remoteGalleryResp } = useSWR(
-    chatAPI.getAPIFullPath('tasks', ['gallery'], {}),
-    chatAPI.fetcher
-  );
+  const { data: localGalleryResp } = useAPI('tasks', ['localGallery'], {});
+  const { data: remoteGalleryResp } = useAPI('tasks', ['gallery'], {});
 
   // local overlay for create/edit/delete without waiting for refetch
   const [overlayTasks, setOverlayTasks] = useState<any[]>([]);
@@ -74,19 +70,81 @@ export default function TaskLibrary({}) {
   };
 
   const handleImportFromGallery = async (subdir: string) => {
-    const url = chatAPI.getAPIFullPath('tasks', ['importFromGallery'], {});
-    const form = new URLSearchParams();
-    form.set('subdir', subdir);
-    // experimentId optional; if available in context add it
-    if (experimentInfo?.id) form.set('experiment_id', experimentInfo.id);
-    await fetch(url, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/x-www-form-urlencoded',
-      },
-      body: form.toString(),
-      credentials: 'include',
-    });
+    try {
+      const url = chatAPI.getAPIFullPath('tasks', ['importFromGallery'], {});
+      const form = new URLSearchParams();
+      form.set('subdir', subdir);
+      // experimentId optional; if available in context add it
+      if (experimentInfo?.id) form.set('experiment_id', experimentInfo.id);
+
+      const response = await fetch(url, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/x-www-form-urlencoded',
+        },
+        body: form.toString(),
+        credentials: 'include',
+      });
+
+      const result = await response.json();
+
+      if (result.status === 'success') {
+        const action = result.action || 'imported';
+        addNotification({
+          type: 'success',
+          message: `Task ${action === 'updated' ? 'updated' : 'imported'} successfully from gallery!`,
+        });
+      } else {
+        addNotification({
+          type: 'danger',
+          message: `Failed to import task: ${result.message || 'Unknown error'}`,
+        });
+      }
+    } catch (error) {
+      addNotification({
+        type: 'danger',
+        message: `Failed to import task: ${error}`,
+      });
+    }
+  };
+
+  const handleImportFromLocal = async (subdir: string) => {
+    try {
+      const url = chatAPI.getAPIFullPath('tasks', ['importFromLocalGallery'], {});
+      const form = new URLSearchParams();
+      form.set('subdir', subdir);
+      // experimentId optional; if available in context add it
+      if (experimentInfo?.id) form.set('experiment_id', experimentInfo.id);
+
+      const response = await fetch(url, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/x-www-form-urlencoded',
+        },
+        body: form.toString(),
+        credentials: 'include',
+      });
+
+      const result = await response.json();
+
+      if (result.status === 'success') {
+        const action = result.action || 'imported';
+        addNotification({
+          type: 'success',
+          message: `Task ${action === 'updated' ? 'updated' : 'imported'} successfully from local gallery!`,
+        });
+      } else {
+        addNotification({
+          type: 'danger',
+          message: `Failed to import task: ${result.message || 'Unknown error'}`,
+        });
+      }
+    } catch (error) {
+      addNotification({
+        type: 'danger',
+        message: `Failed to import task: ${error}`,
+      });
+    }
   };
 
   const handleCreate = () => {
@@ -235,6 +293,17 @@ export default function TaskLibrary({}) {
                   Import
                 </Button>
               )}
+
+              {task._isLocal && (
+                <Button
+                  size="sm"
+                  variant="outlined"
+                  onClick={() => handleImportFromLocal(task._subdir || task.id.split(':')[1])}
+                  startDecorator={<FilePlus size={12} />}
+                >
+                  Import
+                </Button>
+              )}
             </Box>
           </ListItem>
         ))}

src/renderer/lib/api-client/allEndpoints.json

@@ -51,6 +51,10 @@
     "importToLocalGallery": {
       "method": "POST",
       "path": "tasks/export_to_local_gallery"
+    },
+    "importFromLocalGallery": {
+      "method": "POST",
+      "path": "tasks/import_from_local_gallery"
     }
   },
   "server": {