cloud-ide-element 1.0.57 → 1.0.59

package/fesm2022/cloud-ide-element.mjs

@@ -2835,6 +2835,19 @@ class CideEleFileManagerService {
         this._error.set(errorMessage);
         return throwError(() => new Error(errorMessage));
     }
+    /**
+     * Get file details by ID
+     * @param fileId The file ID to fetch details for
+     * @returns Observable with file details
+     */
+    getFileDetails(fileId) {
+        console.log('🔍 [FileManagerService] Fetching file details for ID:', fileId.cyfm_id);
+        // Create a GET request payload similar to the upload structure
+        const payload = {
+            core_file_manager_get: [fileId]
+        };
+        return this.http.post(`${this._baseUrl()}`, payload).pipe(retry(2), catchError(this.handleError.bind(this)), takeUntilDestroyed(this.destroyRef));
+    }
     /**
      * Angular 20: Service utility methods
      */
@@ -3151,7 +3164,7 @@ class CideEleFileInputComponent {
         return Math.round(this.uploadProgress() ** 1); // Simple power operation
     }, ...(ngDevMode ? [{ debugName: "uploadProgressPercentage" }] : []));
     // ControlValueAccessor callbacks
-    onChange = (files) => { };
+    onChange = (value) => { };
     onTouched = () => { };
     onValidatorChange = () => { };
     // Computed values
@@ -3175,11 +3188,31 @@ class CideEleFileInputComponent {
             console.log('🎯 [FileInput] Component rendered and DOM is ready');
         });
     }
-    writeValue(files) {
-        console.log('📝 [FileInput] writeValue called with:', files ? Array.from(files).map(f => f.name) : 'null');
-        this.files.set(files);
-        this.fileNames.set(files ? Array.from(files).map(f => f.name) : []);
-        this.generatePreviews();
+    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);
+        }
+        else if (value instanceof FileList) {
+            // Value is a FileList
+            console.log('📝 [FileInput] Value is FileList:', Array.from(value).map(f => f.name));
+            this.files.set(value);
+            this.fileNames.set(Array.from(value).map(f => f.name));
+            this.generatePreviews();
+        }
+        else {
+            // Value is null
+            console.log('📝 [FileInput] Value is null');
+            this.files.set(null);
+            this.fileNames.set([]);
+            this.clearPreviews();
+        }
     }
     registerOnChange(fn) {
         this.onChange = fn;
@@ -3209,7 +3242,6 @@ class CideEleFileInputComponent {
         this.onChange(selectedFiles);
         this.fileChange.emit(selectedFiles);
         this.onTouched();
-        this.onValidatorChange();
         // Auto upload if enabled
         if (this.autoUpload() && selectedFiles && selectedFiles.length > 0) {
             console.log('🚀 [FileInput] Auto upload enabled, starting upload for:', selectedFiles[0].name);
@@ -3228,7 +3260,6 @@ class CideEleFileInputComponent {
         console.log('🔄 [FileInput] Upload status reset to:', this.uploadStatus());
         this.onChange(null);
         this.fileChange.emit(null);
-        this.onValidatorChange();
     }
     uploadFile(file) {
         console.log('📤 [FileInput] uploadFile called for:', file.name, 'Size:', file.size, 'bytes');
@@ -3238,9 +3269,6 @@ class CideEleFileInputComponent {
         // Set upload status to 'start' before starting upload
         this.uploadStatus.set('start');
         console.log('🔄 [FileInput] Upload status set to:', this.uploadStatus());
-        // Trigger validation update to show upload in progress error
-        this.onValidatorChange();
-        console.log('✅ [FileInput] Validation triggered - should show upload in progress error');
         this.isUploading.set(true);
         this.uploadProgress.set(0);
         this.uploadProgressChange.emit(0);
@@ -3261,8 +3289,6 @@ class CideEleFileInputComponent {
             if (this.uploadStatus() === 'start') {
                 this.uploadStatus.set('uploading');
                 console.log('🔄 [FileInput] Upload status changed to:', this.uploadStatus());
-                this.onValidatorChange();
-                console.log('✅ [FileInput] Validation triggered after status change to uploading');
             }
             // Update progress notification with spinner
             const notificationId = this.uploadNotificationId();
@@ -3313,8 +3339,10 @@ class CideEleFileInputComponent {
                 const uploadedId = response?.data?.core_file_manager?.[0]?.cyfm_id;
                 if (uploadedId) {
                     console.log('✅ [FileInput] File uploaded successfully with ID:', uploadedId);
+                    // Set the uploaded ID as the form control value
+                    this.onChange(uploadedId);
+                    console.log('📝 [FileInput] Form control value set to uploaded ID:', uploadedId);
                     this.uploadSuccess.emit(uploadedId);
-                    // Note: Form control value remains as FileList - uploaded ID is emitted separately
                     console.log('📝 [FileInput] Upload success event emitted with file ID:', uploadedId);
                 }
                 else {
@@ -3323,9 +3351,6 @@ class CideEleFileInputComponent {
                 }
                 this.isUploading.set(false);
                 console.log('🔄 [FileInput] isUploading set to false');
-                // Trigger validation update to clear upload in progress error
-                this.onValidatorChange();
-                console.log('✅ [FileInput] Validation triggered - should clear upload in progress error');
             },
             error: (error) => {
                 console.error('💥 [FileInput] Upload FAILED:', error);
@@ -3348,9 +3373,6 @@ class CideEleFileInputComponent {
                 this.uploadProgress.set(0);
                 this.uploadProgressChange.emit(0);
                 console.log('🔄 [FileInput] Upload state reset - isUploading: false, progress: 0%');
-                // Trigger validation update to clear upload in progress error
-                this.onValidatorChange();
-                console.log('✅ [FileInput] Validation triggered - should clear upload in progress error');
             }
         });
     }
@@ -3384,10 +3406,63 @@ class CideEleFileInputComponent {
     isImageFile(file) {
         return file.type.startsWith('image/');
     }
+    loadFileDetailsFromId(fileId) {
+        console.log('🔍 [FileInput] Loading file details for ID:', fileId);
+        this.fileManagerService?.getFileDetails({ cyfm_id: fileId })?.pipe(takeUntilDestroyed(this.destroyRef)).subscribe({
+            next: (fileDetails) => {
+                console.log('📋 [FileInput] File details received:', fileDetails);
+                if (fileDetails?.data?.length) {
+                    const fileData = fileDetails.data[0];
+                    console.log('📁 [FileInput] File data:', fileData);
+                    // Set file name from the details
+                    if (fileData.cyfm_name) {
+                        this.fileNames.set([fileData.cyfm_name]);
+                        console.log('📝 [FileInput] File name set:', fileData.cyfm_name);
+                    }
+                    // If it's an image and we have base64 data, set preview
+                    if (this.showPreview() && fileData.cyfm_file_base64) {
+                        // Check if it's an image file based on file name or type
+                        const isImage = this.isImageFileFromName(fileData.cyfm_name) ||
+                            this.isImageFileFromType(fileData.cyfm_type);
+                        if (isImage) {
+                            // Add data URL prefix if not already present
+                            let base64Data = fileData.cyfm_file_base64;
+                            if (!base64Data.startsWith('data:')) {
+                                const mimeType = fileData.cyfm_type || 'image/jpeg';
+                                base64Data = `data:${mimeType};base64,${base64Data}`;
+                            }
+                            this.previewUrls.set([base64Data]);
+                            console.log('🖼️ [FileInput] Preview set from base64 data');
+                        }
+                    }
+                }
+                else {
+                    console.warn('⚠️ [FileInput] No file data found for ID:', fileId);
+                }
+            },
+            error: (error) => {
+                console.error('❌ [FileInput] Error loading file details:', error);
+                this.notificationService.error(`Failed to load file details: ${error.message || 'Unknown error'}`, { duration: 0 });
+            }
+        });
+    }
+    isImageFileFromName(fileName) {
+        if (!fileName)
+            return false;
+        const imageExtensions = ['.jpg', '.jpeg', '.png', '.gif', '.bmp', '.webp', '.svg'];
+        const lowerFileName = fileName.toLowerCase();
+        return imageExtensions.some(ext => lowerFileName.endsWith(ext));
+    }
+    isImageFileFromType(fileType) {
+        if (!fileType)
+            return false;
+        return fileType.startsWith('image/');
+    }
     removePreview(index) {
         const currentFiles = this.files();
+        const currentUrls = this.previewUrls();
         if (currentFiles && currentFiles.length > index) {
-            // Create new FileList without the removed file
+            // Handle FileList case - remove file from FileList
             const dt = new DataTransfer();
             Array.from(currentFiles).forEach((file, i) => {
                 if (i !== index) {
@@ -3398,7 +3473,6 @@ class CideEleFileInputComponent {
             this.files.set(newFiles);
             this.fileNames.set(Array.from(newFiles).map(f => f.name));
             // Remove the preview URL
-            const currentUrls = this.previewUrls();
             if (currentUrls[index] && currentUrls[index].startsWith('blob:')) {
                 URL.revokeObjectURL(currentUrls[index]);
             }
@@ -3406,6 +3480,16 @@ class CideEleFileInputComponent {
             this.onChange(newFiles);
             this.fileChange.emit(newFiles);
         }
+        else if (currentUrls.length > index) {
+            // Handle uploaded file ID case - clear the preview and set control value to null
+            console.log('🗑️ [FileInput] Removing preview for uploaded file ID');
+            // Clear preview
+            this.previewUrls.update(urls => urls.filter((_, i) => i !== index));
+            this.fileNames.set([]);
+            // Set control value to null since we're removing the uploaded file
+            this.onChange(null);
+            this.fileChange.emit(null);
+        }
     }
     ngOnDestroy() {
         // Clean up preview URLs to prevent memory leaks
@@ -3506,7 +3590,6 @@ class CideEleFileInputComponent {
         this.onChange(files);
         this.fileChange.emit(files);
         this.onTouched();
-        this.onValidatorChange();
         // Auto upload if enabled
         if (this.autoUpload() && files.length > 0) {
             console.log('🚀 [FileInput] Auto upload enabled, starting upload for:', files[0].name);