cloud-ide-element 1.0.58 → 1.0.60

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 = {
+            cyfm_id: fileId
+        };
+        return this.http.post(`${this._baseUrl()}`, payload).pipe(retry(2), catchError(this.handleError.bind(this)), takeUntilDestroyed(this.destroyRef));
+    }
     /**
      * Angular 20: Service utility methods
      */
@@ -3178,11 +3191,13 @@ class CideEleFileInputComponent {
     writeValue(value) {
         console.log('📝 [FileInput] writeValue called with:', value);
         if (typeof value === 'string') {
-            // Value is an uploaded file ID
+            // 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
@@ -3391,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) {
@@ -3405,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]);
             }
@@ -3413,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