Module API for adding new file upload mechanisms (#33355)

* Initial reword of upload to MVVM. * Update tests * More incremental improvements * Refactor tests to use helper method for composer uploads. * Add drag and drop tests * lint * Add commentary * fixup test * More precise selector * Retarget uploads * lint * fixup * one more type * update snap * Fixup composerUploadFiles * fix import * lint * Copy and paste fixes too * Add tests for pasting * Add tests for pasting files. * Remove redundant fn * rm comment * tidy up * Test cleanup * More clean up * another fix * Begin fleshing out * Park changes * More stuff * Use condensed version * Cleanup tests * more cleaning * last bity * Add a test for the composer * Park up changes * Rewrite Measured to be a functional component * Add tests to cover narrow viewports * lint * breakpoint is optional * Cleanup * Support narrow mode * fixup * begone * Provide default value * add label * fixup test * update copyright * cleanup * Be a bit more lazy with FileDropTarget * remove a debug statement * Fixup * fix two snaps * Update screenshot * and the other one * Update snaps * unfake CIDER * update screens again * remove extra test * Undo accidental snapshots * Bit of tidyup * fixup * even more tidyup * may drag and drop file * tidy up again * snap snap snap * Use load to make sonarQube happy * Bunch of refactors * More cleanup * cleanup debug code * tweaks * remove a test we no longer need * make it happy * fix import * fixup * Update snaps * typo * one off * Add tests * lint * remove only * Reduce screenshot scope * fix snapshot usage * cleanup
2026-05-18 21:41:38 +00:00
parent 66b739fea9
commit 02b6520f09
30 changed files with 1627 additions and 831 deletions
@@ -29,10 +29,10 @@ const FileDropTarget: React.FC<IProps> = ({ parent }) => {
        counter: 0,
    });
    const vm = useRoomUploadViewModel();
-    const { mayUpload } = useViewModel(vm);
+    const { mayDragAndDropFile } = useViewModel(vm);

    useEffect(() => {
-        if (!mayUpload || !parent || parent.ondrop) return;
+        if (!mayDragAndDropFile || !parent || parent.ondrop) return;

        const onDragEnter = (ev: DragEvent): void => {
            ev.stopPropagation();
@@ -106,9 +106,9 @@ const FileDropTarget: React.FC<IProps> = ({ parent }) => {
            parent?.removeEventListener("dragenter", onDragEnter);
            parent?.removeEventListener("dragleave", onDragLeave);
        };
-    }, [parent, mayUpload, vm]);
+    }, [parent, mayDragAndDropFile, vm]);

-    if (mayUpload && state.dragging) {
+    if (mayDragAndDropFile && state.dragging) {
        return (
            <div className="mx_FileDropTarget">
                <img src={UploadBigSvg} className="mx_FileDropTarget_image" alt="" />
@@ -1299,7 +1299,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
                const composerInsertPayload = payload as ComposerInsertPayload;
                if (composerInsertPayload.composerType) break;

-                let timelineRenderingType: TimelineRenderingType | undefined;
+                let timelineRenderingType = composerInsertPayload.timelineRenderingType;
                // ThreadView handles Action.ComposerInsert itself due to it having its own editState
                if (composerInsertPayload.timelineRenderingType === TimelineRenderingType.Thread) break;
                if (
@@ -1311,12 +1311,6 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
                    timelineRenderingType = TimelineRenderingType.Room;
                }

-                // If the dispatchee didn't request a timeline rendering type, use the current one.
-                timelineRenderingType =
-                    timelineRenderingType ??
-                    composerInsertPayload.timelineRenderingType ??
-                    this.state.timelineRenderingType;
-
                // re-dispatch to the correct composer
                defaultDispatcher.dispatch<ComposerInsertPayload>({
                    ...composerInsertPayload,