@promptbook/cli 0.113.0-1 → 0.113.0-10

package/src/book-components/BookEditor/useBookEditorMonacoUploads/useBookEditorMonacoUploadEditorSync.ts

@@ -0,0 +1,164 @@
+import type { editor } from 'monaco-editor';
+import { useCallback, useRef, type MutableRefObject } from 'react';
+import { BookEditorMonacoConstants } from '../BookEditorMonacoConstants';
+import type { UploadDecorationIdsRef, UploadFilesRef, UploadPlaceholderEntry } from './bookEditorMonacoUploadTypes';
+import { clearScheduledTimer } from './clearScheduledTimer';
+
+/**
+ * Type describing upload replacement.
+ *
+ * @private function of BookEditorMonaco
+ */
+type UploadReplacement = {
+    readonly uploadId: string;
+    readonly decorationId: string;
+    readonly replacementText: string;
+};
+
+/**
+ * Props for Monaco placeholder and replacement synchronization.
+ *
+ * @private function of BookEditorMonaco
+ */
+type UseBookEditorMonacoUploadEditorSyncProps = {
+    readonly editor: editor.IStandaloneCodeEditor | null;
+    readonly uploadFilesRef: UploadFilesRef;
+    readonly uploadDecorationIdsRef: UploadDecorationIdsRef;
+};
+
+/**
+ * Enqueues replacement text for one upload placeholder.
+ *
+ * @private function of BookEditorMonaco
+ */
+function queueEditorReplacementItem(
+    uploadId: string,
+    replacementText: string,
+    uploadDecorationIdsRef: UploadDecorationIdsRef,
+    pendingReplacementsRef: MutableRefObject<UploadReplacement[]>,
+): boolean {
+    const decorationId = uploadDecorationIdsRef.current.get(uploadId);
+    if (!decorationId) {
+        return false;
+    }
+
+    const pendingIndex = pendingReplacementsRef.current.findIndex((item) => item.uploadId === uploadId);
+    const nextReplacement: UploadReplacement = {
+        uploadId,
+        decorationId,
+        replacementText,
+    };
+
+    if (pendingIndex >= 0) {
+        pendingReplacementsRef.current[pendingIndex] = nextReplacement;
+    } else {
+        pendingReplacementsRef.current.push(nextReplacement);
+    }
+
+    return true;
+}
+
+/**
+ * Manages Monaco placeholder insertion and later replacement with uploaded URLs.
+ *
+ * @private function of BookEditorMonaco
+ */
+export function useBookEditorMonacoUploadEditorSync({
+    editor,
+    uploadFilesRef,
+    uploadDecorationIdsRef,
+}: UseBookEditorMonacoUploadEditorSyncProps) {
+    const editorUpdateTimerRef = useRef<number | null>(null);
+    const pendingReplacementsRef = useRef<UploadReplacement[]>([]);
+
+    const flushEditorReplacements = useCallback(() => {
+        if (!editor) {
+            return;
+        }
+
+        const model = editor.getModel();
+        if (!model) {
+            return;
+        }
+
+        const replacements = pendingReplacementsRef.current;
+        pendingReplacementsRef.current = [];
+
+        const edits: editor.IIdentifiedSingleEditOperation[] = [];
+        const decorationsToRemove: string[] = [];
+
+        for (const replacement of replacements) {
+            const range = model.getDecorationRange(replacement.decorationId);
+            if (!range) {
+                uploadDecorationIdsRef.current.delete(replacement.uploadId);
+                continue;
+            }
+
+            edits.push({
+                range,
+                text: replacement.replacementText,
+                forceMoveMarkers: true,
+            });
+            decorationsToRemove.push(replacement.decorationId);
+            uploadDecorationIdsRef.current.delete(replacement.uploadId);
+        }
+
+        if (edits.length > 0) {
+            editor.executeEdits('upload-replacements', edits);
+        }
+
+        if (decorationsToRemove.length > 0) {
+            editor.deltaDecorations(decorationsToRemove, []);
+        }
+    }, [editor]);
+
+    const registerUploadPlaceholderResources = useCallback(
+        (placeholders: ReadonlyArray<UploadPlaceholderEntry>, decorationIds: ReadonlyArray<string>) => {
+            placeholders.forEach((placeholder, index) => {
+                uploadFilesRef.current.set(placeholder.id, placeholder.file);
+
+                const decorationId = decorationIds[index];
+                if (decorationId) {
+                    uploadDecorationIdsRef.current.set(placeholder.id, decorationId);
+                }
+            });
+        },
+        [],
+    );
+
+    const queueEditorReplacement = useCallback(
+        (uploadId: string, replacementText: string) => {
+            const hasQueuedReplacement = queueEditorReplacementItem(
+                uploadId,
+                replacementText,
+                uploadDecorationIdsRef,
+                pendingReplacementsRef,
+            );
+            if (!hasQueuedReplacement) {
+                return;
+            }
+
+            if (editorUpdateTimerRef.current !== null) {
+                return;
+            }
+
+            editorUpdateTimerRef.current = window.setTimeout(() => {
+                editorUpdateTimerRef.current = null;
+                flushEditorReplacements();
+            }, BookEditorMonacoConstants.UPLOAD_EDIT_DEBOUNCE_MS);
+        },
+        [flushEditorReplacements, uploadDecorationIdsRef],
+    );
+
+    const clearEditorSync = useCallback(() => {
+        clearScheduledTimer(editorUpdateTimerRef.current);
+        editorUpdateTimerRef.current = null;
+        pendingReplacementsRef.current = [];
+    }, []);
+
+    return {
+        registerUploadPlaceholderResources,
+        queueEditorReplacement,
+        clearEditorSync,
+    };
+}

package/src/book-components/BookEditor/useBookEditorMonacoUploads/useBookEditorMonacoUploadItemsState.ts

@@ -0,0 +1,121 @@
+import { useCallback, useMemo, useRef, useState } from 'react';
+import type { SetUploadItems, UpdateUploadItem, UploadItem, UploadStats } from './bookEditorMonacoUploadTypes';
+
+/**
+ * Updates one upload item while leaving every other item untouched.
+ *
+ * @private function of BookEditorMonaco
+ */
+export function replaceUploadItemById(
+    uploadItems: ReadonlyArray<UploadItem>,
+    uploadId: string,
+    updateUploadItem: (uploadItem: UploadItem) => UploadItem,
+): Array<UploadItem> {
+    return uploadItems.map((uploadItem) => (uploadItem.id === uploadId ? updateUploadItem(uploadItem) : uploadItem));
+}
+
+/**
+ * Aggregates upload status, throughput and elapsed time for the upload panel.
+ *
+ * @private function of BookEditorMonaco
+ */
+function createUploadStats(uploadItems: ReadonlyArray<UploadItem>): UploadStats {
+    let queuedFiles = 0;
+    let uploadingFiles = 0;
+    let pausedFiles = 0;
+    let failedFiles = 0;
+    let completedFiles = 0;
+    let totalBytes = 0;
+    let uploadedBytes = 0;
+    let startedAt = Number.POSITIVE_INFINITY;
+
+    for (const uploadItem of uploadItems) {
+        switch (uploadItem.status) {
+            case 'queued':
+                queuedFiles += 1;
+                break;
+            case 'uploading':
+                uploadingFiles += 1;
+                break;
+            case 'paused':
+                pausedFiles += 1;
+                break;
+            case 'failed':
+                failedFiles += 1;
+                break;
+            case 'completed':
+                completedFiles += 1;
+                break;
+        }
+
+        totalBytes += uploadItem.totalBytes;
+
+        const normalizedTotalBytes = uploadItem.totalBytes || 0;
+        const normalizedLoadedBytes =
+            normalizedTotalBytes > 0 ? Math.min(uploadItem.loadedBytes, normalizedTotalBytes) : uploadItem.loadedBytes;
+        uploadedBytes += normalizedLoadedBytes;
+
+        if (uploadItem.startedAt) {
+            startedAt = Math.min(startedAt, uploadItem.startedAt);
+        }
+    }
+
+    const totalFiles = uploadItems.length;
+    const progress = totalBytes > 0 ? uploadedBytes / totalBytes : 0;
+    const elapsedMs = Number.isFinite(startedAt) ? Math.max(0, Date.now() - startedAt) : 0;
+    const speedBytesPerSecond = elapsedMs > 0 ? uploadedBytes / (elapsedMs / 1000) : 0;
+
+    return {
+        totalFiles,
+        queuedFiles,
+        uploadingFiles,
+        pausedFiles,
+        failedFiles,
+        completedFiles,
+        totalBytes,
+        uploadedBytes,
+        progress,
+        elapsedMs,
+        speedBytesPerSecond,
+    };
+}
+
+/**
+ * Internal upload item state shared by Monaco upload helpers.
+ *
+ * @private function of BookEditorMonaco
+ */
+export function useBookEditorMonacoUploadItemsState() {
+    const [uploadItems, setUploadItemsState] = useState<UploadItem[]>([]);
+    const uploadItemsRef = useRef<UploadItem[]>([]);
+
+    const setUploadItems = useCallback<SetUploadItems>((updater) => {
+        const next = updater(uploadItemsRef.current);
+        uploadItemsRef.current = next;
+        setUploadItemsState(next);
+    }, []);
+
+    const updateUploadItem = useCallback<UpdateUploadItem>(
+        (uploadId, createNextUploadItem) => {
+            setUploadItems((currentUploadItems) =>
+                replaceUploadItemById(currentUploadItems, uploadId, createNextUploadItem),
+            );
+        },
+        [setUploadItems],
+    );
+
+    const uploadStats = useMemo<UploadStats>(() => createUploadStats(uploadItems), [uploadItems]);
+    const activeUploadItems = useMemo(
+        () => uploadItems.filter((uploadItem) => uploadItem.status !== 'completed'),
+        [uploadItems],
+    );
+
+    return {
+        uploadItems,
+        uploadItemsRef,
+        setUploadItems,
+        updateUploadItem,
+        uploadStats,
+        activeUploadItems,
+    };
+}

package/src/book-components/BookEditor/useBookEditorMonacoUploads/useBookEditorMonacoUploadProgressQueue.ts

@@ -0,0 +1,81 @@
+import { useCallback, useRef } from 'react';
+import { BookEditorMonacoConstants } from '../BookEditorMonacoConstants';
+import type { SetUploadItems, UploadItem, UploadProgressUpdate } from './bookEditorMonacoUploadTypes';
+import { clearScheduledTimer } from './clearScheduledTimer';
+
+/**
+ * Applies debounced progress updates gathered between renders.
+ *
+ * @private function of BookEditorMonaco
+ */
+function applyProgressUpdates(
+    uploadItems: ReadonlyArray<UploadItem>,
+    progressUpdates: ReadonlyMap<string, UploadProgressUpdate>,
+): Array<UploadItem> {
+    return uploadItems.map((uploadItem) => {
+        const progressUpdate = progressUpdates.get(uploadItem.id);
+        if (!progressUpdate) {
+            return uploadItem;
+        }
+
+        return {
+            ...uploadItem,
+            progress: progressUpdate.progress,
+            loadedBytes: progressUpdate.loadedBytes,
+            totalBytes: progressUpdate.totalBytes,
+        };
+    });
+}
+
+/**
+ * Debounces upload progress updates before they hit React state.
+ *
+ * @private function of BookEditorMonaco
+ */
+export function useBookEditorMonacoUploadProgressQueue({
+    setUploadItems,
+}: {
+    readonly setUploadItems: SetUploadItems;
+}) {
+    const progressUpdateTimerRef = useRef<number | null>(null);
+    const pendingProgressUpdatesRef = useRef<Map<string, UploadProgressUpdate>>(new Map());
+
+    const flushProgressUpdates = useCallback(() => {
+        progressUpdateTimerRef.current = null;
+
+        const progressUpdates = pendingProgressUpdatesRef.current;
+        pendingProgressUpdatesRef.current = new Map();
+
+        setUploadItems((currentUploadItems) => applyProgressUpdates(currentUploadItems, progressUpdates));
+    }, [setUploadItems]);
+
+    const queueProgressUpdate = useCallback(
+        (uploadId: string, progress: number, loadedBytes: number, totalBytes: number) => {
+            pendingProgressUpdatesRef.current.set(uploadId, {
+                progress,
+                loadedBytes,
+                totalBytes,
+            });
+
+            if (progressUpdateTimerRef.current !== null) {
+                return;
+            }
+
+            progressUpdateTimerRef.current = window.setTimeout(() => {
+                flushProgressUpdates();
+            }, BookEditorMonacoConstants.UPLOAD_PROGRESS_DEBOUNCE_MS);
+        },
+        [flushProgressUpdates],
+    );
+
+    const clearProgressQueue = useCallback(() => {
+        clearScheduledTimer(progressUpdateTimerRef.current);
+        progressUpdateTimerRef.current = null;
+        pendingProgressUpdatesRef.current = new Map();
+    }, []);
+
+    return {
+        queueProgressUpdate,
+        clearProgressQueue,
+    };
+}