fix: harden real backend workflows and channel connections

src/components/ui/FileActions.tsx

@@ -0,0 +1,34 @@
+import { Download, Eye } from 'lucide-react';
+import { fileDownloadUrl, type FileRef } from '@/api/adminApi';
+import { Button } from './Button';
+
+type FileActionsProps = {
+  file?: FileRef | null;
+};
+
+function isImageFile(file: FileRef) {
+  const contentType = file.contentType?.toLowerCase() ?? '';
+  const name = file.fileName.toLowerCase();
+  return contentType.startsWith('image/') || /\.(png|jpe?g|gif|webp|bmp|svg)$/.test(name);
+}
+
+export function FileActions({ file }: FileActionsProps) {
+  if (!file?.fileObjectId) {
+    return null;
+  }
+  const previewUrl = fileDownloadUrl(file.fileObjectId, 'inline');
+  const downloadUrl = fileDownloadUrl(file.fileObjectId, 'attachment');
+  return (
+    <span className="file-actions" onClick={(event) => event.stopPropagation()}>
+      {isImageFile(file) ? (
+        <Button icon={<Eye size={14} />} onClick={() => window.open(previewUrl, '_blank', 'noopener,noreferrer')} size="sm" variant="ghost">
+          预览
+        </Button>
+      ) : null}
+      <a className="file-action-link" href={downloadUrl}>
+        <Download size={14} />
+        下载
+      </a>
+    </span>
+  );
+}

src/components/ui/index.ts

@@ -4,6 +4,7 @@ export { Chart } from './Chart';
 export { DateRangeInput } from './DateRangeInput';
 export { DateTimeInput } from './DateTimeInput';
 export { DetailInfoGrid, DetailProgressStats, DetailSection, DetailTitle, getRateTone, ProgressBar, RateCard, RateOverview } from './Detail';
+export { FileActions } from './FileActions';
 export { Input } from './Input';
 export { Modal } from './Modal';
 export { InlineTextPreview, Pagination, QueryPanel } from './PagePrimitives';