VideoIcon 提取到外面

dashboard/src/components/template/Wbw/WbwPali.tsx

@@ -10,7 +10,7 @@ import {
 
 import "./wbw.css";
 import WbwDetail from "./WbwDetail";
-import { IWbw, TWbwDisplayMode } from "./WbwWord";
+import { IWbw, IWbwAttachment, TWbwDisplayMode } from "./WbwWord";
 import { bookMarkColor } from "./WbwDetailBookMark";
 import WbwVideoButton from "./WbwVideoButton";
 import CommentBox from "../../discussion/DiscussionDrawer";
@@ -24,6 +24,29 @@ import { anchor, showWbw } from "../../../reducers/wbw";
 import { CommentOutlinedIcon } from "../../../assets/icon";
 import { ParaLinkCtl } from "../ParaLink";
 
+//生成视频播放按钮
+interface IVideoIcon {
+  attachments?: IWbwAttachment[];
+}
+const VideoIcon = ({ attachments }: IVideoIcon) => {
+  const videoList = attachments?.filter((item) =>
+    item.content_type?.includes("video")
+  );
+  return videoList ? (
+    <WbwVideoButton
+      video={videoList?.map((item) => {
+        return {
+          videoId: item.id,
+          type: item.content_type,
+          title: item.title,
+        };
+      })}
+    />
+  ) : (
+    <></>
+  );
+};
+
 const { Paragraph } = Typography;
 interface IWidget {
   data: IWbw;
@@ -189,26 +212,6 @@ const WbwPaliWidget = ({ data, channelId, mode, display, onSave }: IWidget) => {
     ? bookMarkColor[data.bookMarkColor.value]
     : "white";
 
-  //生成视频播放按钮
-  const VideoIcon = () => {
-    const videoList = data.attachments?.filter((item) =>
-      item.content_type?.includes("video")
-    );
-    return videoList ? (
-      <WbwVideoButton
-        video={videoList?.map((item) => {
-          return {
-            videoId: item.id,
-            type: item.content_type,
-            title: item.title,
-          };
-        })}
-      />
-    ) : (
-      <></>
-    );
-  };
-
   const RelationIcon = () => {
     return data.relation ? (
       <ApartmentOutlined style={{ color: "blue" }} />
@@ -375,7 +378,7 @@ const WbwPaliWidget = ({ data, channelId, mode, display, onSave }: IWidget) => {
           </Popover>
         </span>
         <Space>
-          <VideoIcon />
+          <VideoIcon attachments={data.attachments} />
           <NoteIcon />
           <BookMarkIcon />
           <RelationIcon />