Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
3.1 kB · 114 lines
TypeScript
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115import { useCallback } from "react";import { useReplicache } from "src/replicache";import { generateKeyBetween } from "fractional-indexing";import { addImage } from "src/utils/addImage";import { useEntitySetContext } from "components/EntitySetProvider";import { v7 } from "uuid";import { addGalleryImages } from "./ImageGalleryBlock/addGalleryImages";
export const useHandleDrop = (params: { parent: string; position: string | null; nextPosition: string | null; galleryEntity?: string;}) => { let { rep, undoManager } = useReplicache(); let entity_set = useEntitySetContext();
return useCallback( async (e: React.DragEvent) => { e.preventDefault(); e.stopPropagation();
if (!rep) return;
const files = e.dataTransfer.files; if (!files || files.length === 0) return;
// Filter for image files only const imageFiles = Array.from(files).filter((file) => file.type.startsWith("image/"), );
if (imageFiles.length === 0) return;
if (params.galleryEntity) { await addGalleryImages(rep, { galleryEntity: params.galleryEntity, permission_set: entity_set.set, files: imageFiles, }); return true; }
if (imageFiles.length > 1) { let galleryEntity = v7(); await undoManager.withUndoGroup(() => rep.mutate.addBlock({ parent: params.parent, factID: v7(), permission_set: entity_set.set, type: "image-gallery", position: generateKeyBetween(params.position, params.nextPosition), newEntityID: galleryEntity, }), ); await addGalleryImages(rep, { galleryEntity, permission_set: entity_set.set, files: imageFiles, }); return true; }
let currentPosition = params.position;
const imageBlocks = imageFiles.map((file) => { const entity = v7(); const position = generateKeyBetween( currentPosition, params.nextPosition, ); currentPosition = position; return { file, entity, position }; });
await undoManager.withUndoGroup(async () => { // Create all blocks in parallel await Promise.all( imageBlocks.map((block) => rep.mutate.addBlock({ parent: params.parent, factID: v7(), permission_set: entity_set.set, type: "image", position: block.position, newEntityID: block.entity, }), ), );
// Upload all images in parallel await Promise.all( imageBlocks.map((block) => addImage(block.file, rep, { entityID: block.entity, attribute: "block/image", }), ), ); });
return true; }, [ rep, params.position, params.nextPosition, params.parent, params.galleryEntity, entity_set.set, undoManager, ], );};