feat: Add preview_video for sights

src/widgets/SightTabs/CreateInformationTab/index.tsx

@@ -5,6 +5,10 @@ import {
   Autocomplete,
   MenuItem,
   Menu as MuiMenu,
+  Dialog,
+  DialogTitle,
+  DialogContent,
+  DialogActions,
 } from "@mui/material";
 import {
   BackButton,
@@ -20,7 +24,12 @@ import {
   UploadMediaDialog,
   MEDIA_TYPE_VALUES,
 } from "@shared";
-import { ImageUploadCard, LanguageSwitcher } from "@widgets";
+import {
+  ImageUploadCard,
+  LanguageSwitcher,
+  VideoPreviewCard,
+  MediaViewer,
+} from "@widgets";
 import { Save } from "lucide-react";
 
 import { observer } from "mobx-react-lite";
@@ -45,13 +54,15 @@ export const CreateInformationTab = observer(
     // Menu state for each media button
     const [menuAnchorEl, setMenuAnchorEl] = useState<null | HTMLElement>(null);
     const [activeMenuType, setActiveMenuType] = useState<
-      "thumbnail" | "watermark_lu" | "watermark_rd" | null
+      "thumbnail" | "watermark_lu" | "watermark_rd" | "video_preview" | null
     >(null);
     const [isAddMediaOpen, setIsAddMediaOpen] = useState(false);
+    const [isVideoPreviewOpen, setIsVideoPreviewOpen] = useState(false);
     const [hardcodeType, setHardcodeType] = useState<
-      "thumbnail" | "watermark_lu" | "watermark_rd" | null
+      "thumbnail" | "watermark_lu" | "watermark_rd" | "video_preview" | null
     >(null);
 
+    useEffect(() => {}, [hardcodeType]);
     // const handleMenuOpen = (
     //   event: React.MouseEvent<HTMLElement>,
     //   type: "thumbnail" | "watermark_lu" | "watermark_rd"
@@ -100,7 +111,7 @@ export const CreateInformationTab = observer(
         media_name?: string;
         media_type: number;
       },
-      type: "thumbnail" | "watermark_lu" | "watermark_rd"
+      type: "thumbnail" | "watermark_lu" | "watermark_rd" | "video_preview"
     ) => {
       handleChange({
         [type]: media.id,
@@ -108,6 +119,12 @@ export const CreateInformationTab = observer(
       setActiveMenuType(null);
     };
 
+    const handleVideoPreviewClick = () => {
+      if (sight.video_preview && sight.video_preview !== "") {
+        setIsVideoPreviewOpen(true);
+      }
+    };
+
     return (
       <>
         <TabPanel value={value} index={index}>
@@ -329,6 +346,29 @@ export const CreateInformationTab = observer(
                       setHardcodeType("watermark_rd");
                     }}
                   />
+
+                  <VideoPreviewCard
+                    title="Видео превью"
+                    videoId={sight.video_preview}
+                    onVideoClick={handleVideoPreviewClick}
+                    onDeleteVideoClick={() => {
+                      handleChange({
+                        video_preview: null,
+                      });
+                    }}
+                    onSelectVideoClick={(file) => {
+                      if (file) {
+                        // Если передан файл, открываем диалог загрузки медиа
+                        createSightStore.setFileToUpload(file);
+                        setActiveMenuType("video_preview");
+                        setIsUploadMediaOpen(true);
+                      } else {
+                        // Если файл не передан, открываем диалог выбора существующих медиа
+                        setActiveMenuType("video_preview");
+                        setIsAddMediaOpen(true);
+                      }
+                    }}
+                  />
                 </Box>
               </Box>
             </Box>
@@ -390,7 +430,9 @@ export const CreateInformationTab = observer(
             setActiveMenuType(null);
           }}
           onSelectMedia={(media) => {
-            handleMediaSelect(media, activeMenuType ?? "thumbnail");
+            if (activeMenuType) {
+              handleMediaSelect(media, activeMenuType);
+            }
           }}
           mediaType={
             activeMenuType
@@ -413,14 +455,49 @@ export const CreateInformationTab = observer(
           contextObjectName={sight[language].name}
           contextType="sight"
           afterUpload={(media) => {
-            handleChange({
-              [activeMenuType ?? "thumbnail"]: media.id,
-            });
+            if (activeMenuType === "video_preview") {
+              handleChange({
+                video_preview: media.id,
+              });
+            } else {
+              handleChange({
+                [activeMenuType ?? "thumbnail"]: media.id,
+              });
+            }
             setActiveMenuType(null);
             setIsUploadMediaOpen(false);
           }}
-          hardcodeType={hardcodeType}
+          hardcodeType={activeMenuType}
+          initialFile={createSightStore.fileToUpload || undefined}
         />
+
+        {/* Модальное окно предпросмотра видео */}
+        {sight.video_preview && sight.video_preview !== "" && (
+          <Dialog
+            open={isVideoPreviewOpen}
+            onClose={() => setIsVideoPreviewOpen(false)}
+            maxWidth="md"
+            fullWidth
+          >
+            <DialogTitle>Предпросмотр видео</DialogTitle>
+            <DialogContent>
+              <Box className="flex justify-center items-center p-4">
+                <MediaViewer
+                  media={{
+                    id: sight.video_preview,
+                    media_type: 2,
+                    filename: "video_preview",
+                  }}
+                />
+              </Box>
+            </DialogContent>
+            <DialogActions>
+              <Button onClick={() => setIsVideoPreviewOpen(false)}>
+                Закрыть
+              </Button>
+            </DialogActions>
+          </Dialog>
+        )}
       </>
     );
   }