@flusys/ng-storage 1.1.1-beta → 1.2.0-rc.1

package/fesm2022/flusys-ng-storage-file-manager-form.component-H3OZS0SW.mjs

@@ -1,715 +0,0 @@
-import * as i0 from '@angular/core';
-import { inject, signal, computed, Component } from '@angular/core';
-import { form, required, FormField } from '@angular/forms/signals';
-import { Router, ActivatedRoute } from '@angular/router';
-import { APP_CONFIG, DEFAULT_APP_NAME } from '@flusys/ng-core';
-import { LAYOUT_AUTH_STATE } from '@flusys/ng-layout';
-import { AngularModule, PrimeModule } from '@flusys/ng-shared';
-import { MessageService } from 'primeng/api';
-import { firstValueFrom } from 'rxjs';
-import { FileManagerApiService, UploadService, StorageConfigApiService, FolderApiService } from './flusys-ng-storage.mjs';
-import * as i1 from '@angular/forms';
-import * as i1$1 from 'primeng/button';
-import * as i3 from 'primeng/fileupload';
-import * as i3$1 from 'primeng/inputtext';
-
-/**
- * File Manager Form Component
- * Upload and edit file metadata
- */
-class FileManagerFormComponent {
-    router = inject(Router);
-    route = inject(ActivatedRoute);
-    messageService = inject(MessageService);
-    fileService = inject(FileManagerApiService);
-    uploadService = inject(UploadService);
-    configService = inject(StorageConfigApiService);
-    folderService = inject(FolderApiService);
-    appConfig = inject(APP_CONFIG);
-    companyContext = inject(LAYOUT_AUTH_STATE);
-    isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
-    isLoadingConfigs = signal(false, ...(ngDevMode ? [{ debugName: "isLoadingConfigs" }] : []));
-    isLoadingFolders = signal(false, ...(ngDevMode ? [{ debugName: "isLoadingFolders" }] : []));
-    existingFile = signal(null, ...(ngDevMode ? [{ debugName: "existingFile" }] : []));
-    isEditMode = computed(() => !!this.existingFile(), ...(ngDevMode ? [{ debugName: "isEditMode" }] : []));
-    selectedFile = signal(null, ...(ngDevMode ? [{ debugName: "selectedFile" }] : []));
-    availableConfigs = signal([], ...(ngDevMode ? [{ debugName: "availableConfigs" }] : []));
-    availableFolders = signal([], ...(ngDevMode ? [{ debugName: "availableFolders" }] : []));
-    showCompanyInfo = computed(() => this.appConfig.enableCompanyFeature, ...(ngDevMode ? [{ debugName: "showCompanyInfo" }] : []));
-    currentCompanyName = computed(() => this.companyContext.currentCompanyInfo()?.name ?? DEFAULT_APP_NAME, ...(ngDevMode ? [{ debugName: "currentCompanyName" }] : []));
-    // ============================================
-    // Form (Signal Forms)
-    // ============================================
-    /** Form model */
-    formModel = signal({
-        id: '',
-        name: '',
-        isPrivate: false,
-        folderId: '',
-        storageConfigId: '',
-    }, ...(ngDevMode ? [{ debugName: "formModel" }] : []));
-    /** Form with validation schema */
-    fileForm = form(this.formModel, (f) => {
-        required(f.name, { message: 'File name is required' });
-        // storageConfigId validation will be done manually in onSubmit
-        // as it's only required for new uploads, not edits
-    });
-    /** Check if form is valid */
-    isFormValid = computed(() => {
-        const model = this.formModel();
-        return model.name.trim().length > 0;
-    }, ...(ngDevMode ? [{ debugName: "isFormValid" }] : []));
-    ngOnInit() {
-        const fileId = this.route.snapshot.paramMap.get('id');
-        if (fileId) {
-            this.loadFile(fileId);
-        }
-        else {
-            // Load storage configurations for new upload
-            this.loadStorageConfigs();
-        }
-        // Load folders for both create and edit modes
-        this.loadFolders();
-    }
-    async loadStorageConfigs() {
-        this.isLoadingConfigs.set(true);
-        try {
-            const response = await firstValueFrom(this.configService.getAll('', {
-                pagination: { currentPage: 0, pageSize: 100 },
-                filter: {},
-                select: [],
-                sort: {},
-            }));
-            if (response.success && response.data) {
-                this.availableConfigs.set(response.data);
-                // Auto-select first config if only one available
-                if (response.data.length === 1) {
-                    this.formModel.update((m) => ({
-                        ...m,
-                        storageConfigId: response.data[0].id,
-                    }));
-                }
-            }
-        }
-        catch (error) {
-            this.messageService.add({
-                severity: 'error',
-                summary: 'Error',
-                detail: 'Failed to load storage configurations.',
-            });
-        }
-        finally {
-            this.isLoadingConfigs.set(false);
-        }
-    }
-    async loadFolders() {
-        this.isLoadingFolders.set(true);
-        try {
-            const response = await firstValueFrom(this.folderService.getAll('', {
-                pagination: { currentPage: 0, pageSize: 100 },
-                filter: {},
-                select: [],
-                sort: {},
-            }));
-            if (response.success && response.data) {
-                this.availableFolders.set(response.data);
-            }
-        }
-        catch {
-            // Silently fail - folders are optional
-        }
-        finally {
-            this.isLoadingFolders.set(false);
-        }
-    }
-    async loadFile(id) {
-        this.isLoading.set(true);
-        try {
-            const response = await this.fileService.findByIdAsync(id);
-            if (response.success && response.data) {
-                const file = response.data;
-                this.existingFile.set(file);
-                this.formModel.set({
-                    id: file.id,
-                    name: file.name,
-                    isPrivate: file.isPrivate ?? false,
-                    folderId: file.folderId ?? '',
-                    storageConfigId: '',
-                });
-            }
-        }
-        catch (error) {
-            this.messageService.add({
-                severity: 'error',
-                summary: 'Error',
-                detail: 'Failed to load file.',
-            });
-            this.router.navigate(['/storage/files']);
-        }
-        finally {
-            this.isLoading.set(false);
-        }
-    }
-    onFileSelect(event) {
-        const file = event.files?.[0] || event.currentFiles?.[0];
-        if (file) {
-            this.selectedFile.set(file);
-            // Auto-fill file name
-            this.formModel.update((m) => ({ ...m, name: file.name }));
-        }
-    }
-    async onSubmit() {
-        if (!this.isFormValid())
-            return;
-        this.isLoading.set(true);
-        try {
-            const formValue = this.formModel();
-            if (this.isEditMode()) {
-                // Update existing file metadata only
-                await this.fileService.updateAsync({
-                    id: formValue.id,
-                    name: formValue.name,
-                    isPrivate: formValue.isPrivate,
-                    folderId: formValue.folderId || null,
-                });
-                this.messageService.add({
-                    severity: 'success',
-                    summary: 'Success',
-                    detail: 'File updated successfully.',
-                });
-            }
-            else {
-                // Upload new file
-                const file = this.selectedFile();
-                if (!file) {
-                    this.messageService.add({
-                        severity: 'error',
-                        summary: 'Error',
-                        detail: 'Please select a file to upload.',
-                    });
-                    return;
-                }
-                // Validate storage config selection
-                if (!formValue.storageConfigId) {
-                    this.messageService.add({
-                        severity: 'error',
-                        summary: 'Error',
-                        detail: 'Please select a storage configuration.',
-                    });
-                    return;
-                }
-                // Upload file first
-                const uploadResponse = await firstValueFrom(this.uploadService.uploadSingleFile(file, {
-                    compress: true,
-                    quality: 85,
-                    storageConfigId: formValue.storageConfigId,
-                }));
-                if (uploadResponse.success && uploadResponse.data) {
-                    const uploadedFileInfo = uploadResponse.data;
-                    // Save file metadata
-                    await this.fileService.insertAsync({
-                        name: formValue.name,
-                        key: uploadedFileInfo.key,
-                        contentType: file.type || 'application/octet-stream',
-                        size: Math.round(file.size / 1024).toString(),
-                        isPrivate: formValue.isPrivate,
-                        folderId: formValue.folderId || undefined,
-                        storageConfigId: formValue.storageConfigId, // ✅ Include storage config ID
-                    });
-                    this.messageService.add({
-                        severity: 'success',
-                        summary: 'Success',
-                        detail: 'File uploaded successfully.',
-                    });
-                }
-                else {
-                    throw new Error('Upload failed');
-                }
-            }
-            this.router.navigate(['/storage/files']);
-        }
-        catch (error) {
-            this.messageService.add({
-                severity: 'error',
-                summary: 'Error',
-                detail: error?.message ||
-                    `Failed to ${this.isEditMode() ? 'update' : 'upload'} file.`,
-            });
-        }
-        finally {
-            this.isLoading.set(false);
-        }
-    }
-    onCancel() {
-        this.router.navigate(['/storage/files']);
-    }
-    formatFileSize(bytes) {
-        if (bytes === 0)
-            return '0 Bytes';
-        const k = 1024;
-        const sizes = ['Bytes', 'KB', 'MB', 'GB'];
-        const i = Math.floor(Math.log(bytes) / Math.log(k));
-        return Math.round((bytes / Math.pow(k, i)) * 100) / 100 + ' ' + sizes[i];
-    }
-    getProviderLabel(storage) {
-        const labels = {
-            AWS: 'AWS S3',
-            AZURE: 'Azure Blob',
-            SFTP: 'SFTP',
-            LOCAL: 'Local',
-        };
-        return labels[storage] || storage;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: FileManagerFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: FileManagerFormComponent, isStandalone: true, selector: "lib-file-manager-form", ngImport: i0, template: `
-    <div class="card">
-      <div class="flex justify-between items-center mb-4">
-        <div>
-          <h3 class="text-xl font-semibold">
-            {{ isEditMode() ? 'Edit File' : 'Upload File' }}
-          </h3>
-          @if (showCompanyInfo()) {
-            <p class="text-sm text-muted-color mt-1">
-              Company: {{ currentCompanyName() }}
-            </p>
-          }
-        </div>
-        <p-button
-          label="Back"
-          icon="pi pi-arrow-left"
-          severity="secondary"
-          [text]="true"
-          (onClick)="onCancel()"
-        />
-      </div>
-
-      <form (ngSubmit)="onSubmit()">
-        <!-- Storage Configuration & Folder Selection (only for new files) -->
-        @if (!isEditMode()) {
-          <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-            <!-- Storage Configuration -->
-            <div class="field">
-              <label for="storageConfig" class="block font-medium mb-2"
-                >Storage Configuration *</label
-              >
-              <select
-                id="storageConfig"
-                class="p-select-native"
-                [formField]="fileForm.storageConfigId"
-              >
-                <option value="">Select storage configuration...</option>
-                @for (config of availableConfigs(); track config.id) {
-                  <option [value]="config.id">
-                    {{ config.name }} ({{ getProviderLabel(config.storage) }})
-                  </option>
-                }
-              </select>
-              @if (availableConfigs().length === 0 && !isLoadingConfigs()) {
-                <small class="text-warn block mt-2">
-                  <i class="pi pi-exclamation-triangle mr-1"></i>
-                  No storage configurations found. Please create one first.
-                </small>
-              }
-            </div>
-
-            <!-- Folder Selection -->
-            <div class="field">
-              <label for="folder" class="block font-medium mb-2"
-                >Folder (Optional)</label
-              >
-              <select
-                id="folder"
-                class="p-select-native"
-                [formField]="fileForm.folderId"
-              >
-                <option value="">No folder (root level)</option>
-                @for (folder of availableFolders(); track folder.id) {
-                  <option [value]="folder.id">{{ folder.name }}</option>
-                }
-              </select>
-              @if (availableFolders().length === 0 && !isLoadingFolders()) {
-                <small class="text-muted-color block mt-2">
-                  <i class="pi pi-info-circle mr-1"></i>
-                  No folders available. File will be uploaded to root level.
-                </small>
-              }
-            </div>
-          </div>
-        } @else {
-          <!-- Folder Selection for Edit Mode -->
-          <div class="field mb-4">
-            <label for="folder" class="block font-medium mb-2"
-              >Folder (Optional)</label
-            >
-            <select
-              id="folder"
-              class="p-select-native"
-              [formField]="fileForm.folderId"
-            >
-              <option value="">No folder (root level)</option>
-              @for (folder of availableFolders(); track folder.id) {
-                <option [value]="folder.id">{{ folder.name }}</option>
-              }
-            </select>
-            @if (availableFolders().length === 0 && !isLoadingFolders()) {
-              <small class="text-muted-color block mt-2">
-                <i class="pi pi-info-circle mr-1"></i>
-                No folders available.
-              </small>
-            }
-          </div>
-        }
-
-        <!-- File Upload (only for new files) -->
-        @if (!isEditMode()) {
-          <div class="field mb-4">
-            <label class="block font-medium mb-2">Select File *</label>
-            <p-fileupload
-              #fileUpload
-              [customUpload]="true"
-              (onSelect)="onFileSelect($event)"
-              [multiple]="false"
-              [maxFileSize]="50000000"
-              [showUploadButton]="false"
-              [showCancelButton]="false"
-              chooseLabel="Choose File"
-              chooseIcon="pi pi-upload"
-              accept="*/*"
-              class="w-full"
-            >
-              <ng-template #content let-files>
-                @if (files && files.length > 0) {
-                  <div class="flex flex-col gap-2">
-                    @for (file of files; track file.name) {
-                      <div class="flex items-center gap-3 p-3 border rounded">
-                        <i class="pi pi-file text-2xl"></i>
-                        <div class="flex-1">
-                          <div class="font-medium">{{ file.name }}</div>
-                          <div class="text-sm text-muted-color">
-                            {{ formatFileSize(file.size) }}
-                          </div>
-                        </div>
-                        <p-button
-                          icon="pi pi-times"
-                          [text]="true"
-                          severity="danger"
-                          size="small"
-                          (onClick)="fileUpload.clear()"
-                        />
-                      </div>
-                    }
-                  </div>
-                } @else {
-                  <div
-                    class="flex items-center justify-center flex-col p-8 border-2 border-dashed border-surface-300 rounded"
-                  >
-                    <i
-                      class="pi pi-cloud-upload text-4xl text-muted-color mb-3"
-                    ></i>
-                    <p class="text-muted-color">
-                      Drag and drop file here or click to browse
-                    </p>
-                    <p class="text-sm text-muted-color mt-2">
-                      Maximum file size: 50MB
-                    </p>
-                  </div>
-                }
-              </ng-template>
-            </p-fileupload>
-            @if (!selectedFile() && !isEditMode()) {
-              <small class="text-muted-color"
-                >Please select a file to upload</small
-              >
-            }
-          </div>
-        }
-
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-          <!-- File Name (read-only for uploads, editable for existing) -->
-          <div class="field md:col-span-2">
-            <label for="name" class="block font-medium mb-2">File Name *</label>
-            <input
-              pInputText
-              id="name"
-              [formField]="fileForm.name"
-              [placeholder]="
-                isEditMode()
-                  ? 'Enter file name'
-                  : 'Will be auto-filled from selected file'
-              "
-              class="w-full"
-            />
-          </div>
-
-          <!-- Privacy Toggle -->
-          <div class="field">
-            <label class="p-checkbox-native">
-              <input type="checkbox" [formField]="fileForm.isPrivate" />
-              <span>Private File</span>
-            </label>
-            <small class="text-muted-color block mt-2">
-              {{
-                formModel().isPrivate
-                  ? 'Only users with permission can access'
-                  : 'File is publicly accessible'
-              }}
-            </small>
-          </div>
-        </div>
-
-        <div class="flex gap-2 mt-4">
-          <p-button
-            type="submit"
-            [label]="isEditMode() ? 'Update' : 'Upload'"
-            [icon]="isEditMode() ? 'pi pi-check' : 'pi pi-cloud-upload'"
-            [loading]="isLoading()"
-            [disabled]="
-              !isFormValid() ||
-              (!isEditMode() && !selectedFile()) ||
-              isLoading()
-            "
-          />
-          <p-button
-            type="button"
-            label="Cancel"
-            severity="secondary"
-            icon="pi pi-times"
-            [text]="true"
-            (onClick)="onCancel()"
-          />
-        </div>
-      </form>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: PrimeModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i3.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i3$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: FileManagerFormComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'lib-file-manager-form',
-                    standalone: true,
-                    imports: [AngularModule, PrimeModule, FormField],
-                    template: `
-    <div class="card">
-      <div class="flex justify-between items-center mb-4">
-        <div>
-          <h3 class="text-xl font-semibold">
-            {{ isEditMode() ? 'Edit File' : 'Upload File' }}
-          </h3>
-          @if (showCompanyInfo()) {
-            <p class="text-sm text-muted-color mt-1">
-              Company: {{ currentCompanyName() }}
-            </p>
-          }
-        </div>
-        <p-button
-          label="Back"
-          icon="pi pi-arrow-left"
-          severity="secondary"
-          [text]="true"
-          (onClick)="onCancel()"
-        />
-      </div>
-
-      <form (ngSubmit)="onSubmit()">
-        <!-- Storage Configuration & Folder Selection (only for new files) -->
-        @if (!isEditMode()) {
-          <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-            <!-- Storage Configuration -->
-            <div class="field">
-              <label for="storageConfig" class="block font-medium mb-2"
-                >Storage Configuration *</label
-              >
-              <select
-                id="storageConfig"
-                class="p-select-native"
-                [formField]="fileForm.storageConfigId"
-              >
-                <option value="">Select storage configuration...</option>
-                @for (config of availableConfigs(); track config.id) {
-                  <option [value]="config.id">
-                    {{ config.name }} ({{ getProviderLabel(config.storage) }})
-                  </option>
-                }
-              </select>
-              @if (availableConfigs().length === 0 && !isLoadingConfigs()) {
-                <small class="text-warn block mt-2">
-                  <i class="pi pi-exclamation-triangle mr-1"></i>
-                  No storage configurations found. Please create one first.
-                </small>
-              }
-            </div>
-
-            <!-- Folder Selection -->
-            <div class="field">
-              <label for="folder" class="block font-medium mb-2"
-                >Folder (Optional)</label
-              >
-              <select
-                id="folder"
-                class="p-select-native"
-                [formField]="fileForm.folderId"
-              >
-                <option value="">No folder (root level)</option>
-                @for (folder of availableFolders(); track folder.id) {
-                  <option [value]="folder.id">{{ folder.name }}</option>
-                }
-              </select>
-              @if (availableFolders().length === 0 && !isLoadingFolders()) {
-                <small class="text-muted-color block mt-2">
-                  <i class="pi pi-info-circle mr-1"></i>
-                  No folders available. File will be uploaded to root level.
-                </small>
-              }
-            </div>
-          </div>
-        } @else {
-          <!-- Folder Selection for Edit Mode -->
-          <div class="field mb-4">
-            <label for="folder" class="block font-medium mb-2"
-              >Folder (Optional)</label
-            >
-            <select
-              id="folder"
-              class="p-select-native"
-              [formField]="fileForm.folderId"
-            >
-              <option value="">No folder (root level)</option>
-              @for (folder of availableFolders(); track folder.id) {
-                <option [value]="folder.id">{{ folder.name }}</option>
-              }
-            </select>
-            @if (availableFolders().length === 0 && !isLoadingFolders()) {
-              <small class="text-muted-color block mt-2">
-                <i class="pi pi-info-circle mr-1"></i>
-                No folders available.
-              </small>
-            }
-          </div>
-        }
-
-        <!-- File Upload (only for new files) -->
-        @if (!isEditMode()) {
-          <div class="field mb-4">
-            <label class="block font-medium mb-2">Select File *</label>
-            <p-fileupload
-              #fileUpload
-              [customUpload]="true"
-              (onSelect)="onFileSelect($event)"
-              [multiple]="false"
-              [maxFileSize]="50000000"
-              [showUploadButton]="false"
-              [showCancelButton]="false"
-              chooseLabel="Choose File"
-              chooseIcon="pi pi-upload"
-              accept="*/*"
-              class="w-full"
-            >
-              <ng-template #content let-files>
-                @if (files && files.length > 0) {
-                  <div class="flex flex-col gap-2">
-                    @for (file of files; track file.name) {
-                      <div class="flex items-center gap-3 p-3 border rounded">
-                        <i class="pi pi-file text-2xl"></i>
-                        <div class="flex-1">
-                          <div class="font-medium">{{ file.name }}</div>
-                          <div class="text-sm text-muted-color">
-                            {{ formatFileSize(file.size) }}
-                          </div>
-                        </div>
-                        <p-button
-                          icon="pi pi-times"
-                          [text]="true"
-                          severity="danger"
-                          size="small"
-                          (onClick)="fileUpload.clear()"
-                        />
-                      </div>
-                    }
-                  </div>
-                } @else {
-                  <div
-                    class="flex items-center justify-center flex-col p-8 border-2 border-dashed border-surface-300 rounded"
-                  >
-                    <i
-                      class="pi pi-cloud-upload text-4xl text-muted-color mb-3"
-                    ></i>
-                    <p class="text-muted-color">
-                      Drag and drop file here or click to browse
-                    </p>
-                    <p class="text-sm text-muted-color mt-2">
-                      Maximum file size: 50MB
-                    </p>
-                  </div>
-                }
-              </ng-template>
-            </p-fileupload>
-            @if (!selectedFile() && !isEditMode()) {
-              <small class="text-muted-color"
-                >Please select a file to upload</small
-              >
-            }
-          </div>
-        }
-
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-          <!-- File Name (read-only for uploads, editable for existing) -->
-          <div class="field md:col-span-2">
-            <label for="name" class="block font-medium mb-2">File Name *</label>
-            <input
-              pInputText
-              id="name"
-              [formField]="fileForm.name"
-              [placeholder]="
-                isEditMode()
-                  ? 'Enter file name'
-                  : 'Will be auto-filled from selected file'
-              "
-              class="w-full"
-            />
-          </div>
-
-          <!-- Privacy Toggle -->
-          <div class="field">
-            <label class="p-checkbox-native">
-              <input type="checkbox" [formField]="fileForm.isPrivate" />
-              <span>Private File</span>
-            </label>
-            <small class="text-muted-color block mt-2">
-              {{
-                formModel().isPrivate
-                  ? 'Only users with permission can access'
-                  : 'File is publicly accessible'
-              }}
-            </small>
-          </div>
-        </div>
-
-        <div class="flex gap-2 mt-4">
-          <p-button
-            type="submit"
-            [label]="isEditMode() ? 'Update' : 'Upload'"
-            [icon]="isEditMode() ? 'pi pi-check' : 'pi pi-cloud-upload'"
-            [loading]="isLoading()"
-            [disabled]="
-              !isFormValid() ||
-              (!isEditMode() && !selectedFile()) ||
-              isLoading()
-            "
-          />
-          <p-button
-            type="button"
-            label="Cancel"
-            severity="secondary"
-            icon="pi pi-times"
-            [text]="true"
-            (onClick)="onCancel()"
-          />
-        </div>
-      </form>
-    </div>
-  `,
-                }]
-        }] });
-
-export { FileManagerFormComponent };
-//# sourceMappingURL=flusys-ng-storage-file-manager-form.component-H3OZS0SW.mjs.map