tas/Codewalkers
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add Approve button for pending_approval tasks in TaskSlideOver

Browse Source
This commit is contained in:
Lukas May
2026-03-05 16:46:12 +01:00
parent da8c714de2
commit 3d1818d567
1 changed files with 28 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
apps/web/src/components/execution/TaskSlideOver.tsx
View File

@@ -1,6 +1,6 @@
import { useCallback, useEffect, useRef, useMemo } from "react"; import { useCallback, useEffect, useRef, useMemo } from "react";
import { motion, AnimatePresence } from "motion/react"; import { motion, AnimatePresence } from "motion/react";
import { X, Trash2, MessageCircle } from "lucide-react"; import { X, Trash2, MessageCircle, CheckCircle2 } from "lucide-react";
import type { ChatTarget } from "@/components/chat/ChatSlideOver"; import type { ChatTarget } from "@/components/chat/ChatSlideOver";
import { Badge } from "@/components/ui/badge"; import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
@@ -20,6 +20,7 @@ interface TaskSlideOverProps {
export function TaskSlideOver({ onOpenChat }: TaskSlideOverProps) { export function TaskSlideOver({ onOpenChat }: TaskSlideOverProps) {
const { selectedEntry, setSelectedTaskId } = useExecutionContext(); const { selectedEntry, setSelectedTaskId } = useExecutionContext();
const queueTaskMutation = trpc.queueTask.useMutation(); const queueTaskMutation = trpc.queueTask.useMutation();
const approveTaskMutation = trpc.approveTask.useMutation();
const deleteTaskMutation = trpc.deleteTask.useMutation(); const deleteTaskMutation = trpc.deleteTask.useMutation();
const updateTaskMutation = trpc.updateTask.useMutation(); const updateTaskMutation = trpc.updateTask.useMutation();
@@ -229,17 +230,32 @@ export function TaskSlideOver({ onOpenChat }: TaskSlideOverProps) {
{/* Footer */} {/* Footer */}
<div className="flex items-center gap-2 border-t border-border px-5 py-3"> <div className="flex items-center gap-2 border-t border-border px-5 py-3">
<Button {task.status === "pending_approval" ? (
variant="outline" <Button
size="sm" size="sm"
disabled={!canQueue} className="gap-1.5"
onClick={() => { disabled={approveTaskMutation.isPending}
queueTaskMutation.mutate({ taskId: task.id }); onClick={() => {
close(); approveTaskMutation.mutate({ taskId: task.id });
}} close();
> }}
Queue Task >
</Button> <CheckCircle2 className="h-3.5 w-3.5" />
Approve
</Button>
) : (
<Button
variant="outline"
size="sm"
disabled={!canQueue}
onClick={() => {
queueTaskMutation.mutate({ taskId: task.id });
close();
}}
>
Queue Task
</Button>
)}
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"