improvements for folders and parameters (#3918)

Co-authored-by: Jonathan Dobson <jon.m.dobson@gmail.com>
This commit is contained in:
Celal Zamanoglu
2025-11-06 20:09:26 +03:00
committed by GitHub
parent d104135025
commit dea70f2782
10 changed files with 106 additions and 13 deletions

View File

@@ -35,9 +35,13 @@ function getErrorMessage(error: unknown, fallback: string): string {
interface ImportWorkflowButtonProps {
onImportStart?: () => void;
selectedFolderId?: string | null;
}
function ImportWorkflowButton({ onImportStart }: ImportWorkflowButtonProps) {
function ImportWorkflowButton({
onImportStart,
selectedFolderId,
}: ImportWorkflowButtonProps) {
const inputId = useId();
const credentialGetter = useCredentialGetter();
const queryClient = useQueryClient();
@@ -45,6 +49,10 @@ function ImportWorkflowButton({ onImportStart }: ImportWorkflowButtonProps) {
const createWorkflowFromYamlMutation = async (yaml: string) => {
try {
const client = await getClient(credentialGetter);
const params: Record<string, string> = {};
if (selectedFolderId) {
params.folder_id = selectedFolderId;
}
await client.post<string, { data: WorkflowApiResponse }>(
"/workflows",
yaml,
@@ -52,12 +60,16 @@ function ImportWorkflowButton({ onImportStart }: ImportWorkflowButtonProps) {
headers: {
"Content-Type": "text/plain",
},
params,
},
);
queryClient.invalidateQueries({
queryKey: ["workflows"],
});
queryClient.invalidateQueries({
queryKey: ["folders"],
});
toast({
variant: "success",
title: "Workflow imported",
@@ -78,10 +90,15 @@ function ImportWorkflowButton({ onImportStart }: ImportWorkflowButtonProps) {
formData.append("file", file);
const client = await getClient(credentialGetter);
const params: Record<string, string> = {};
if (selectedFolderId) {
params.folder_id = selectedFolderId;
}
await client.post("/workflows/import-pdf", formData, {
headers: {
"Content-Type": "multipart/form-data",
},
params,
});
// Notify parent to start polling

View File

@@ -32,6 +32,7 @@ import {
LightningBoltIcon,
MagnifyingGlassIcon,
MixerHorizontalIcon,
Pencil2Icon,
PlayIcon,
PlusIcon,
ReloadIcon,
@@ -415,11 +416,17 @@ function Workflows() {
/>
</div>
<div className="flex gap-4">
<ImportWorkflowButton onImportStart={startPolling} />
<ImportWorkflowButton
onImportStart={startPolling}
selectedFolderId={selectedFolderId}
/>
<Button
disabled={createWorkflowMutation.isPending}
onClick={() => {
createWorkflowMutation.mutate(emptyWorkflowRequest);
createWorkflowMutation.mutate({
...emptyWorkflowRequest,
folder_id: selectedFolderId,
});
}}
>
{createWorkflowMutation.isPending ? (
@@ -591,12 +598,23 @@ function Workflows() {
</TableCell>
<TableCell>
<div className="flex justify-end gap-2">
<WorkflowFolderSelector
workflowPermanentId={
workflow.workflow_permanent_id
}
currentFolderId={workflow.folder_id}
/>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div>
<WorkflowFolderSelector
workflowPermanentId={
workflow.workflow_permanent_id
}
currentFolderId={workflow.folder_id}
/>
</div>
</TooltipTrigger>
<TooltipContent>
Assign to Folder
</TooltipContent>
</Tooltip>
</TooltipProvider>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
@@ -625,6 +643,27 @@ function Workflows() {
</TooltipContent>
</Tooltip>
</TooltipProvider>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
size="icon"
variant="outline"
onClick={(event) => {
handleIconClick(
event,
`/workflows/${workflow.workflow_permanent_id}/debug`,
);
}}
>
<Pencil2Icon className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent>
Open in Editor
</TooltipContent>
</Tooltip>
</TooltipProvider>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
@@ -676,7 +715,7 @@ function Workflows() {
<div
key={idx}
className={cn(
"grid grid-cols-[140px_1fr_2fr] gap-4 rounded border bg-white p-3 text-sm dark:border-slate-800 dark:bg-slate-900",
"grid grid-cols-[minmax(200px,1fr)_minmax(200px,1fr)_minmax(300px,2fr)] gap-6 rounded border bg-white p-3 text-sm dark:border-slate-800 dark:bg-slate-900",
matchesParam &&
"shadow-[0_0_15px_rgba(59,130,246,0.3)] ring-2 ring-blue-500/50",
)}

View File

@@ -66,12 +66,15 @@ function WorkflowFolderSelector({
"h-8 w-8",
currentFolderId ? "text-blue-400" : "text-slate-400",
)}
title="Move to folder"
>
<FileIcon className="h-4 w-4" />
</Button>
</PopoverTrigger>
<PopoverContent className="w-80 p-0" align="end">
<PopoverContent
className="w-80 p-0"
align="end"
onCloseAutoFocus={(e) => e.preventDefault()}
>
<div className="border-b p-3">
<h4 className="mb-2 text-sm font-medium">Move to folder</h4>
<div className="relative">

View File

@@ -57,8 +57,9 @@ export function useActiveImportsPolling() {
description: `Successfully imported ${prevImport.title || "workflow"}`,
});
// Refresh workflows to show new workflow
// Refresh workflows and folders to show new workflow and update folder counts
queryClient.invalidateQueries({ queryKey: ["workflows"] });
queryClient.invalidateQueries({ queryKey: ["folders"] });
}
});

View File

@@ -29,6 +29,9 @@ function useCreateWorkflowMutation() {
queryClient.invalidateQueries({
queryKey: ["workflows"],
});
queryClient.invalidateQueries({
queryKey: ["folders"],
});
navigate(`/workflows/${response.data.workflow_permanent_id}/debug`);
},
});

View File

@@ -20,6 +20,7 @@ export type WorkflowCreateYAMLRequest = {
ai_fallback?: boolean;
run_sequentially?: boolean;
sequential_key?: string | null;
folder_id?: string | null;
};
export type WorkflowDefinitionYAML = {