@yogiswara/honcho-editor-ui 3.9.1 → 3.9.2

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

@@ -12,6 +12,14 @@ export interface PhotoData {
     isSelected: boolean;
     adjustments?: Partial<AdjustmentValues>;
 }
+export interface GalleryDataProps {
+    photos: any[];
+    isLoading: boolean;
+    isLoadingMore: boolean;
+    hasMore: boolean;
+    loadMore: () => void;
+    reloadGallery: () => void;
+}
 export interface CopyCheckboxes {
     color: {
         temperature: boolean;
@@ -113,6 +121,7 @@ export interface UseHonchoEditorBulkReturn {
         selectedCount: number;
         totalImages: number;
         historySize: number;
+        isReady: boolean;
     };
     updateFromSocket: (imageId: string, adjustmentTaskId: string, adjustment: ColorAdjustment, preset_id?: string) => Promise<void>;
     adjustSelected: (delta: Partial<AdjustmentState>) => void;
@@ -137,22 +146,4 @@ export interface UseHonchoEditorBulkReturn {
         };
     };
 }
-/**
- * Helper function to create selective adjustments based on checkboxes
- */
-/**
- * Hook for bulk photo editing with multi-image backend synchronization.
- *
- * **Multi-Image Backend Sync:**
- * - Each selected image maintains its own history and backend state
- * - History operations (undo/redo) trigger separate controller.setHistoryIndex() calls for each selected image
- * - Preset application triggers separate controller.createEditorConfig() calls for each selected image
- * - Adjustment changes trigger separate controller.createEditorConfig() calls for each selected image
- *
- * **Key Features:**
- * - Individual history tracking per image with backend persistence
- * - Bulk operations that respect per-image differences
- * - Automatic backend synchronization for all state changes
- * - Comprehensive logging of multi-image operations
- */
-export declare function useHonchoEditorBulk(controller: Controller, eventID: string, firebaseUid: string): UseHonchoEditorBulkReturn;
+export declare function useHonchoEditorBulk(controller: Controller, eventID: string, firebaseUid: string, galleryHookData: GalleryDataProps): UseHonchoEditorBulkReturn;

package/dist/hooks/editor/useHonchoEditorBulk.js

@@ -1,11 +1,9 @@
 'use client';
 import { useState, useCallback, useEffect, useMemo, useRef } from 'react';
 import { useAdjustmentHistoryBatch } from '../useAdjustmentHistoryBatch';
-import { usePaging } from "../usePaging";
 import { usePreset } from "../usePreset";
 import { mapAdjustmentStateToAdjustmentEditor } from "../../utils/adjustment";
 import { log } from '../../utils/logger';
-// Helper function to map the API response to the format our UI component needs
 const mapGalleryToPhotoData = (gallery, selectedIds) => {
     log.debug({ gallery }, "[useHonchoEditorBulk] mapGalleryToPhotoData");
     return {
@@ -19,8 +17,6 @@ const mapGalleryToPhotoData = (gallery, selectedIds) => {
         adjustments: gallery.editor_config?.color_adjustment,
     };
 };
-// Helper function to map PhotoData to GallerySetup format for AlbumImageGalleryInfinite
-// PhotoData already contains the correct adjustments from history (processed in imageData useMemo)
 const mapPhotoDataToGallerySetup = (photoData) => {
     log.debug({ photoData }, "[useHonchoEditorBulk] mapPhotoDataToGallerySetup");
     return {
@@ -34,7 +30,7 @@ const mapPhotoDataToGallerySetup = (photoData) => {
         key: photoData.key,
         frame: undefined,
         isSelected: photoData.isSelected,
-        adjustments: photoData.adjustments, // Already contains history adjustments if available
+        adjustments: photoData.adjustments,
     };
 };
 const mapToImageAdjustmentConfig = (gallery) => {
@@ -62,7 +58,6 @@ function mapColorAdjustmentToAdjustmentState(adj, preset_id) {
         preset_id: preset_id,
     };
 }
-// Helper function to convert Preset to AdjustmentState
 const presetToAdjustmentState = (preset) => {
     return {
         tempScore: preset.temperature || 0,
@@ -79,12 +74,6 @@ const presetToAdjustmentState = (preset) => {
         sharpnessScore: preset.sharpness || 0,
     };
 };
-// Helper function to compare adjustment states
-// Remove adjustmentsMatch function as we now use preset_id based comparison
-/**
- * Helper function to get current adjustments from selected images
- * Returns the common adjustments or zero values if images have different adjustments
- */
 const getCurrentAdjustmentsForCopy = (selectedIds, currentBatch) => {
     if (selectedIds.length === 0) {
         return {
@@ -93,7 +82,6 @@ const getCurrentAdjustmentsForCopy = (selectedIds, currentBatch) => {
             blacksScore: 0, contrastScore: 0, clarityScore: 0, sharpnessScore: 0,
         };
     }
-    // Get adjustments from the first selected image
     const firstImageId = selectedIds[0];
     const firstImageAdjustments = currentBatch.allImages[firstImageId];
     if (!firstImageAdjustments) {
@@ -103,12 +91,9 @@ const getCurrentAdjustmentsForCopy = (selectedIds, currentBatch) => {
             blacksScore: 0, contrastScore: 0, clarityScore: 0, sharpnessScore: 0,
         };
     }
-    // If only one image is selected, return its adjustments
     if (selectedIds.length === 1) {
         return firstImageAdjustments;
     }
-    // If multiple images are selected, check if they all have the same adjustments
-    // If not, return zero values (indicating mixed adjustments)
     const allSame = selectedIds.slice(1).every(imageId => {
         const imageAdjustments = currentBatch.allImages[imageId];
         if (!imageAdjustments)
@@ -124,100 +109,64 @@ const getCurrentAdjustmentsForCopy = (selectedIds, currentBatch) => {
         blacksScore: 0, contrastScore: 0, clarityScore: 0, sharpnessScore: 0,
     };
 };
-/**
- * Helper function to create selective adjustments based on checkboxes
- */
-/**
- * Hook for bulk photo editing with multi-image backend synchronization.
- *
- * **Multi-Image Backend Sync:**
- * - Each selected image maintains its own history and backend state
- * - History operations (undo/redo) trigger separate controller.setHistoryIndex() calls for each selected image
- * - Preset application triggers separate controller.createEditorConfig() calls for each selected image
- * - Adjustment changes trigger separate controller.createEditorConfig() calls for each selected image
- *
- * **Key Features:**
- * - Individual history tracking per image with backend persistence
- * - Bulk operations that respect per-image differences
- * - Automatic backend synchronization for all state changes
- * - Comprehensive logging of multi-image operations
- */
-export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
+// ✅ FIX: Added galleryHookData to the parameters
+export function useHonchoEditorBulk(controller, eventID, firebaseUid, galleryHookData) {
     const { state, actions: batchActions } = useAdjustmentHistoryBatch(controller, firebaseUid, eventID);
     const { currentBatch, selectedIds } = state;
-    const { images, info, actions } = usePaging(controller, firebaseUid, eventID, {
-        autoLoad: true,
-        autoReset: false, // Prevent auto-reset to avoid loops
-    });
-    // Preset management
+    // ✅ FIX: Using the mapped galleryHookData instead of usePaging
+    const images = useMemo(() => {
+        return galleryHookData.photos.map(p => p.value || p);
+    }, [galleryHookData.photos]);
     const { presets, info: presetInfo, actions: presetActions } = usePreset(controller, firebaseUid, {
         autoLoad: true,
     });
-    // Track which images have been synced to prevent loops
     const lastSyncedImageIds = useRef(new Set());
-    // State for Bulk Editing
     const [selectedBulkPreset, setSelectedBulkPreset] = useState('');
-    // Calculate current adjustments for copy operations
     const currentAdjustments = useMemo(() => {
         return getCurrentAdjustmentsForCopy(selectedIds, currentBatch);
     }, [selectedIds, currentBatch]);
     const areAdjustmentsEqual = (adj1, adj2) => {
-        // The fix is to use this more specific type for our keys array
         const keys = [
             'tempScore', 'tintScore', 'saturationScore', 'vibranceScore',
             'exposureScore', 'contrastScore', 'highlightsScore', 'shadowsScore',
             'whitesScore', 'blacksScore', 'clarityScore', 'sharpnessScore'
         ];
         for (const key of keys) {
-            // Now, TypeScript knows `key` can't be 'preset_id', so adj1[key] will be a number.
             if (Math.round(adj1[key] || 0) !== Math.round(adj2[key] || 0)) {
                 return false;
             }
         }
         return true;
     };
+    // ✅ FIX: Using galleryHookData loading status for readiness
     const readyState = useMemo(() => {
         const paging = {
-            isReady: info.isReady ?? (info.isInitialized && !info.isLoading && info.error === null),
-            isLoading: info.isLoading,
+            isReady: !galleryHookData.isLoading,
+            isLoading: galleryHookData.isLoading,
         };
-        log.debug("[useHonchoEditorBulk] 📊 Paging state");
         const history = {
-            isReady: state.isReady ?? true, // History sync happens on-demand, not blocking
+            isReady: state.isReady ?? true,
             isLoading: state.isLoading ?? false
         };
-        log.debug("[useHonchoEditorBulk] 📊 History state");
         const presets = {
             isReady: presetInfo.isReady ?? (presetInfo.isInitialized && !presetInfo.isLoading),
             isLoading: presetInfo.isLoading
         };
-        log.debug("[useHonchoEditorBulk] 📊 Preset state");
         const allReady = paging.isReady && history.isReady && presets.isReady;
         const anyLoading = paging.isLoading || history.isLoading || presets.isLoading;
-        log.debug({
-            paging: { isReady: paging.isReady, isLoading: paging.isLoading },
-            history: { isReady: history.isReady, isLoading: history.isLoading },
-            presets: { isReady: presets.isReady, isLoading: presets.isLoading },
-            allReady,
-            anyLoading
-        }, '[useHonchoEditorBulk] 📊 Ready state computed');
         return {
             isReady: allReady,
             isLoading: anyLoading,
             operations: { paging, history, presets }
         };
     }, [
-        info.isReady,
-        info.isInitialized,
-        info.isLoading,
-        info.error,
+        galleryHookData.isLoading,
         state.isReady,
         state.isLoading,
         presetInfo.isReady,
         presetInfo.isInitialized,
         presetInfo.isLoading
     ]);
-    // Calculate active preset based on preset_id from history (not value comparison)
     const { activePreset, presetSummary } = useMemo(() => {
         if (selectedIds.length === 0) {
             return { activePreset: null, presetSummary: 'NO_SELECTION' };
@@ -225,9 +174,7 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
         const imageDetails = selectedIds.map(id => {
             const adjustment = currentBatch.allImages[id];
             const presetId = adjustment?.preset_id || null;
-            // Check if preset exists in our presets list
             const matchingPreset = presetId ? presets.find(p => p.id === presetId) : null;
-            // Check if the adjustment values actually match the preset values
             let hasValidMatchingPreset = false;
             if (matchingPreset && adjustment) {
                 const presetAdjustments = presetToAdjustmentState(matchingPreset);
@@ -241,194 +188,80 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
                 adjustmentValues: adjustment
             };
         });
-        console.log('Debug preset calculation (with custom check):', {
-            selectedIds,
-            imageDetails: imageDetails.map(detail => ({
-                imageId: detail.imageId,
-                presetId: detail.presetId,
-                presetName: detail.matchingPreset?.name || 'N/A',
-                hasValidMatchingPreset: detail.hasValidMatchingPreset,
-                isCustomAdjustment: detail.presetId && !detail.hasValidMatchingPreset
-            }))
-        });
-        // Get images that have ACTUALLY matching presets (not just preset IDs)
         const imagesWithValidPresets = imageDetails.filter(detail => detail.hasValidMatchingPreset);
         const validPresetIds = imagesWithValidPresets.map(detail => detail.presetId);
         const uniqueValidPresetIds = new Set(validPresetIds);
-        // Case 1: No images have actually matching presets
-        // This includes: no preset_id, non-existent preset_id, or preset_id with modified values
         if (imagesWithValidPresets.length === 0) {
-            console.log('Case 1: No images have valid matching presets - showing Select');
             return { activePreset: null, presetSummary: 'NO_SELECTION' };
         }
-        // Case 2: Some images have valid matching presets, some don't (mixed state)
         if (imagesWithValidPresets.length > 0 && imagesWithValidPresets.length < selectedIds.length) {
-            console.log('Case 2: Mixed preset state (some valid, some custom/none) - showing Multiple presets');
             return { activePreset: null, presetSummary: 'MULTIPLE_PRESETS' };
         }
-        // Case 3: All images have valid matching presets, but different ones
         if (uniqueValidPresetIds.size > 1) {
-            console.log('Case 3: Multiple different valid presets - showing Multiple presets');
             return { activePreset: null, presetSummary: 'MULTIPLE_PRESETS' };
         }
-        // Case 4: All images have the same valid matching preset
         const singleValidPresetId = Array.from(uniqueValidPresetIds)[0];
         const matchingPreset = presets.find(p => p.id === singleValidPresetId);
         if (matchingPreset) {
-            console.log('Case 4: All images have the same valid matching preset');
             return { activePreset: matchingPreset, presetSummary: 'SINGLE' };
         }
         else {
-            // This shouldn't happen given our filtering above, but safety check
-            console.log('Case 4 safety check failed - showing Select');
             return { activePreset: null, presetSummary: 'NO_SELECTION' };
         }
     }, [selectedIds, currentBatch.allImages, presets]);
-    // Update selectedBulkPreset when activePreset changes
     useEffect(() => {
         const newPresetId = activePreset?.id || '';
         setSelectedBulkPreset(newPresetId);
-        log.debug({
-            activePreset: activePreset?.name || 'none',
-            presetId: newPresetId,
-            selectedImagesCount: selectedIds.length,
-            triggerReason: 'activePreset changed'
-        }, '[useHonchoEditorBulk] 🎨 Preset selection updated');
     }, [activePreset]);
-    // Use loading states from usePaging instead of local state
-    const isLoading = info.isLoading;
-    const error = info.error;
-    const hasMore = info.hasMore;
+    // ✅ FIX: Connect UI states directly to galleryHookData
+    const isLoading = galleryHookData.isLoading;
+    const error = null;
+    const hasMore = galleryHookData.hasMore;
     const imageData = useMemo(() => {
         const res = images.map(item => {
             const basePhoto = mapGalleryToPhotoData(item, selectedIds);
             const historyAdjustment = currentBatch.allImages[item.id];
-            // **ADJUSTMENT PRIORITY LOGIC**
-            // 1. History adjustments (from useAdjustmentHistoryBatch) - highest priority
-            //    These are the most current client-side changes that may not be saved to backend yet
-            // 2. Backend adjustments (from paging data) - fallback
-            //    These come from the server and represent previously saved adjustments
-            //
-            // This ensures that when user makes adjustments in the UI, they are immediately
-            // reflected in the gallery view even before they're synced to the backend.
             if (historyAdjustment) {
-                // Use adjustments from history (most current client-side changes)
-                // Convert AdjustmentState (from history) to AdjustmentValues (for UI)
                 const adjustmentsValues = mapAdjustmentStateToAdjustmentEditor(historyAdjustment);
                 basePhoto.adjustments = adjustmentsValues;
-                log.debug({
-                    historyAdjustment,
-                    convertedValues: adjustmentsValues
-                }, `[useHonchoEditorBulk] 📊 Image ${item.id} using HISTORY adjustments`);
-            }
-            else {
-                // Fall back to backend adjustments if no history exists for this image
-                // basePhoto.adjustments already contains backend data from mapGalleryToPhotoData
-                log.debug({
-                    backendAdjustments: basePhoto.adjustments
-                }, `[useHonchoEditorBulk] 📊 Image ${item.id} using BACKEND adjustments`);
             }
             return basePhoto;
         });
-        log.debug({
-            totalImages: res.length,
-            imagesWithHistory: res.filter(img => currentBatch.allImages[img.key]).length,
-            imagesWithBackendOnly: res.filter(img => !currentBatch.allImages[img.key] && img.adjustments).length,
-            imagesWithNoAdjustments: res.filter(img => !currentBatch.allImages[img.key] && !img.adjustments).length
-        }, '[useHonchoEditorBulk] 📊 ImageData construction summary');
         return res;
     }, [images, selectedIds, currentBatch.allImages]);
-    // Convert imageData (PhotoData[]) to GallerySetup[] for AlbumImageGalleryInfinite
     const gallerySetupData = useMemo(() => {
-        const result = imageData.map(mapPhotoDataToGallerySetup);
-        log.debug({
-            photoDataCount: imageData.length,
-            gallerySetupCount: result.length,
-            batchImageCount: Object.keys(currentBatch.allImages).length,
-            samplePhotoData: imageData[0] ? {
-                key: imageData[0].key,
-                src: imageData[0].src,
-                isSelected: imageData[0].isSelected,
-                hasAdjustments: !!imageData[0].adjustments
-            } : null,
-            sampleGallerySetup: result[0] ? {
-                key: result[0].key,
-                src: result[0].src,
-                isSelected: result[0].isSelected,
-                hasAdjustments: !!result[0].adjustments,
-                adjustmentsSource: currentBatch.allImages[result[0].key] ? 'history' : 'backend'
-            } : null
-        }, '[useHonchoEditorBulk] 🔄 Mapped PhotoData to GallerySetup');
-        return result;
-    }, [imageData, currentBatch.allImages]);
-    // Store the latest batchActions functions in refs to avoid dependency issues
+        return imageData.map(mapPhotoDataToGallerySetup);
+    }, [imageData]);
     const syncAdjustmentRef = useRef(batchActions.syncAdjustment);
     const initializeFromPaginationRef = useRef(batchActions.initializeFromPagination);
     syncAdjustmentRef.current = batchActions.syncAdjustment;
     initializeFromPaginationRef.current = batchActions.initializeFromPagination;
-    // Safe sync: Only sync new images to prevent infinite loops
     useEffect(() => {
-        log.debug({
-            imagesLength: images.length,
-            imageIds: images.map(img => img.id),
-            lastSyncedImageIds: Array.from(lastSyncedImageIds.current),
-            lastSyncedCount: lastSyncedImageIds.current.size
-        }, '[useHonchoEditorBulk] 🔄 Sync effect triggered');
         if (images.length === 0)
             return;
-        // Check if we have new images that haven't been synced
         const currentImageIds = new Set(images.map(img => img.id));
         const hasNewImages = images.some(img => !lastSyncedImageIds.current.has(img.id));
-        log.debug({
-            currentImageIds: Array.from(currentImageIds),
-            hasNewImages,
-            newImages: images.filter(img => !lastSyncedImageIds.current.has(img.id)).map(img => img.id)
-        }, '[useHonchoEditorBulk] 🔍 New images check');
         if (hasNewImages) {
             const newImagesOnly = images.filter(img => !lastSyncedImageIds.current.has(img.id));
-            log.info({ imageCount: newImagesOnly.length }, '[useHonchoEditorBulk] 🔄 INITIALIZE: Initializing new images from pagination data');
-            // ✅ FIX: Only pass the new images to the initializer so you don't overwrite the first 2 images!
             initializeFromPaginationRef.current(newImagesOnly.map(mapToImageAdjustmentConfig));
             lastSyncedImageIds.current = currentImageIds;
         }
-        else {
-            log.debug('[useHonchoEditorBulk] ✅ No new images, skipping initialization (history preserved)');
-        }
-    }, [images]); // Only depend on images, not batchActions
+    }, [images]);
     const clearSelection = useCallback(() => {
-        log.info({
-            currentlySelected: selectedIds.length,
-            selectedImageIds: selectedIds
-        }, '[useHonchoEditorBulk] Clearing all selections');
-        // If there are selected images, toggle them off one by one
         if (selectedIds.length > 0) {
             selectedIds.forEach(imageId => {
                 batchActions.toggleSelection(imageId);
             });
         }
-        log.info('[useHonchoEditorBulk] All selections cleared');
     }, [selectedIds, batchActions]);
     const selectAllImages = useCallback(() => {
-        log.info({
-            totalImages: gallerySetupData.length,
-            currentlySelected: selectedIds.length,
-            availableImageIds: gallerySetupData.map(img => img.key)
-        }, '[useHonchoEditorBulk] Selecting all images');
-        // Get all image IDs from gallerySetupData
         const allImageIds = gallerySetupData.map(image => image.key);
-        if (allImageIds.length === 0) {
-            log.warn('[useHonchoEditorBulk] No images available to select');
+        if (allImageIds.length === 0)
             return;
-        }
-        // Find images that are not currently selected and select them
         const unselectedImages = allImageIds.filter(imageId => !selectedIds.includes(imageId));
         unselectedImages.forEach(imageId => {
             batchActions.toggleSelection(imageId);
         });
-        log.info({
-            selectedCount: allImageIds.length,
-            newlySelected: unselectedImages.length
-        }, '[useHonchoEditorBulk] All images selected');
     }, [gallerySetupData, selectedIds, batchActions]);
     const handleBackCallbackBulk = useCallback(() => {
         const lastSelectedId = selectedIds.length > 0 ? selectedIds[selectedIds.length - 1] : "";
@@ -436,57 +269,17 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
     }, [controller, firebaseUid, selectedIds]);
     const handleSelectBulkPreset = useCallback((presetId) => {
         setSelectedBulkPreset(presetId);
-        log.info({
-            presetId,
-            selectedImages: selectedIds,
-            imageCount: selectedIds.length,
-            hasController: !!controller,
-            hasFirebaseUid: !!firebaseUid
-        }, '[useHonchoEditorBulk] 🎨 Preset selection attempt');
-        if (!presetId) {
-            log.warn('[useHonchoEditorBulk] ❌ No preset ID provided, skipping backend call');
-            return;
-        }
-        if (selectedIds.length === 0) {
-            log.warn('[useHonchoEditorBulk] ❌ No images selected, skipping backend call');
+        if (!presetId || selectedIds.length === 0)
             return;
-        }
-        log.info({
-            presetId,
-            selectedImages: selectedIds,
-            imageCount: selectedIds.length
-        }, '[useHonchoEditorBulk] 🎨 Applying preset to multiple images');
-        // Find the preset
         const preset = presets.find(p => p.id === presetId);
-        if (!preset) {
-            log.error({ presetId }, '[useHonchoEditorBulk] ❌ Preset not found in presets list');
+        if (!preset)
             return;
-        }
-        // Convert preset to adjustment state
         const presetAdjustments = presetToAdjustmentState(preset);
-        log.debug({ presetAdjustments }, '[useHonchoEditorBulk] 📤 Sending preset adjustments to controller for each image');
-        log.debug('[useHonchoEditorBulk] 🔄 About to call batchActions.adjustSelectedWithPreset');
-        // Apply preset directly to all selected images using the clean action
-        // This will trigger backend calls for each selected image via adjustSelectedWithPreset
         batchActions.adjustSelectedWithPreset(presetAdjustments, preset.id);
-        log.info('[useHonchoEditorBulk] ✅ Called batchActions.adjustSelectedWithPreset, backend calls should be triggered');
-    }, [presets, selectedIds, batchActions, controller, firebaseUid]);
-    // This factory creates functions that adjust a value for all selected images
+    }, [presets, selectedIds, batchActions]);
     const createRelativeAdjuster = useCallback((key, amount) => () => {
-        log.debug({
-            key,
-            amount,
-            selectedImages: selectedIds,
-            imageCount: selectedIds.length
-        }, `[useHonchoEditorBulk] 🎛️ Bulk ${key} adjustment`);
-        log.debug('[useHonchoEditorBulk] 📤 Sending bulk adjustment to controller for each selected image');
-        log.debug({ allImages: currentBatch.allImages }, "currentBatch.allImages before");
         batchActions.adjustSelected({ [key]: amount });
-        // Debug after a short delay to see if the state changed
-        setTimeout(() => {
-            log.debug({ allImages: currentBatch.allImages }, "currentBatch.allImages after");
-        }, 100);
-    }, [batchActions, selectedIds, currentBatch.allImages]);
+    }, [batchActions]);
     const handleBulkTempDecreaseMax = createRelativeAdjuster('tempScore', -20);
     const handleBulkTempDecrease = createRelativeAdjuster('tempScore', -5);
     const handleBulkTempIncrease = createRelativeAdjuster('tempScore', 5);
@@ -538,14 +331,11 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
     return {
         imageData,
         isLoading,
-        isLoadingMore: info.isLoadingMore,
+        isLoadingMore: galleryHookData.isLoadingMore, // ✅ FIX: Use galleryHookData
         error,
         selectedIds,
         hasMore,
-        // loadMoreImages,
-        // Gallery Handlers
         handleBackCallbackBulk,
-        // Preset functionality
         presets,
         selectedBulkPreset,
         activePreset,
@@ -553,12 +343,10 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
         handleSelectBulkPreset,
         clearSelection,
         selectAllImages,
-        // Preset creation handlers
-        presetActions, // Expose preset actions for create/rename/delete
+        presetActions,
         handleToggleImageSelection: batchActions.toggleSelection,
-        handleLoadMore: actions.loadMore,
-        handleRefresh: actions.refresh,
-        // Adjustment
+        handleLoadMore: async () => { galleryHookData.loadMore(); }, // ✅ FIX: Bridge to KMP Engine
+        handleRefresh: async () => { galleryHookData.reloadGallery(); }, // ✅ FIX: Bridge to KMP Engine
         handleBulkTempDecreaseMax,
         handleBulkTempDecrease,
         handleBulkTempIncrease,
@@ -575,7 +363,6 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
         handleBulkSaturationDecrease,
         handleBulkSaturationIncrease,
         handleBulkSaturationIncreaseMax,
-        // Adjustment Light
         handleBulkExposureDecreaseMax,
         handleBulkExposureDecrease,
         handleBulkExposureIncrease,
@@ -600,7 +387,6 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
         handleBulkBlacksDecrease,
         handleBulkBlacksIncrease,
         handleBulkBlacksIncreaseMax,
-        // Adjustment Details
         handleBulkClarityDecreaseMax,
         handleBulkClarityDecrease,
         handleBulkClarityIncrease,
@@ -609,12 +395,8 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
         handleBulkSharpnessDecrease,
         handleBulkSharpnessIncrease,
         handleBulkSharpnessIncreaseMax,
-        // Adjustment History
         createRelativeAdjuster,
-        // copy paste
-        // copiedAdjustments,
         currentAdjustments,
-        // History actions
         handleUndo: batchActions.undo,
         handleRedo: batchActions.redo,
         handleReset: batchActions.reset,
@@ -625,14 +407,13 @@ export function useHonchoEditorBulk(controller, eventID, firebaseUid) {
             totalStates: state.totalStates,
             selectedCount: state.selectedCount,
             totalImages: state.totalImages,
-            historySize: state.historySize
+            historySize: state.historySize,
+            isReady: state.isReady ?? true, // ✅ FIX: Added missing isReady boolean
         },
-        // Socket updates
         updateFromSocket: batchActions.updateFromSocket,
         adjustSelected: batchActions.adjustSelected,
         adjustSelectedWithPreset: batchActions.adjustSelectedWithPreset,
         adjustSelectedWithPaste: batchActions.adjustSelectedWithPaste,
-        // Gallery setup data for AlbumImageGalleryInfinite
         gallerySetupData,
         readyState,
     };

package/package.json

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