74 lines
2.4 KiB
TypeScript
74 lines
2.4 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useMemo, useState } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent } from "@/components/ui/card";
|
|
import { getMnoteRuntimeConfig } from "@/lib/runtime-config";
|
|
|
|
interface TaskResponse {
|
|
task_id: string;
|
|
status: string;
|
|
progress: number;
|
|
message?: string | null;
|
|
}
|
|
|
|
interface Props {
|
|
documentId: string;
|
|
}
|
|
|
|
export function DocumentTaskPanel({ documentId }: Props) {
|
|
const [task, setTask] = useState<TaskResponse | null>(null);
|
|
const [pending, setPending] = useState(false);
|
|
const runtime = useMemo(() => getMnoteRuntimeConfig(), []);
|
|
const backendUrl = runtime.backendUrl;
|
|
const useConvex = Boolean(runtime.useConvex);
|
|
|
|
const triggerTask = async () => {
|
|
// 说明：当前后端（FastAPI）仍使用 Supabase JWT 做鉴权；Convex 迁移阶段先不打通这一块。
|
|
if (useConvex) return;
|
|
if (!backendUrl) return;
|
|
setPending(true);
|
|
try {
|
|
// TODO：如需恢复该能力，请在接入真实鉴权后，将 access_token 从 AuthContext 注入到这里。
|
|
// 这里暂时保持 UI 可渲染，不发起请求。
|
|
void documentId;
|
|
} finally {
|
|
setPending(false);
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (useConvex) return;
|
|
if (!backendUrl || !task?.task_id) {
|
|
return;
|
|
}
|
|
const timer = setInterval(async () => {
|
|
// 说明：同上，暂不轮询。
|
|
void timer;
|
|
}, 2000);
|
|
return () => clearInterval(timer);
|
|
}, [backendUrl, task?.task_id, useConvex]);
|
|
|
|
return (
|
|
<Card className="mt-4 bg-white shadow-sm">
|
|
<CardContent className="flex items-center justify-between py-3 text-sm text-gray-600">
|
|
<div>
|
|
<div className="font-medium text-gray-900">后端 OCR 流程</div>
|
|
<div className="text-xs text-gray-500">
|
|
状态：{task ? task.status : "未开始"} · 进度：{task ? `${task.progress}%` : "0%"}
|
|
</div>
|
|
{useConvex && (
|
|
<div className="text-xs text-gray-500">
|
|
提示：Convex 迁移阶段暂未接入后端鉴权（Supabase JWT），该按钮仅用于占位。
|
|
</div>
|
|
)}
|
|
{task?.message && <div className="text-xs text-gray-500">提示：{task.message}</div>}
|
|
</div>
|
|
<Button onClick={triggerTask} disabled={pending || useConvex} variant="outline">
|
|
{pending ? "触发中..." : "触发 OCR"}
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|