收口前端平台组件库能力

新增 PlatformUiKit 通用弹窗、按钮、状态、空态、媒体、表单和标签等公共组件
迁移结果页、创作工作台、认证入口、RPG 暗色面板和运行态弹窗的重复 UI chrome
补充组件测试、页面回归测试、技术文档和 Hermes 共享决策记录

src/components/platform-entry/PlatformTaskCompletionDialog.tsx

@@ -1,8 +1,9 @@
-import { CheckCircle2, Copy } from 'lucide-react';
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { useEffect, useMemo } from 'react';
 
-import { copyTextToClipboard } from '../../services/clipboard';
+import { CopyFeedbackButton } from '../common/CopyFeedbackButton';
+import { PlatformInfoBlock } from '../common/PlatformInfoBlock';
 import { UnifiedModal } from '../common/UnifiedModal';
+import { useCopyFeedback } from '../common/useCopyFeedback';
 
 export type PlatformTaskCompletionDialogPayload = {
   source: string;
@@ -30,43 +31,22 @@ export function PlatformTaskCompletionDialog({
   overlayClassName = 'platform-theme platform-theme--light !items-center',
   panelClassName = 'platform-remap-surface rounded-[1.5rem]',
 }: PlatformTaskCompletionDialogProps) {
-  const [copyState, setCopyState] = useState<'idle' | 'copied' | 'failed'>(
-    'idle',
-  );
-  const resetTimerRef = useRef<number | null>(null);
+  const { copyState, copyText, resetCopyState } = useCopyFeedback();
   const reportText = useMemo(
     () => (completion ? buildPlatformTaskCompletionReport(completion) : ''),
     [completion],
   );
 
-  useEffect(
-    () => () => {
-      if (resetTimerRef.current !== null) {
-        window.clearTimeout(resetTimerRef.current);
-      }
-    },
-    [],
-  );
-
   useEffect(() => {
-    setCopyState('idle');
-  }, [completion?.source, completion?.message]);
+    resetCopyState();
+  }, [completion?.source, completion?.message, resetCopyState]);
 
   const copyCompletion = () => {
     if (!reportText) {
       return;
     }
 
-    void copyTextToClipboard(reportText).then((copied) => {
-      setCopyState(copied ? 'copied' : 'failed');
-      if (resetTimerRef.current !== null) {
-        window.clearTimeout(resetTimerRef.current);
-      }
-      resetTimerRef.current = window.setTimeout(() => {
-        resetTimerRef.current = null;
-        setCopyState('idle');
-      }, 1400);
-    });
+    void copyText(reportText);
   };
 
   return (
@@ -80,43 +60,25 @@ export function PlatformTaskCompletionDialog({
       bodyClassName="space-y-3 px-4 py-4 sm:px-5 sm:py-5"
       footerClassName="justify-end px-4 py-4 sm:px-5"
       footer={
-        <button
-          type="button"
+        <CopyFeedbackButton
+          state={copyState}
           onClick={copyCompletion}
           disabled={!reportText}
-          className="platform-button platform-button--primary w-full justify-center gap-2 sm:w-auto"
-        >
-          {copyState === 'copied' ? (
-            <CheckCircle2 className="h-4 w-4" />
-          ) : (
-            <Copy className="h-4 w-4" />
-          )}
-          {copyState === 'copied'
-            ? '已复制'
-            : copyState === 'failed'
-              ? '复制失败'
-              : '复制内容'}
-        </button>
+          idleLabel="复制内容"
+          actionSurface="platform"
+          actionFullWidth
+          className="sm:w-auto"
+        />
       }
     >
       {completion ? (
         <>
-          <div className="rounded-[1rem] border border-[var(--platform-subpanel-border)] bg-white/72 px-3 py-2">
-            <div className="text-xs font-bold text-[var(--platform-text-soft)]">
-              来源
-            </div>
-            <div className="mt-1 break-words text-sm font-semibold leading-5 text-[var(--platform-text-strong)]">
-              {completion.source}
-            </div>
-          </div>
-          <div className="rounded-[1rem] border border-[var(--platform-subpanel-border)] bg-white/72 px-3 py-2">
-            <div className="text-xs font-bold text-[var(--platform-text-soft)]">
-              状态
-            </div>
-            <div className="mt-1 whitespace-pre-wrap break-words text-sm leading-6 text-[var(--platform-text-strong)]">
-              {completion.message}
-            </div>
-          </div>
+          <PlatformInfoBlock label="来源">
+            {completion.source}
+          </PlatformInfoBlock>
+          <PlatformInfoBlock label="状态" multiline>
+            {completion.message}
+          </PlatformInfoBlock>
         </>
       ) : null}
     </UnifiedModal>