@yogiswara/honcho-editor-ui 3.4.3 → 3.4.5

package/dist/hooks/editor/type.d.ts

@@ -1,3 +1,4 @@
+import { AdjustmentValues } from "../../lib/editor/honcho-editor";
 interface Log {
     created_at: string;
     updated_at: string;
@@ -59,10 +60,11 @@ export interface GallerySetup {
     sizes?: string | string[] | undefined;
     width: number;
     height: number;
-    alt: string | undefined;
-    key: string | undefined;
-    frame?: string | undefined;
+    alt: string;
+    key: string;
+    frame?: string | null;
     isSelected?: boolean | undefined;
+    adjustments?: Partial<AdjustmentValues>;
 }
 export interface Gallery {
     id: string;

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export { useHonchoEditorSingle } from './hooks/editor/useHonchoEditorSingle';
 export { useHonchoEditorBulk } from './hooks/editor/useHonchoEditorBulk';
+export { log } from './utils/logger';
 export type { Controller, AdjustmentState, Preset, ImageItem, ColorAdjustment, CreateEditorTaskRequest, EditorHistoryEntry, GetGalleryUpdateTimestampResponse, GetHistoryResponse, EditorConfig, GallerySetup, ResponseGalleryPaging, Gallery, Content } from './hooks/editor/type';
 export type { PhotoData } from './hooks/editor/useHonchoEditorBulk';
 export { default as AlbumImageGalleryInfinite } from './components/editor/GalleryAlbum/AlbumImageGallery';

package/dist/index.js

@@ -4,6 +4,7 @@
 // END
 export { useHonchoEditorSingle } from './hooks/editor/useHonchoEditorSingle';
 export { useHonchoEditorBulk } from './hooks/editor/useHonchoEditorBulk';
+export { log } from './utils/logger';
 export { default as AlbumImageGalleryInfinite } from './components/editor/GalleryAlbum/AlbumImageGallery';
 export { default as ImageItemComponents } from './components/editor/GalleryAlbum/ImageItemComponents';
 export { partialAdjustmentStateToAdjustmentState, mapAdjustmentStateToAdjustmentEditor, mapColorAdjustmentToAdjustmentState, mapAdjustmentStateToColorAdjustment } from './utils/adjustment';

package/dist/lib/context/EditorProcessingService.d.ts

@@ -1,11 +1,13 @@
 import type { AdjustmentValues } from '../editor/honcho-editor';
+export declare class TaskReplacedError extends Error {
+    constructor(taskId: string);
+}
 export interface EditorTask {
     id: string;
     path: string;
     frame: string | null;
     adjustments?: Partial<AdjustmentValues>;
     priority?: number;
-    abortSignal?: AbortSignal;
 }
 export interface EditorResponse {
     id: string;
@@ -14,6 +16,7 @@ export interface EditorResponse {
 export declare class EditorProcessingService {
     private processingQueue;
     private isProcessing;
+    private currentProcessingTaskId?;
     private processImage?;
     private pendingProcessingTimeout?;
     private statusChangeListeners;
@@ -25,10 +28,10 @@ export declare class EditorProcessingService {
     requestProcessing(task: EditorTask): Promise<EditorResponse>;
     private scheduleProcessing;
     private processQueue;
-    private removeFromQueue;
     getQueueStatus(): {
         queueLength: number;
         isProcessing: boolean;
+        currentProcessingTaskId: string | undefined;
         hasProcessor: boolean;
     };
     clearQueue(): void;

package/dist/lib/context/EditorProcessingService.js

@@ -1,3 +1,10 @@
+import { log } from '../../utils/logger';
+export class TaskReplacedError extends Error {
+    constructor(taskId) {
+        super(`Task ${taskId} was replaced by a newer request`);
+        this.name = 'TaskReplacedError';
+    }
+}
 // Simple priority queue implementation using binary heap
 class PriorityQueue {
     constructor() {
@@ -25,24 +32,53 @@ class PriorityQueue {
     clear() {
         return this.heap.splice(0);
     }
-    // Remove item by ID (for cancellation)
+    // Find and remove an existing task by ID and priority - O(n)
+    removeByIdAndPriority(id, priority) {
+        const index = this.heap.findIndex(item => item.id === id && (item.priority || 0) === priority);
+        if (index === -1)
+            return undefined;
+        const removedItem = this.heap[index];
+        // If it's the last item, just pop it
+        if (index === this.heap.length - 1) {
+            this.heap.pop();
+            return removedItem;
+        }
+        // Replace with last item and restore heap property
+        this.heap[index] = this.heap.pop();
+        // Restore heap property by bubbling up or down as needed
+        this.heapifyUp(index);
+        this.heapifyDown(index);
+        return removedItem;
+    }
+    // Find and remove an existing task by ID - O(n)
     removeById(id) {
         const index = this.heap.findIndex(item => item.id === id);
         if (index === -1)
-            return false;
-        // Replace with last element and heapify
-        const removed = this.heap[index];
+            return undefined;
+        const removedItem = this.heap[index];
+        // If it's the last item, just pop it
         if (index === this.heap.length - 1) {
             this.heap.pop();
+            return removedItem;
         }
-        else {
-            this.heap[index] = this.heap.pop();
-            // Re-heapify from this position
-            this.heapifyDown(index);
-            this.heapifyUp(index);
-        }
-        console.debug(`Removed task ${id} from queue`);
-        return true;
+        // Replace with last item and restore heap property
+        this.heap[index] = this.heap.pop();
+        // Restore heap property by bubbling up or down as needed
+        this.heapifyUp(index);
+        this.heapifyDown(index);
+        return removedItem;
+    }
+    // Check if a task with the given ID exists in the queue
+    hasId(id) {
+        return this.heap.some(item => item.id === id);
+    }
+    // Find an existing task by ID and priority without removing it - O(n)
+    findByIdAndPriority(id, priority) {
+        return this.heap.find(item => item.id === id && (item.priority || 0) === priority);
+    }
+    // Find an existing task by ID without removing it - O(n)
+    findById(id) {
+        return this.heap.find(item => item.id === id);
     }
     heapifyUp(index) {
         while (index > 0) {
@@ -83,12 +119,12 @@ export class EditorProcessingService {
         this.processingQueue = new PriorityQueue();
         this.isProcessing = false;
         this.statusChangeListeners = [];
-        console.debug('EditorProcessingService created');
+        log.debug('EditorProcessingService created');
     }
     // Set the processing function from the editor
     setProcessor(processImage) {
         this.processImage = processImage;
-        console.debug('Editor processor set, queue length:', this.processingQueue.length);
+        log.debug({ queueLength: this.processingQueue.length }, 'Editor processor set');
         // Start processing if there are queued items
         if (this.processingQueue.length > 0) {
             this.scheduleProcessing();
@@ -112,38 +148,59 @@ export class EditorProcessingService {
     // Add task to processing queue
     async requestProcessing(task) {
         return new Promise((resolve, reject) => {
-            // Check if already aborted before adding to queue
-            if (task.abortSignal?.aborted) {
-                console.debug(`Task ${task.id} already aborted, not adding to queue`);
-                reject(new Error('Task aborted before processing'));
-                return;
-            }
             // Validate that we have a processor
             if (!this.processImage) {
-                console.warn('No processor available, rejecting task:', task.id);
+                log.warn({ taskId: task.id }, 'No processor available, rejecting task');
                 reject(new Error('Editor not ready - processor not set'));
                 return;
             }
+            // Check if we're currently processing this task with higher priority
+            if (this.currentProcessingTaskId === task.id && this.isProcessing) {
+                log.debug({ taskId: task.id }, 'Task already being processed - ignoring duplicate request');
+                reject(new Error('Task already being processed'));
+                return;
+            }
+            // Check if task already exists in queue with same priority level
+            const newPriority = task.priority || 0;
+            const existingTaskSamePriority = this.processingQueue.findByIdAndPriority(task.id, newPriority);
+            if (existingTaskSamePriority) {
+                // Only replace if same priority level
+                const isHighPriority = newPriority >= 10;
+                const isLowPriority = newPriority < 10;
+                if (isHighPriority || isLowPriority) {
+                    // Remove existing task with same priority and replace it
+                    this.processingQueue.removeByIdAndPriority(task.id, newPriority);
+                    log.debug({
+                        taskId: task.id,
+                        priority: newPriority,
+                        priorityLevel: isHighPriority ? 'high' : 'low'
+                    }, 'Replacing existing task with same priority level');
+                    existingTaskSamePriority.reject(new TaskReplacedError(task.id));
+                }
+            }
+            else {
+                // Different priority or no existing task - check if different priority exists
+                const existingTaskDifferentPriority = this.processingQueue.findById(task.id);
+                if (existingTaskDifferentPriority) {
+                    const existingPriority = existingTaskDifferentPriority.priority || 0;
+                    log.debug({
+                        taskId: task.id,
+                        existingPriority,
+                        newPriority
+                    }, 'Task with different priority already exists - queuing new task separately');
+                    // Don't reject, just queue the new task alongside the existing one
+                }
+            }
             const queueItem = {
                 ...task,
                 priority: task.priority || 0,
                 resolve,
                 reject,
                 timestamp: Date.now(),
-                abortSignal: task.abortSignal,
             };
-            // Set up abort listener to remove from queue if cancelled
-            if (task.abortSignal) {
-                const abortHandler = () => {
-                    console.debug(`Task ${task.id} aborted, removing from queue if still pending`);
-                    this.removeFromQueue(task.id);
-                    reject(new Error('Task aborted'));
-                };
-                task.abortSignal.addEventListener('abort', abortHandler, { once: true });
-            }
             // Add to priority queue - O(log n)
             this.processingQueue.enqueue(queueItem);
-            console.debug(`Added task ${task.id} to queue. Queue length: ${this.processingQueue.length}`);
+            log.debug({ taskId: task.id, queueLength: this.processingQueue.length }, 'Added task to queue');
             // Notify status change
             this.notifyStatusChange();
             // Schedule processing with debouncing
@@ -166,35 +223,27 @@ export class EditorProcessingService {
         }
         this.isProcessing = true;
         this.notifyStatusChange();
-        console.debug('Starting queue processing...');
+        log.debug({ queueLength: this.processingQueue.length }, 'Starting queue processing');
         while (this.processingQueue.length > 0) {
             // Get highest priority item - O(log n) vs O(n log n) sorting
             const item = this.processingQueue.dequeue();
-            // Check if the item was aborted before processing
-            if (item.abortSignal?.aborted) {
-                console.debug(`Skipping aborted task ${item.id}`);
-                item.reject(new Error('Task aborted'));
-                continue;
-            }
-            console.debug(`Processing task ${item.id} (priority: ${item.priority || 0}, queue remaining: ${this.processingQueue.length})`);
+            this.currentProcessingTaskId = item.id; // Track currently processing task
+            log.debug({
+                taskId: item.id,
+                priority: item.priority || 0,
+                queueRemaining: this.processingQueue.length
+            }, 'Processing task');
             try {
-                // Check abort signal again before actual processing
-                if (item.abortSignal?.aborted) {
-                    throw new Error('Task aborted during processing');
-                }
                 const result = await this.processImage(item);
-                // Final check before resolving
-                if (!item.abortSignal?.aborted) {
-                    item.resolve(result);
-                }
-                else {
-                    item.reject(new Error('Task aborted after processing'));
-                }
+                item.resolve(result);
             }
             catch (error) {
-                console.error(`Failed to process task ${item.id}:`, error);
+                log.error({ taskId: item.id, error }, 'Failed to process task');
                 item.reject(error instanceof Error ? error : new Error(String(error)));
             }
+            finally {
+                this.currentProcessingTaskId = undefined; // Clear tracking when done
+            }
             // Yield control to browser for UI updates - more efficient than setTimeout
             await new Promise(resolve => {
                 if (typeof requestIdleCallback !== 'undefined') {
@@ -210,21 +259,14 @@ export class EditorProcessingService {
         }
         this.isProcessing = false;
         this.notifyStatusChange();
-        console.debug('Queue processing complete');
-    }
-    // Remove task from queue by ID
-    removeFromQueue(id) {
-        const removed = this.processingQueue.removeById(id);
-        if (removed) {
-            this.notifyStatusChange();
-        }
-        return removed;
+        log.debug('Queue processing complete');
     }
     // Get current queue status
     getQueueStatus() {
         return {
             queueLength: this.processingQueue.length,
             isProcessing: this.isProcessing,
+            currentProcessingTaskId: this.currentProcessingTaskId,
             hasProcessor: !!this.processImage,
         };
     }
@@ -235,7 +277,7 @@ export class EditorProcessingService {
             item.reject(new Error('Queue cleared'));
         });
         this.notifyStatusChange();
-        console.debug(`Cleared ${clearedItems.length} items from queue`);
+        log.debug({ clearedItemsCount: clearedItems.length }, 'Cleared items from queue');
     }
     // Cleanup method for removing timeouts
     cleanup() {
@@ -244,6 +286,7 @@ export class EditorProcessingService {
             this.pendingProcessingTimeout = undefined;
         }
         this.clearQueue();
+        this.currentProcessingTaskId = undefined;
         this.statusChangeListeners.length = 0;
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yogiswara/honcho-editor-ui",
-  "version": "3.4.3",
+  "version": "3.4.5",
   "description": "A complete UI component library for the Honcho photo editor.",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",