cat-documents-ng 1.0.6 → 1.0.7

package/src/lib/document/components/linked-document/linked-document.component.ts

@@ -1,49 +0,0 @@
-import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
-import { DocumentQuery } from '../../state/document.query';
-import { DocumentModel } from '../../models/document.model';
-import { DocumentListItem } from '../../models/document-list-response.model';
-/**
- * Description placeholder
- * @class LinkedDocumentComponent
- * @typedef {LinkedDocumentComponent}
- * @implements {OnChanges}
- */
-@Component({
-  selector: 'app-linked-document',
-  templateUrl: './linked-document.component.html',
-  styleUrl: './linked-document.component.scss',
-  standalone : false
-})
-export class LinkedDocumentComponent {
-  /**
-   * Selected document for view.
-   * @type {?DocumentModel}
-   */
-  @Input() selectedDocument?: DocumentListItem;
-  /**
-   * Whole document list.
-   * @type {?DocumentModel[]}
-   */
-  @Input() documentList?: DocumentListItem[];
-  /**
-   * Changed selected document.
-   * @type {*}
-   */
-  @Output() selectedDocumentChange = new EventEmitter<DocumentListItem>();
-
-  /**
-   * Filtered documents.
-   * @type {DocumentModel[]}
-   */
-  filteredDocuments: DocumentModel[] = [];
-
-  /**
-   * Handle the click on the document.
-   * @param {DocumentModel} document - Clicked document.
-   */
-  handleDocumentClick(document: DocumentListItem): void {
-    this.selectedDocument = document;
-    this.selectedDocumentChange.emit(this.selectedDocument);
-  }
-
-}

package/src/lib/document/components/request-document/request-document.component.html

@@ -1,86 +0,0 @@
-<div class="document-upload-container">
-  <!-- Assignment Section (same structure as upload, without files) -->
-  <div class="assignment-section">
-    <h4>Assign to Applicant(s) or Application <span class="text-red-500">*</span> </h4>
-    <div class="radio-group">
-      <div class="radio-item">
-        <p-radioButton 
-          name="assignmentType" 
-          value="Applicant" 
-          [(ngModel)]="selectedAssignmentType"
-          (onClick)="onAssignmentTypeChange()"
-          [inputId]="'req-applicant'"
-        ></p-radioButton>
-        <label [for]="'req-applicant'" class="radio-label">Applicant(s)</label>
-      </div>
-      <div class="radio-item">
-        <p-radioButton 
-          name="assignmentType" 
-          value="Application" 
-          [(ngModel)]="selectedAssignmentType"
-          (onClick)="onAssignmentTypeChange()"
-          [inputId]="'req-application'"
-        ></p-radioButton>
-        <label [for]="'req-application'" class="radio-label">Application</label>
-      </div>
-    </div>
-  </div>
-
-  <!-- Applicant Selection (only when Applicant is selected) -->
-  <div class="applicant-section" *ngIf="selectedAssignmentType === 'Applicant'">
-    <h4>Select Applicant(s) <span class="text-red-500">*</span></h4>
-    <div class="grid">
-      <div 
-        *ngFor="let applicant of filteredApplicantList" 
-        class="applicant-item col-12 md:col-6"
-      >
-        <p-radioButton 
-          name="reqSelectedApplicant"
-          [value]="applicant._id"
-          [(ngModel)]="selectedApplicant"
-          [inputId]="'req-applicant-' + applicant._id"
-          (onClick)="onApplicantSelectionChange()"
-        ></p-radioButton>
-        <label [for]="'req-applicant-' + applicant._id" class="applicant-label">
-          {{ applicant.name }}
-        </label>
-      </div>
-    </div>
-  </div>
-
-  <!-- Category Selection -->
-  <div class="category-section">
-    <h4>Category <span class="text-red-500">*</span></h4>
-    <p-dropdown
-      [options]="categoryOptions"
-      [(ngModel)]="selectedCategory"
-      placeholder="Select Category type"
-      optionLabel="label"
-      optionValue="_id"
-      (onChange)="onCategoryChange()"
-      [disabled]="!categoryOptions.length"
-      class="w-full"
-    ></p-dropdown>
-  </div>
-
-  <!-- Document Type Selection -->
-  <div class="document-type-section">
-    <h4>Document Type <span class="text-red-500">*</span></h4>
-    <p-dropdown
-      [options]="documentTypeOptions"
-      [(ngModel)]="selectedDocumentType"
-      placeholder="Select Document type"
-      optionLabel="label"
-      optionValue="_id"
-      (onChange)="onDocumentTypeChange()"
-      [disabled]="!documentTypeOptions.length || !selectedCategory"
-      class="w-full"
-    ></p-dropdown>
-  </div>
-
-  <!-- Description Field -->
-  <div class="description-section">
-    <h6>Description <span class="text-red-500">*</span></h6>
-    <textarea pInputTextarea [(ngModel)]="description" (ngModelChange)="onDescriptionChange()" rows="4" placeholder="Add description" class="w-full"></textarea>
-  </div>
-</div>

package/src/lib/document/components/request-document/request-document.component.scss

@@ -1,16 +0,0 @@
-.request-document-form {
-  .form-row {
-    display: flex;
-    flex-direction: column;
-    margin-bottom: 1rem;
-  }
-  label {
-    font-weight: 600;
-    margin-bottom: 0.5rem;
-  }
-  select, textarea {
-    padding: 0.5rem;
-  }
-}
-
-

package/src/lib/document/components/request-document/request-document.component.ts

@@ -1,278 +0,0 @@
-import { ChangeDetectorRef, Component, EventEmitter, Input, OnDestroy, OnInit, Output, SimpleChanges, OnChanges } from '@angular/core';
-import { SHARED } from '../../../../Shared/constant/SHARED';
-import { Subject, takeUntil } from 'rxjs';
-import { UserListModel } from '../../models/user-list.model';
-import { DocumentCategory } from '../../models/document-category.model';
-import { DocumentTypeModel } from '../../models/document-type.model';
-import { DocumentUploadService } from '../../services/document-upload.service';
-import { DocumentUploadFormService } from '../../services/document-upload-form.service';
-import { DocumentUploadDataService } from '../../services/document-upload-data.service';
-import { DocumentHttpService } from '../../services/document-http.service';
-import { SessionService } from '../../../../Shared/services/session.service';
-
-@Component({
-  selector: 'lib-request-document',
-  templateUrl: './request-document.component.html',
-  standalone: false
-})
-export class RequestDocumentComponent implements OnInit, OnChanges, OnDestroy {
-  @Input() contextId: string = SHARED.EMPTY;
-  @Input() isRequestSaveBtnClicked: boolean = false;
-  @Input() isRequestSidebarClosed: boolean = false;
-
-  @Output() onFormValidationChange = new EventEmitter<void>();
-  @Output() onRequestSuccess = new EventEmitter<void>();
-  @Output() onRequestError = new EventEmitter<any>();
-  @Output() hasUnsavedChangesChange = new EventEmitter<boolean>();
-
-  selectedAssignmentType: 'Applicant' | 'Application' | null = null;
-  selectedApplicant: string = SHARED.EMPTY;
-  selectedCategory: string = SHARED.EMPTY;
-  selectedDocumentType: string = SHARED.EMPTY;
-  description: string = SHARED.EMPTY;
-
-  applicantList: UserListModel[] = SHARED.EMPTY_ARRAY;
-  filteredApplicantList: UserListModel[] = SHARED.EMPTY_ARRAY;
-  categoryOptions: DocumentCategory[] = SHARED.EMPTY_ARRAY;
-  documentTypeOptions: DocumentTypeModel[] = SHARED.EMPTY_ARRAY;
-
-  isLoadingApplicants: boolean = false;
-  isLoadingCategories: boolean = false;
-  isLoadingDocumentTypes: boolean = false;
-  isSaving: boolean = false;
-  isFormValid: boolean = false;
-
-  private destroy$ = new Subject<void>();
-
-  constructor(
-    public documentUpload: DocumentUploadService,
-    private formService: DocumentUploadFormService,
-    private dataService: DocumentUploadDataService,
-    private cdr: ChangeDetectorRef,
-    private documentHttpService : DocumentHttpService,
-    private sessionService: SessionService
-  ) {}
-
-  ngOnInit(): void {
-    this.resetForm();
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['isRequestSaveBtnClicked'] && changes['isRequestSaveBtnClicked'].currentValue) {
-      this.saveRequestDocument();
-    }
-    if (changes['isRequestSidebarClosed'] && changes['isRequestSidebarClosed'].currentValue) {
-      if (this.isRequestSidebarClosed) {
-        this.resetForm();
-      }
-    }
-  }
-
-  onAssignmentTypeChange(): void {
-    this.resetSelections();
-    this.loadCategories();
-    // Always ensure applicants are loaded; filtering will apply based on assignment type
-    this.loadApplicants();
-    this.validateAndEmit();
-    this.emitUnsavedChanges();
-  }
-
-  onCategoryChange(): void {
-    this.resetDocumentType();
-    if (this.selectedCategory) this.loadDocumentTypes();
-    this.validateAndEmit();
-    this.emitUnsavedChanges();
-  }
-
-  onDocumentTypeChange(): void { this.validateAndEmit(); this.emitUnsavedChanges(); }
-  onApplicantSelectionChange(): void { this.validateAndEmit(); this.emitUnsavedChanges(); }
-  onDescriptionChange(): void { this.validateAndEmit(); this.emitUnsavedChanges(); }
-
-  loadApplicants(): void {
-    this.isLoadingApplicants = true;
-    this.dataService.loadApplicants(
-      this.contextId,
-      (applicants) => this.handleApplicantsLoaded(applicants),
-      (error) => this.handleError('Failed to Load Applicants', error, () => this.isLoadingApplicants = false)
-    ).pipe(takeUntil(this.destroy$)).subscribe({
-      next: (applicants) => {
-        // When assignment type is not yet selected, just cache the list
-        if (!this.selectedAssignmentType) {
-          this.applicantList = applicants;
-          this.filteredApplicantList = applicants;
-          this.isLoadingApplicants = false;
-          return;
-        }
-        this.handleApplicantsLoaded(applicants);
-      },
-      error: (error) => this.handleError('Failed to Load Applicants', error, () => this.isLoadingApplicants = false)
-    });
-  }
-
-  loadCategories(): void {
-    this.isLoadingCategories = true;
-    this.dataService.loadCategories(
-      this.selectedAssignmentType!,
-      (categories) => this.handleCategoriesLoaded(categories),
-      (error) => this.handleError('Failed to Load Categories', error, () => this.isLoadingCategories = false)
-    ).pipe(takeUntil(this.destroy$)).subscribe({
-      next: (categories) => this.handleCategoriesLoaded(categories),
-      error: (error) => this.handleError('Failed to Load Categories', error, () => this.isLoadingCategories = false)
-    });
-  }
-
-  loadDocumentTypes(): void {
-    this.isLoadingDocumentTypes = true;
-    this.dataService.loadDocumentTypes(
-      this.selectedCategory,
-      (documentTypes) => this.handleDocumentTypesLoaded(documentTypes),
-      (error) => this.handleError('Failed to Load Document Types', error, () => this.isLoadingDocumentTypes = false)
-    ).pipe(takeUntil(this.destroy$)).subscribe({
-      next: (documentTypes) => this.handleDocumentTypesLoaded(documentTypes),
-      error: (error) => this.handleError('Failed to Load Document Types', error, () => this.isLoadingDocumentTypes = false)
-    });
-  }
-
-  getSaveButtonDisabled(): boolean {
-    return !this.isFormValid || this.isSaving;
-  }
-
-  saveRequestDocument(): void {
-    if (!this.isFormValid) {
-      this.formService.showWarningMessage('Incomplete Form', 'Please complete all required fields.');
-      return;
-    }
-    if (!this.description || !this.description.trim()) {
-      this.formService.showWarningMessage('Description Required', 'Please add a description.');
-      return;
-    }
-    // build request payload expected by backend
-    const requestedDocumentForId = this.selectedAssignmentType === SHARED.APPLICANT
-      ? this.selectedApplicant
-      : this.contextId;
-    const requesterId = this.sessionService.getUserSession()?.accountId;
-    const requestPayload = {
-      applicationId: this.contextId,
-      requestedDocumentForId: requestedDocumentForId,
-      requestedDocumentType: this.selectedDocumentType,
-      requesterId: requesterId,
-      selectedAssignmentType: this.selectedAssignmentType,
-      description: this.description.trim()
-    };
-
-    this.isSaving = true;
-    this.documentHttpService.documentRequest(requestPayload).subscribe({
-      next: () => {
-        this.isSaving = false;
-        this.onRequestSuccess.emit();
-        this.resetForm();
-      },
-      error: (error) => {
-        this.isSaving = false;
-        this.onRequestError.emit(error);
-      }
-    });
-  }
-
-  resetForm(): void {
-    this.selectedAssignmentType = null;
-    this.selectedApplicant = SHARED.EMPTY;
-    this.selectedCategory = SHARED.EMPTY;
-    this.selectedDocumentType = SHARED.EMPTY;
-    this.description = SHARED.EMPTY;
-    this.filteredApplicantList = [];
-    this.categoryOptions = [];
-    this.documentTypeOptions = [];
-    this.isSaving = false;
-    this.isFormValid = false;
-    this.cdr.detectChanges();
-    this.hasUnsavedChangesChange.emit(false);
-  }
-
-  resetSelections(): void {
-    this.selectedApplicant = this.selectedCategory = this.selectedDocumentType = SHARED.EMPTY;
-    this.documentTypeOptions = SHARED.EMPTY_ARRAY;
-  }
-
-  resetDocumentType(): void {
-    this.selectedDocumentType = SHARED.EMPTY;
-    this.documentTypeOptions = SHARED.EMPTY_ARRAY;
-  }
-
-  handleApplicantLoading(): void {
-    if (this.selectedAssignmentType === SHARED.APPLICANT) {
-      this.loadApplicants();
-    } else {
-      this.filterApplicants();
-    }
-  }
-
-  handleApplicantsLoaded(applicants: UserListModel[]): void {
-    this.applicantList = this.documentUpload.sortListByProperty(applicants, 'name');
-    this.filterApplicants();
-    this.isLoadingApplicants = false;
-    this.validateForm();
-  }
-
-  handleCategoriesLoaded(categories: DocumentCategory[]): void {
-    this.categoryOptions = this.documentUpload.sortListByProperty(categories, 'label');
-    this.isLoadingCategories = false;
-    this.validateForm();
-  }
-
-  handleDocumentTypesLoaded(documentTypes: DocumentTypeModel[]): void {
-    this.documentTypeOptions = this.documentUpload.sortListByProperty(documentTypes, 'label', 'name');
-    this.isLoadingDocumentTypes = false;
-    this.validateForm();
-  }
-
-  filterApplicants(): void {
-    this.filteredApplicantList = this.dataService.handleApplicantsLoaded(
-      this.applicantList, this.selectedAssignmentType
-    );
-  }
-
-  validateForm(): void {
-    const baseValid = Boolean(
-      this.selectedAssignmentType &&
-      this.selectedCategory &&
-      this.selectedDocumentType &&
-      this.description && this.description.trim()
-    );
-    const needsApplicant = this.selectedAssignmentType === SHARED.APPLICANT;
-    const hasRequiredFields = needsApplicant ? (baseValid && !!this.selectedApplicant) : baseValid;
-    const previousState = this.isFormValid;
-    this.isFormValid = hasRequiredFields;
-    if (previousState !== this.isFormValid) {
-      this.onFormValidationChange.emit();
-    }
-  }
-
-  validateAndEmit(): void {
-    this.validateForm();
-    this.onFormValidationChange.emit();
-  }
-
-  /** Emits unsaved changes state based on any field being non-empty */
-  private emitUnsavedChanges(): void {
-    const hasChanges = Boolean(
-      (this.selectedAssignmentType && this.selectedAssignmentType !== SHARED.EMPTY) ||
-      (this.selectedApplicant && this.selectedApplicant !== SHARED.EMPTY) ||
-      (this.selectedCategory && this.selectedCategory !== SHARED.EMPTY) ||
-      (this.selectedDocumentType && this.selectedDocumentType !== SHARED.EMPTY) ||
-      (this.description && this.description.trim() !== SHARED.EMPTY)
-    );
-    this.hasUnsavedChangesChange.emit(hasChanges);
-  }
-
-  handleError(_title: string, _error: any, resetLoading: () => void): void {
-    resetLoading();
-  }
-
-  ngOnDestroy(): void {
-    this.destroy$.next();
-    this.destroy$.complete();
-  }
-}
-
-

package/src/lib/document/components/sidebar/sidebar.component.html

@@ -1,75 +0,0 @@
-<!-- PrimeNG Sidebar with proper backdrop handling -->
-<div *ngIf="visible" class="backdrop-shadow" (click)="handleClose()"></div>
-
-<p-sidebar 
-  [(visible)]="visible"
-  [position]="position"
-  [style]="{width: width}"
-  [dismissible]="true"
-  [showCloseIcon]="false"
-  [appendTo]="'body'"
-  [blockScroll]="blockScroll"
-  (visibleChange)="onVisibleChange($event)"
-  (onShow)="onShow.emit()"
-  (onHide)="onSidebarHide()"
->
-  <ng-template pTemplate="header" *ngIf="title || showCloseButton || showSaveButton">
-    <div class="sidebar-header">
-      <h3 *ngIf="title" class="sidebar-title">{{ title }}</h3>
-      <div class="header-content">
-        <ng-content select="[header]"></ng-content>
-        
-        <p-messages 
-          *ngIf="showSuccessMessage"
-          severity="success"
-          [closable]="false"
-          [style]="{'margin-bottom': '0.5rem'}"
-          class="ml-3"
-        >
-          <ng-template pTemplate="message">
-            <span>{{ successMessage }}</span>
-          </ng-template>
-        </p-messages>
-        
-        <p-messages 
-          *ngIf="showErrorMessage"
-          severity="error"
-          [closable]="false"
-          [style]="{'margin-bottom': '0.5rem'}"
-          class="ml-3"
-        >
-          <ng-template pTemplate="message">
-            <span>{{ errorMessage }}</span>
-          </ng-template>
-        </p-messages>
-
-        <div class="header-actions mr-3">
-          <button 
-            *ngIf="showSaveButton"
-            pButton 
-            type="button" 
-            [label]="saveButtonText"
-            [disabled]="saveButtonDisabled"
-            class="p-button-primary"
-            (click)="onSave.emit()"
-          ></button>
-
-          <button 
-            *ngIf="showCloseButton"
-            pButton 
-            type="button" 
-            icon="pi pi-times"
-            class="p-button-text p-button-rounded"
-            (click)="handleClose()"
-          ></button>
-        </div>
-      </div>
-    </div>
-  </ng-template>
-
-  <ng-template pTemplate="content">
-    <div class="sidebar-content">
-      <ng-content></ng-content>
-    </div>
-  </ng-template>
-</p-sidebar>

package/src/lib/document/components/sidebar/sidebar.component.scss

@@ -1,157 +0,0 @@
-:host {
-  display: block;
-}
-.backdrop-shadow {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background: rgba(0, 0, 0, 0.5);
-  /* Shadow effect */
-  z-index: 1000;
-  /* Ensure it appears below the sidebar */
-}
-.sidebar-header {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  padding: 0;
-  width: 100%;
-  gap: 1rem;
-  ::ng-deep{
-    .p-messages{
-      .p-message-success{
-        margin-left: 2rem;
-        font-size: 15px;
-      }
-      .p-message-wrapper{
-        padding: 1rem 1rem;
-
-      }
-    }
-  }
-}
-
-.sidebar-title {
-  margin: 0;
-  font-size: 1.25rem;
-  font-weight: 600;
-  color: #212529;
-  flex: 0 1 auto;
-  white-space: nowrap;
-  min-width: 0;
-}
-
-.header-content {
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-  justify-content: space-between;
-  width: 100%;
-}
-
-.header-actions {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  margin-left: auto;
-  margin-right: 0;
-}
-
-.close-button {
-  background: none;
-  border: none;
-  color: #6c757d;
-  cursor: pointer;
-  padding: 0.5rem;
-  border-radius: 0.375rem;
-  transition: all 0.2s ease;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 2rem;
-  min-height: 2rem;
-  margin-right: 0.5rem;
-
-  &:hover {
-    background-color: #e9ecef;
-    color: #495057;
-  }
-
-  &:focus {
-    outline: none;
-    box-shadow: 0 0 0 3px rgba(15, 139, 253, 0.3);
-  }
-
-  i {
-    font-size: 1rem;
-  }
-}
-
-.sidebar-content {
-  height: 100%;
-  overflow-y: auto;
-  padding: 0;
-}
-
-/* Custom close button styles */
-.header-actions {
-  .p-button-text.p-button-rounded {
-    width: 2rem;
-    height: 2rem;
-    border-radius: 50%;
-    
-    &:hover {
-      background-color: rgba(0, 0, 0, 0.1);
-    }
-  }
-}
-
-// Custom PrimeNG Sidebar Styles
-::ng-deep {
-  .p-sidebar {
-    .p-sidebar-header {
-      // padding: 1.5rem 1.5rem 0 1.5rem;
-      border-bottom: 1px solid #e9ecef;
-      margin-bottom: 1rem;
-      background-color: #f8f9fa;
-    }
-
-    .p-sidebar-content {
-      padding: 0 1.5rem 1.5rem 1.5rem;
-      height: calc(100% - 80px);
-      overflow-y: auto;
-    }
-
-    &.p-sidebar-right {
-      .p-sidebar-content {
-        padding-left: 1.5rem;
-        padding-right: 1.5rem;
-      }
-    }
-
-    &.p-sidebar-left {
-      .p-sidebar-content {
-        padding-left: 1.5rem;
-        padding-right: 1.5rem;
-      }
-    }
-  }
-
-  // Responsive adjustments
-  @media (max-width: 768px) {
-    .p-sidebar {
-      width: 100% !important;
-      max-width: 100% !important;
-      
-      .p-sidebar-header {
-        padding: 1rem 1rem 0 1rem;
-      }
-      
-      .p-sidebar-content {
-        padding: 0 1rem 1rem 1rem;
-      }
-    }
-  }
-}