From 60b4b10622d091cd9789ed8369098ff63fe24a99 Mon Sep 17 00:00:00 2001
From: yyh <yuanyouhuilyz@gmail.com>
Date: Fri, 30 Jan 2026 15:32:49 +0800
Subject: [PATCH] fix(skill): disable template buttons during upload to prevent
 duplicates

Pass disabled/loading props to TemplateCard declaratively from
loadingId state. All cards are disabled while any upload is in
progress, and the active card shows a loading spinner. Remove the
imperative pointer-events overlay in favor of native button disabled.
---
 .../workflow/skill/start-tab/skill-templates-section.tsx    | 5 ++---
 .../components/workflow/skill/start-tab/template-card.tsx   | 6 +++++-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx b/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx
index 82b41fd0c1..cf176d5183 100644
--- a/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx
+++ b/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx
@@ -94,13 +94,12 @@ const SkillTemplatesSection = () => {
           <TemplateCard
             key={entry.id}
             template={entry}
+            disabled={loadingId !== null}
+            loading={loadingId === entry.id}
             onUse={handleUse}
           />
         ))}
       </div>
-      {loadingId
-        ? <div className="pointer-events-none fixed inset-0 z-50" />
-        : null}
     </section>
   )
 }
diff --git a/web/app/components/workflow/skill/start-tab/template-card.tsx b/web/app/components/workflow/skill/start-tab/template-card.tsx
index cbd25e881a..a15d8b9438 100644
--- a/web/app/components/workflow/skill/start-tab/template-card.tsx
+++ b/web/app/components/workflow/skill/start-tab/template-card.tsx
@@ -10,10 +10,12 @@ import Button from '@/app/components/base/button'
 
 type TemplateCardProps = {
   template: SkillTemplateSummary
+  disabled?: boolean
+  loading?: boolean
   onUse: (template: SkillTemplateSummary) => void
 }
 
-const TemplateCard = ({ template, onUse }: TemplateCardProps) => {
+const TemplateCard = ({ template, disabled, loading, onUse }: TemplateCardProps) => {
   const { t } = useTranslation('workflow')
 
   return (
@@ -53,6 +55,8 @@ const TemplateCard = ({ template, onUse }: TemplateCardProps) => {
             variant="primary"
             size="medium"
             className="w-full"
+            disabled={disabled}
+            loading={loading}
             onClick={() => onUse(template)}
           >
             <RiAddLine className="mr-0.5 h-4 w-4" />