fix: prevent app freeze and white screen after clicking Task Hub (#491)

This commit is contained in:
Wendong-Fan 2025-10-20 05:26:43 +08:00 committed by GitHub
commit 14bc3c581a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 126 additions and 110 deletions

View file

@ -310,7 +310,8 @@ export default function HistorySidebar() {
/>
</div>
<div className="text-left text-[14px] text-text-primary font-bold leading-9 overflow-hidden text-ellipsis break-words line-clamp-3">
{task?.messages[0]?.content || t("task-hub.new-project")}
{task?.messages?.[0]?.content ||
t("task-hub.new-project")}
</div>
<div className="w-full">
<Progress
@ -409,13 +410,13 @@ export default function HistorySidebar() {
<Tooltip>
<TooltipTrigger asChild>
<span>
{task?.messages[0]?.content ||
{task?.messages?.[0]?.content ||
t("task-hub.new-project")}
</span>
</TooltipTrigger>
<TooltipContent className="w-[200px] bg-white-100% p-2 text-wrap break-words text-xs select-text pointer-events-auto !fixed ">
<p>
{task?.messages[0]?.content ||
{task?.messages?.[0]?.content ||
t("task-hub.new-project")}
</p>
</TooltipContent>
@ -460,7 +461,7 @@ export default function HistorySidebar() {
<div className="flex justify-start items-center flex-wrap gap-2 ">
{historyTasks
.filter((task) =>
task.question
task?.question
?.toLowerCase()
.includes(searchValue.toLowerCase())
)
@ -468,11 +469,14 @@ export default function HistorySidebar() {
return (
<div
onClick={() =>
handleSetActive(task.task_id, task.question)
handleSetActive(
task?.task_id,
task?.question
)
}
key={task.task_id}
className={`${
chatStore.activeTaskId === task.task_id
chatStore.activeTaskId === task?.task_id
? "!bg-white-100%"
: ""
} max-w-full relative cursor-pointer transition-all duration-300 bg-white-30% hover:bg-white-100% rounded-3xl w-[316px] h-[180px] p-6 shadow-history-item`}
@ -486,16 +490,16 @@ export default function HistorySidebar() {
alt="folder-icon"
/>
<Tag variant="primary">
# Token {task.tokens || 0}
# Token {task?.tokens || 0}
</Tag>
</div>
<div className="text-[14px] text-text-primary font-bold leading-9 overflow-hidden text-ellipsis whitespace-nowrap">
{task?.question.split("|")[0] ||
{task?.question?.split("|")?.[0] ||
t("task-hub.new-project")}
</div>
<div className="text-xs text-black leading-17 overflow-hidden text-ellipsis break-words line-clamp-2">
{task?.question.split("|")[1] ||
{task?.question?.split("|")?.[1] ||
t("task-hub.new-project")}
</div>
</div>
@ -505,98 +509,110 @@ export default function HistorySidebar() {
) : (
// List
<div className=" flex flex-col justify-start items-center gap-4 ">
{historyTasks.map((task) => {
return (
<div
onClick={() => {
handleSetActive(task.task_id, task.question);
}}
key={task.task_id}
className={`${
chatStore.activeTaskId === task.task_id
? "!bg-white-100%"
: ""
} max-w-full relative cursor-pointer transition-all duration-300 bg-white-30% hover:bg-white-100% rounded-2xl flex justify-between items-center gap-md w-full p-3 h-14 shadow-history-item border border-solid border-border-disabled`}
>
<img className="w-8 h-8" src={folderIcon} alt="folder-icon" />
<div className="w-full text-[14px] text-text-primary font-bold leading-9 overflow-hidden text-ellipsis whitespace-nowrap">
<Tooltip>
<TooltipTrigger asChild>
<span>
{" "}
{task?.question.split("|")[0] || t("task-hub.new-project")}
</span>
</TooltipTrigger>
<TooltipContent
align="start"
className="w-[800px] bg-white-100% p-2 text-wrap break-words text-xs select-text pointer-events-auto"
>
<div>
{" "}
{task?.question.split("|")[0] || t("task-hub.new-project")}
</div>
</TooltipContent>
</Tooltip>
</div>
<Tag
variant="primary"
className="text-xs leading-17 font-medium text-nowrap"
{historyTasks.map((task) => {
return (
<div
onClick={() => {
handleSetActive(
task?.task_id,
task?.question
);
}}
key={task.task_id}
className={`${
chatStore.activeTaskId === task?.task_id
? "!bg-white-100%"
: ""
} max-w-full relative cursor-pointer transition-all duration-300 bg-white-30% hover:bg-white-100% rounded-2xl flex justify-between items-center gap-md w-full p-3 h-14 shadow-history-item border border-solid border-border-disabled`}
>
# Token {task.tokens || 0}
</Tag>
<Popover>
<PopoverTrigger asChild>
<Button
size="icon"
onClick={(e) => e.stopPropagation()}
variant="ghost"
>
<Ellipsis size={16} className="text-text-primary" />
</Button>
</PopoverTrigger>
<PopoverContent className=" w-[98px] p-sm rounded-[12px] bg-dropdown-bg border border-solid border-dropdown-border">
<div className="space-y-1">
<PopoverClose asChild>
<Button
variant="ghost"
size="sm"
className="w-full"
onClick={(e) => {
e.stopPropagation();
handleShare(task.task_id);
}}
>
<Share size={16} />
{t("task-hub.share")}
</Button>
</PopoverClose>
<PopoverClose asChild>
<Button
variant="ghost"
size="sm"
className="w-full"
onClick={(e) => {
e.stopPropagation();
handleDelete(task.id);
}}
>
<Trash2
size={16}
className="text-icon-primary group-hover:text-icon-cuation"
/>
{t("task-hub.delete")}
</Button>
</PopoverClose>
</div>
</PopoverContent>
</Popover>
</div>
);
})}
</div>
<img
className="w-8 h-8"
src={folderIcon}
alt="folder-icon"
/>
<div className="w-full text-[14px] text-text-primary font-bold leading-9 overflow-hidden text-ellipsis whitespace-nowrap">
<Tooltip>
<TooltipTrigger asChild>
<span>
{" "}
{task?.question?.split("|")?.[0] ||
t("task-hub.new-project")}
</span>
</TooltipTrigger>
<TooltipContent
align="start"
className="w-[800px] bg-white-100% p-2 text-wrap break-words text-xs select-text pointer-events-auto"
>
<div>
{" "}
{task?.question?.split("|")?.[0] ||
t("task-hub.new-project")}
</div>
</TooltipContent>
</Tooltip>
</div>
<Tag
variant="primary"
className="text-xs leading-17 font-medium text-nowrap"
>
# Token {task?.tokens || 0}
</Tag>
<Popover>
<PopoverTrigger asChild>
<Button
size="icon"
onClick={(e) => e.stopPropagation()}
variant="ghost"
>
<Ellipsis
size={16}
className="text-text-primary"
/>
</Button>
</PopoverTrigger>
<PopoverContent className=" w-[98px] p-sm rounded-[12px] bg-dropdown-bg border border-solid border-dropdown-border">
<div className="space-y-1">
<PopoverClose asChild>
<Button
variant="ghost"
size="sm"
className="w-full"
onClick={(e) => {
e.stopPropagation();
handleShare(task?.task_id);
}}
>
<Share size={16} />
{t("task-hub.share")}
</Button>
</PopoverClose>
<PopoverClose asChild>
<Button
variant="ghost"
size="sm"
className="w-full"
onClick={(e) => {
e.stopPropagation();
handleDelete(task?.id);
}}
>
<Trash2
size={16}
className="text-icon-primary group-hover:text-icon-cuation"
/>
{t("task-hub.delete")}
</Button>
</PopoverClose>
</div>
</PopoverContent>
</Popover>
</div>
);
})}
</div>
)}
</motion.div>
)}

View file

@ -565,10 +565,10 @@ export default function Home() {
{historyTasks.map((task) => {
return (
<div
onClick={() => handleSetActive(task.task_id, task.question)}
onClick={() => handleSetActive(task?.task_id, task?.question)}
key={task.task_id}
className={`${
chatStore.activeTaskId === task.task_id
chatStore.activeTaskId === task?.task_id
? "!bg-white-100%"
: ""
} relative cursor-pointer transition-all duration-300 bg-white-30% hover:bg-white-100% rounded-3xl flex justify-between items-center flex-wrap gap-md flex-initial w-[calc(33%-48px)] min-w-[300px] max-w-[500px] h-[180px] p-6 shadow-history-item border border-solid border-border-disabled`}
@ -587,7 +587,7 @@ export default function Home() {
variant="primary"
className="text-xs leading-17 font-medium text-nowrap"
>
# Token {task.tokens || 0}
# Token {task?.tokens || 0}
</Tag>
</div>
</div>
@ -607,11 +607,11 @@ export default function Home() {
return (
<div
onClick={() => {
handleSetActive(task.task_id, task.question);
handleSetActive(task?.task_id, task?.question);
}}
key={task.task_id}
className={`${
chatStore.activeTaskId === task.task_id
chatStore.activeTaskId === task?.task_id
? "!bg-white-100%"
: ""
} max-w-full relative cursor-pointer transition-all duration-300 bg-white-30% hover:bg-white-100% rounded-2xl flex justify-between items-center gap-md w-full p-3 h-14 shadow-history-item border border-solid border-border-disabled`}
@ -625,7 +625,7 @@ export default function Home() {
<TooltipTrigger asChild>
<span>
{" "}
{task?.question.split("|")[0] ||
{task?.question?.split("|")?.[0] ||
t("task-hub.new-project")}
</span>
</TooltipTrigger>
@ -635,7 +635,7 @@ export default function Home() {
>
<div>
{" "}
{task?.question.split("|")[0] ||
{task?.question?.split("|")?.[0] ||
t("task-hub.new-project")}
</div>
</TooltipContent>
@ -645,7 +645,7 @@ export default function Home() {
variant="primary"
className="text-xs leading-17 font-medium text-nowrap"
>
# Token {task.tokens || 0}
# Token {task?.tokens || 0}
</Tag>
<Popover>
@ -667,7 +667,7 @@ export default function Home() {
className="w-full"
onClick={(e) => {
e.stopPropagation();
handleShare(task.task_id);
handleShare(task?.task_id);
}}
>
<Share size={16} />
@ -682,7 +682,7 @@ export default function Home() {
className="w-full"
onClick={(e) => {
e.stopPropagation();
handleDelete(task.id);
handleDelete(task?.id);
}}
>
<Trash2