diff --git a/frontend/apps/editor3d/app/src/components/reusable/UploadModalMedia/uploadPlane.ts b/frontend/apps/editor3d/app/src/components/reusable/UploadModalMedia/uploadPlane.ts index 0a51534c44..8e082c2270 100644 --- a/frontend/apps/editor3d/app/src/components/reusable/UploadModalMedia/uploadPlane.ts +++ b/frontend/apps/editor3d/app/src/components/reusable/UploadModalMedia/uploadPlane.ts @@ -122,3 +122,53 @@ const takeVideoSnapshot = async ( return blob; }; + +export const uploadPlaneFromMediaToken = async ({ + title, + mediaToken, + progressCallback, +}: { + title: string; + mediaToken: string; + progressCallback: (newState: UploaderState) => void; +}) => { + // Step 1: Set uploading state (simulate asset upload) + progressCallback({ status: UploaderStates.uploadingAsset }); + + // Step 2: Fetch the media file info (to get type, etc.) + const mediaFilesApi = new MediaFilesApi(); + const mediaFileResponse = await mediaFilesApi.GetMediaFileByToken({ + mediaFileToken: mediaToken, + }); + if (!mediaFileResponse.success || !mediaFileResponse.data) { + progressCallback({ + status: UploaderStates.assetError, + errorMessage: + mediaFileResponse.errorMessage || + "Could not fetch media file by token.", + }); + return; + } + + // Step 3: Optionally set the title (rename) + if (title && mediaFileResponse.data.maybe_title !== title) { + const renameResponse = await mediaFilesApi.RenameMediaFileByToken({ + mediaToken, + name: title, + }); + if (!renameResponse.success) { + progressCallback({ + status: UploaderStates.assetError, + errorMessage: + renameResponse.errorMessage || "Could not rename media file.", + }); + return; + } + } + + // Step 4: (Optional) Set cover image if needed (skip if already set) + // For simplicity, we skip cover image upload here, but you could add logic to set a cover if needed. + + // Step 5: Success + progressCallback({ status: UploaderStates.success }); +}; diff --git a/frontend/apps/editor3d/app/src/pages/PageEnigma/PageEditor.tsx b/frontend/apps/editor3d/app/src/pages/PageEnigma/PageEditor.tsx index 8ad078eb3f..6eef0f1cdd 100644 --- a/frontend/apps/editor3d/app/src/pages/PageEnigma/PageEditor.tsx +++ b/frontend/apps/editor3d/app/src/pages/PageEnigma/PageEditor.tsx @@ -55,12 +55,13 @@ import { topNavMediaUrl, } from "~/components/signaled/TopBar/TopBar"; import { setOnImageDrop } from "../../../../../../libs/components/gallery-modal/src/lib/galleryDnd"; -import { uploadPlane } from "~/components/reusable/UploadModalMedia/uploadPlane"; +import { uploadPlaneFromMediaToken } from "~/components/reusable/UploadModalMedia/uploadPlane"; import { addObject } from "./signals/objectGroup/addObject"; import { AssetType } from "~/enums"; import { v4 as uuidv4 } from "uuid"; import { MediaItem } from "~/pages/PageEnigma/models"; import { GalleryItem } from "../../../../../../libs/components/gallery-modal/src/lib/gallery-modal"; +import { UploaderState } from "~/models"; export const PageEditor = () => { useSignals(); @@ -82,24 +83,10 @@ export const PageEditor = () => { async (item: GalleryItem, _position: { x: number; y: number }) => { console.log("Gallery image dropped", item, _position); try { - // Fetch the image (prefer fullImage, fallback to thumbnail) - const url = item.fullImage || item.thumbnail; - if (!url) { - console.warn("No image URL found for dropped item", item); - return; - } - console.log("Fetching image from URL:", url); - const response = await fetch(url); - const blob = await response.blob(); - const file = new File([blob], item.label || "image.png", { - type: blob.type, - }); - console.log("Image file created:", file); - // Upload the image as a plane - await uploadPlane({ + await uploadPlaneFromMediaToken({ title: item.label || "Image Plane", - assetFile: file, - progressCallback: (state) => { + mediaToken: item.id, + progressCallback: (state: UploaderState) => { if (state.status) console.log("Upload status:", state.status); }, });