finished most of the popup for file details and media

src/components/MainSection/index.tsx

@@ -9,6 +9,7 @@ import { useUtils } from "../../hooks/utils";
 import Medias from "../Medias";
 import { useAppSelector } from "../../hooks/store";
 import PhotoViewerPopup from "../PhotoViewerPopup";
+import FileInfoPopup from "../FileInfoPopup";
 
 const MainSection = memo(() => {
   const moverID = useAppSelector((state) => state.mover.id);
@@ -25,6 +26,12 @@ const MainSection = memo(() => {
           <PhotoViewerPopup />
         ) : undefined}
 
+        {selectedItem?.file &&
+        !selectedItem.file.metadata.isVideo &&
+        !selectedItem.file.metadata.hasThumbnail ? (
+          <FileInfoPopup />
+        ) : undefined}
+
         {moverID.length === 0 ? undefined : <MoverMenu />}
 
         <div className="flex flex-row h-screen w-screen pt-16">