cloud-ide-element 1.0.90 → 1.0.92

package/fesm2022/cloud-ide-element.mjs

@@ -4,7 +4,7 @@ import * as i0 from '@angular/core';
 import { Pipe, Injectable, inject, EventEmitter, ViewContainerRef, forwardRef, ViewChild, Output, Input, Component, HostListener, ContentChildren, signal, DestroyRef, computed, effect, afterRenderEffect, afterNextRender, ElementRef, Directive, viewChild } from '@angular/core';
 import * as i2 from '@angular/forms';
 import { FormsModule, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
-import { BehaviorSubject, Subject, debounceTime, takeUntil, distinctUntilChanged, Observable, retry, catchError, finalize, throwError } from 'rxjs';
+import { BehaviorSubject, Subject, debounceTime, takeUntil, distinctUntilChanged, Observable, retry, catchError, finalize, throwError, map } from 'rxjs';
 import * as i2$1 from '@angular/router';
 import * as i1$1 from '@angular/common/http';
 import { HttpClient, HttpEventType, HttpRequest } from '@angular/common/http';
@@ -2631,6 +2631,7 @@ class CideEleFileManagerService {
     _isUploading = signal(false, ...(ngDevMode ? [{ debugName: "_isUploading" }] : []));
     _uploadQueue = signal([], ...(ngDevMode ? [{ debugName: "_uploadQueue" }] : []));
     _activeUploads = signal(new Map(), ...(ngDevMode ? [{ debugName: "_activeUploads" }] : []));
+    _fetchedFiles = signal(new Map(), ...(ngDevMode ? [{ debugName: "_fetchedFiles" }] : [])); // Group ID -> Files mapping
     _error = signal(null, ...(ngDevMode ? [{ debugName: "_error" }] : []));
     // Angular 20: Computed values
     baseUrl = this._baseUrl.asReadonly();
@@ -2639,13 +2640,20 @@ class CideEleFileManagerService {
     isUploading = this._isUploading.asReadonly();
     uploadQueue = this._uploadQueue.asReadonly();
     activeUploads = this._activeUploads.asReadonly();
+    fetchedFiles = this._fetchedFiles.asReadonly();
     error = this._error.asReadonly();
     hasActiveUploads = computed(() => this._activeUploads().size > 0, ...(ngDevMode ? [{ debugName: "hasActiveUploads" }] : []));
     queueLength = computed(() => this._uploadQueue().length, ...(ngDevMode ? [{ debugName: "queueLength" }] : []));
+    totalFetchedFiles = computed(() => {
+        let total = 0;
+        this._fetchedFiles().forEach(files => total += files.length);
+        return total;
+    }, ...(ngDevMode ? [{ debugName: "totalFetchedFiles" }] : []));
     serviceState = computed(() => ({
         isUploading: this._isUploading(),
         uploadQueue: this._uploadQueue(),
         activeUploads: this._activeUploads(),
+        fetchedFiles: this._fetchedFiles(),
         error: this._error()
     }), ...(ngDevMode ? [{ debugName: "serviceState" }] : []));
     constructor() {
@@ -2892,6 +2900,87 @@ class CideEleFileManagerService {
         console.log('🔍 [FileManagerService] Fetching file details for ID:', payload.cyfm_id);
         return this.http.post(`${this._baseUrl()}`, payload).pipe(retry(2), catchError(this.handleError.bind(this)), takeUntilDestroyed(this.destroyRef));
     }
+    /**
+     * Get files by group ID and store them in service state
+     * @param groupId The group ID to fetch files for
+     * @returns Observable with files list
+     */
+    getFilesByGroupId(groupId) {
+        console.log('🔍 [FileManagerService] Fetching files for group ID:', groupId);
+        const payload = {
+            cyfm_group_id: groupId
+        };
+        return this.http.post(`${this._baseUrl()}/group/${groupId}`, payload).pipe(retry(2), catchError(this.handleError.bind(this)), takeUntilDestroyed(this.destroyRef));
+    }
+    /**
+     * Fetch and store files by group ID in service state
+     * @param groupId The group ID to fetch files for
+     * @returns Observable that completes when files are stored
+     */
+    fetchAndStoreFilesByGroupId(groupId) {
+        console.log('📡 [FileManagerService] Fetching and storing files for group:', groupId);
+        return this.getFilesByGroupId(groupId).pipe(map(response => {
+            if (response.success && response.data && response.data.files) {
+                // Store files in service state
+                const currentFetchedFiles = new Map(this._fetchedFiles());
+                currentFetchedFiles.set(groupId, response.data.files);
+                this._fetchedFiles.set(currentFetchedFiles);
+                console.log('📁 [FileManagerService] Stored', response.data.files.length, 'files for group:', groupId);
+                return response.data.files;
+            }
+            return [];
+        }), catchError(error => {
+            console.error('❌ [FileManagerService] Failed to fetch files for group:', groupId, error);
+            return [];
+        }));
+    }
+    /**
+     * Get fetched files for a specific group ID
+     * @param groupId The group ID to get files for
+     * @returns Array of files for the group
+     */
+    getFetchedFilesByGroupId(groupId) {
+        return this._fetchedFiles().get(groupId) || [];
+    }
+    /**
+     * Get all files (active uploads + fetched files) for a group ID
+     * @param groupId The group ID to get files for
+     * @returns Combined array of active and fetched files
+     */
+    getAllFilesForGroup(groupId) {
+        const files = [];
+        // Add active uploads for this group
+        this._activeUploads().forEach((upload, fileId) => {
+            if (upload.groupId === groupId) {
+                files.push({
+                    fileId,
+                    fileName: this.getFileNameFromId(fileId),
+                    stage: upload.stage,
+                    percentage: upload.percentage
+                });
+            }
+        });
+        // Add fetched files for this group
+        const fetchedFiles = this.getFetchedFilesByGroupId(groupId);
+        fetchedFiles.forEach(file => {
+            files.push({
+                fileId: file.cyfm_id || file.id,
+                fileName: file.cyfm_name || file.name,
+                stage: 'complete' // Fetched files are already completed
+            });
+        });
+        return files;
+    }
+    /**
+     * Get file name from file ID (extract from the ID format)
+     */
+    getFileNameFromId(fileId) {
+        const parts = fileId.split('_');
+        if (parts.length >= 3) {
+            return parts.slice(0, -2).join('_');
+        }
+        return fileId;
+    }
     /**
      * Angular 20: Service utility methods
      */
@@ -3355,8 +3444,8 @@ class CideEleFloatingFileUploaderComponent {
      * Close the floating uploader
      */
     close() {
-        // Clear all completed uploads when closing
-        this.fileManagerService.clearCompletedUploads();
+        // Don't clear files from service - just hide the uploader
+        // Files will be fetched from API when "Show Files" is clicked
         this.hideWithAnimation();
     }
     /**
@@ -3435,9 +3524,15 @@ class CideEleFloatingFileUploaderComponent {
         return fileId;
     }
     /**
-     * Get all files from service state (pending + active uploads)
+     * Get all files from service state (pending + active uploads + fetched files)
      */
     getAllFiles() {
+        const groupId = this.currentGroupId();
+        if (groupId) {
+            // Use service method to get all files for this group
+            return this.fileManagerService.getAllFilesForGroup(groupId);
+        }
+        // Fallback to general files if no group ID
         const files = [];
         // Add pending files
         this.uploadQueue().forEach(fileId => {
@@ -3510,6 +3605,17 @@ class CideEleFloatingFileUploaderComponent {
         console.log('👁️ [FloatingFileUploader] Manually showing uploader', groupId ? `for group: ${groupId}` : '');
         if (groupId) {
             this.currentGroupId.set(groupId);
+            // Use service to fetch and store files
+            this.fileManagerService.fetchAndStoreFilesByGroupId(groupId)
+                .pipe(takeUntilDestroyed(this.destroyRef))
+                .subscribe({
+                next: (files) => {
+                    console.log('✅ [FloatingFileUploader] Files fetched and stored:', files.length);
+                },
+                error: (error) => {
+                    console.error('❌ [FloatingFileUploader] Failed to fetch files:', error);
+                }
+            });
         }
         this.showWithAnimation();
     }
@@ -3701,13 +3807,22 @@ class CideEleFileInputComponent {
     writeValue(value) {
         console.log('📝 [FileInput] writeValue called with:', value);
         if (typeof value === 'string') {
-            // Value is an uploaded file ID - fetch file details and set preview
-            console.log('📝 [FileInput] Value is uploaded file ID:', value);
-            this.files.set(null);
-            this.fileNames.set([]);
-            this.clearPreviews();
-            // Fetch file details to get base64 and set preview
-            this.loadFileDetailsFromId(value);
+            // Check if this is a group ID for multiple files or single file ID
+            if (this.isMultipleFileMode()) {
+                // Multiple file mode - value is group ID
+                console.log('📁 [FileInput] Value is group ID for multiple files:', value);
+                this.groupId.set(value);
+                this.loadFilesFromGroupId(value);
+            }
+            else {
+                // Single file mode - value is file ID
+                console.log('📝 [FileInput] Value is single file ID:', value);
+                this.files.set(null);
+                this.fileNames.set([]);
+                this.clearPreviews();
+                // Fetch file details to get base64 and set preview
+                this.loadFileDetailsFromId(value);
+            }
         }
         else if (value instanceof FileList) {
             // Value is a FileList
@@ -3715,6 +3830,14 @@ class CideEleFileInputComponent {
             this.files.set(value);
             this.fileNames.set(Array.from(value).map(f => f.name));
             this.generatePreviews();
+            // For multiple files, use group ID API to fetch files
+            if (value.length > 1) {
+                const groupId = this.groupId();
+                if (groupId) {
+                    console.log('📁 [FileInput] Multiple files detected, fetching files for group:', groupId);
+                    this.loadFilesFromGroupId(groupId);
+                }
+            }
         }
         else {
             // Value is null
@@ -4117,6 +4240,42 @@ class CideEleFileInputComponent {
             }
         });
     }
+    /**
+     * Check if the component is in multiple file mode
+     */
+    isMultipleFileMode() {
+        // Check if multiple attribute is set or if we have a group ID
+        return this.multiple || this.groupId() !== null;
+    }
+    /**
+     * Load files from group ID using the group API
+     */
+    loadFilesFromGroupId(groupId) {
+        console.log('🔍 [FileInput] Loading files for group ID:', groupId);
+        if (!groupId)
+            return;
+        this.fileManagerService.fetchAndStoreFilesByGroupId(groupId)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (files) => {
+                console.log('📋 [FileInput] Files loaded for group:', files.length);
+                // Set file names to show count in input
+                if (files && files.length > 0) {
+                    const fileNames = files.map(file => file.file_name || file.name || 'Unknown file');
+                    this.fileNames.set(fileNames);
+                    console.log('📝 [FileInput] File names set for display:', fileNames);
+                }
+                else {
+                    this.fileNames.set([]);
+                }
+                // Files are now stored in service state and will be displayed by floating uploader
+            },
+            error: (error) => {
+                console.error('❌ [FileInput] Failed to load files for group:', error);
+                this.fileNames.set([]);
+            }
+        });
+    }
     isImageFileFromName(fileName) {
         if (!fileName)
             return false;
@@ -4197,8 +4356,9 @@ class CideEleFileInputComponent {
             // If no group ID, return all uploads
             return this.fileManagerService.activeUploads().size;
         }
-        // Filter uploads by this component's group ID
-        return Array.from(this.fileManagerService.activeUploads().values()).filter(upload => upload.groupId === groupId).length;
+        // Use service method to get all files for this group
+        const allFiles = this.fileManagerService.getAllFilesForGroup(groupId);
+        return allFiles.length;
     }
     /**
      * Check if there are active uploads for this component's group ID
@@ -4209,8 +4369,9 @@ class CideEleFileInputComponent {
             // If no group ID, check all uploads
             return Array.from(this.fileManagerService.activeUploads().values()).some(upload => upload.stage !== 'complete');
         }
-        // Filter by this component's group ID and check for active uploads
-        return Array.from(this.fileManagerService.activeUploads().values()).some(upload => upload.groupId === groupId && upload.stage !== 'complete');
+        // Use service method to get all files and check for active ones
+        const allFiles = this.fileManagerService.getAllFilesForGroup(groupId);
+        return allFiles.some(file => file.stage !== 'complete');
     }
     /**
      * Get count of active (non-completed) uploads for this component's group ID
@@ -4221,8 +4382,9 @@ class CideEleFileInputComponent {
             // If no group ID, return all active uploads
             return Array.from(this.fileManagerService.activeUploads().values()).filter(upload => upload.stage !== 'complete').length;
         }
-        // Filter by this component's group ID and active uploads
-        return Array.from(this.fileManagerService.activeUploads().values()).filter(upload => upload.groupId === groupId && upload.stage !== 'complete').length;
+        // Use service method to get all files and filter active ones
+        const allFiles = this.fileManagerService.getAllFilesForGroup(groupId);
+        return allFiles.filter(file => file.stage !== 'complete').length;
     }
     /**
      * Show floating uploader (alias for showUploader for template)