wangxuming/makelore
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复 AI 设计任务栏同步与独立滚动

Browse Source 
问题：生成任务未及时出现在右侧栏，任务区与会话区还会共享外层滚动。

实现：补齐 Agent 回合与 Quote 确认后的任务同步，锁定左右滚动容器并增加桌面布局和异步任务回归测试。
This commit is contained in:
brother7
2026-08-01 23:12:24 +08:00
parent 592bdfbc70
commit 83e21563dc
3 changed files with 118 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/pages/ImageCanvas/index.tsx
View File

@@ -326,7 +326,7 @@ export function ImageCanvas() {
}
return (
<div data-testid="image-canvas-page" className="-m-5 flex min-h-full min-w-0 flex-col overflow-hidden bg-background text-foreground sm:-m-6">
<div data-testid="image-canvas-page" className="-m-5 flex h-full min-h-0 min-w-0 flex-col overflow-hidden bg-background text-foreground sm:-m-6">
<header className="glass-surface flex shrink-0 items-center justify-between gap-3 border-b border-border/70 bg-background/80 px-4 py-3 sm:px-6">
<div className="flex min-w-0 items-center gap-3">
<div className="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-brand-soft text-brand">
@@ -361,9 +361,9 @@ export function ImageCanvas() {
</Button>
</header>
<div className="flex min-h-0 min-w-0 flex-1 flex-col lg:flex-row">
<section className="flex min-h-0 min-w-0 flex-1 flex-col">
<main data-testid="image-workspace-conversation" className="min-h-0 flex-1 overflow-y-auto px-4 py-5 sm:px-6">
<div className="flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden lg:flex-row">
<section className="flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden lg:h-full">
<main data-testid="image-workspace-conversation" className="min-h-0 flex-1 overflow-y-auto overscroll-contain px-4 py-5 sm:px-6">
<div className="mx-auto flex min-h-full w-full max-w-3xl flex-col pb-4">
{workspace.messages.length === 0 ? (
<div data-testid="image-workspace-empty-state" className="flex flex-1 items-center justify-center py-10 text-center">
@@ -469,7 +469,9 @@ export function ImageCanvas() {
</form>
</section>
<aside data-testid="design-task-list" className="min-h-0 w-full shrink-0 border-t border-border/70 bg-surface-subtle/45 lg:w-80 lg:border-l lg:border-t-0">
<div data-testid="design-pane-divider" aria-hidden="true" className="hidden w-px shrink-0 bg-border/70 lg:block" />
<aside data-testid="design-task-list" className="min-h-0 w-full shrink-0 overflow-hidden border-t border-border/70 bg-surface-subtle/45 lg:h-full lg:w-80 lg:border-t-0">
<div className="flex items-center justify-between border-b border-border/70 px-4 py-3">
<div>
<h2 className="text-sm font-semibold">生成任务</h2>
@@ -477,7 +479,7 @@ export function ImageCanvas() {
</div>
{hasActiveTasks ? <Clock3 className="h-4 w-4 animate-pulse text-brand" /> : null}
</div>
<div className="max-h-72 space-y-3 overflow-y-auto p-3 lg:max-h-none lg:h-[calc(100%-57px)]">
<div data-testid="design-task-scroll" className="h-full max-h-72 space-y-3 overflow-y-auto overscroll-contain p-3 lg:h-[calc(100%-57px)] lg:max-h-none">
{tasks.length === 0 ? (
<div className="rounded-2xl border border-dashed border-border/80 bg-background/70 px-4 py-7 text-center">
<WandSparkles className="mx-auto h-5 w-5 text-muted-foreground" />