cat-documents-ng 1.0.4 → 1.0.6

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

@@ -0,0 +1,163 @@
+import { Component, Input, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
+import { SHARED } from '../../../../Shared/constant/SHARED';
+import { DocumentActionsService, DocumentAction } from '../../services/document-actions.service';
+import { SessionService } from '../../../../Shared/services/session.service';
+
+@Component({
+  selector: 'document-actions',
+  templateUrl: './document-actions.component.html',
+  styleUrls: ['./document-actions.component.scss'],
+  standalone: false
+})
+export class DocumentActionsComponent implements OnChanges {
+  readonly SHARED = SHARED;
+  
+  @Input() document?: any;
+  @Input() documentId?: string;
+  @Input() currentStatus?: string;
+  @Input() isLoading?: boolean = false;
+  @Input() isUploaded?: boolean = false;
+  @Input() statusId?: string;
+  @Output() actionPerformed = new EventEmitter<DocumentAction>();
+
+  showAcceptDialog = false;
+  showRejectDialog = false;
+  acceptNote = SHARED.EMPTY;
+  private _rejectNote = SHARED.EMPTY;
+  userRole: any = SHARED.EMPTY;
+  // Action processing flags
+  isAccepting = false;
+  isRejecting = false;
+
+  // Computed properties for template
+  cardClass: string = SHARED.CARD_PENDING;
+  rejectButtonClass: string = SHARED.BUTTON_DEFAULT_REJECT;
+  acceptButtonClass: string = SHARED.BUTTON_DEFAULT_ACCEPT;
+  isRejectNoteEmpty: boolean = true;
+
+  // Action visibility computed properties
+  showApproveRejectActions: boolean = false;
+  showNoActions: boolean = false;
+
+  constructor(
+    private documentActionsService: DocumentActionsService,
+    private sessionService: SessionService
+  ) {}
+
+  get rejectNote(): string {
+    return this._rejectNote;
+  }
+
+  set rejectNote(value: string) {
+    this._rejectNote = value;
+    this.updateRejectNoteEmpty();
+  }
+
+  /**
+   * Checks if both action buttons should be disabled
+   * @returns {boolean} True if both buttons should be disabled
+   */
+  get areButtonsDisabled(): boolean {
+    return this.isDocumentApproved || this.isDocumentRejected;
+  }
+
+  /**
+   * Checks if the document is approved (case-insensitive)
+   * @returns {boolean} True if document is approved
+   */
+  get isDocumentApproved(): boolean {
+    return this.currentStatus?.toLowerCase() === SHARED.STATUS_ACCEPTED.toLowerCase() ||
+           this.currentStatus?.toLowerCase() === SHARED.STATUS_APPROVED.toLowerCase();
+  }
+
+  /**
+   * Checks if the document is rejected (case-insensitive)
+   * @returns {boolean} True if document is rejected
+   */
+  get isDocumentRejected(): boolean {
+    return this.currentStatus?.toLowerCase() === SHARED.STATUS_REJECTED_LOWERCASE.toLowerCase() ||
+           this.currentStatus?.toLowerCase() === SHARED.STATUS_REJECTED.toLowerCase();
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    this.updateComputedProperties();
+    if (changes['isLoading'] && !this.isLoading) {
+      this.resetActionFlags();
+    }
+  }
+
+  /**
+   * Updates computed properties based on currentStatus and statusId
+   */
+  private updateComputedProperties(): void {
+    this.cardClass = this.documentActionsService.calculateCardClass(this.currentStatus, this.statusId);
+    this.rejectButtonClass = this.documentActionsService.calculateRejectButtonClass(this.currentStatus, this.statusId);
+    this.acceptButtonClass = this.documentActionsService.calculateAcceptButtonClass(this.currentStatus, this.statusId);
+    this.updateRejectNoteEmpty();
+  }
+
+  /**
+   * Checks if the current user is a Team Leader
+   * @returns {boolean} True if user is Team Leader
+   */
+  isUserTeamLeader(): boolean {
+    this.userRole = this.sessionService.getUserRole();
+    return this.userRole === SHARED.TEAM_LEADER;
+  }
+
+  /**
+   * Checks if the current user is an Underwriter
+   * @returns {boolean} True if user is Underwriter
+   */
+  isUserUnderwriter(): boolean {
+     this.userRole = this.sessionService.getUserRole();
+    return this.userRole === SHARED.UNDERWRITER_USER;
+  }
+
+  /**
+   * Updates the isRejectNoteEmpty property based on current rejectNote value
+   */
+  updateRejectNoteEmpty(): void {
+    this.isRejectNoteEmpty = !this.rejectNote || this.rejectNote.trim() === SHARED.EMPTY;
+  }
+
+  /**
+   * Resets the action processing flags
+   */
+  private resetActionFlags(): void {
+    this.isAccepting = false;
+    this.isRejecting = false;
+  }
+
+  onAcceptClick(): void {
+    this.showAcceptDialog = true;
+  }
+
+  onRejectClick(): void {
+    this.showRejectDialog = true;
+  }
+
+
+
+  onAcceptConfirm(): void {
+    this.isAccepting = true;
+    this.actionPerformed.emit(this.documentActionsService.createAcceptAction(this.acceptNote));
+    this.acceptNote = SHARED.EMPTY;
+    this.showAcceptDialog = false;
+  }
+
+  onRejectConfirm(): void {
+    this.isRejecting = true;
+    this.actionPerformed.emit(this.documentActionsService.createRejectAction(this.rejectNote));
+    this.rejectNote = SHARED.EMPTY;
+    this.showRejectDialog = false;
+  }
+
+  onCancel(): void {
+    this.showAcceptDialog = false;
+    this.showRejectDialog = false;
+    this.acceptNote = SHARED.EMPTY;
+    this.rejectNote = SHARED.EMPTY;
+  }
+
+} 

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

@@ -0,0 +1,36 @@
+<div class="grid m-0 flex document-container-layout">
+  <div class="menu-panel col-12 md:col-2">
+    <lib-documents-menu 
+      [catagories]="catagories" 
+      [applicationNumber]="applicationNumber" 
+      [contextId]="contextId"
+      (menuItemSelected)="onMenuItemSelected($event)">
+    </lib-documents-menu>
+  </div>
+  
+  <div class="content-panel col-12 md:col-10" #contentScrollContainer>
+    <div class="content-card">
+      <lib-folder-container [contextId]="contextId" [userList]="userList"  [statusData]="statusData" [categories]="catagories"></lib-folder-container>
+    </div>
+    <div>
+      <lib-document-list  
+        [contextId]="contextId" 
+        [documentListResponse]="documentListResponse"
+        [selectedMenuItemId]="selectedMenuItemId"
+        [navigationInfo]="navigationInfo"
+        (handleSelectedDocumentInNewTab)="onDocumentSelectedInNewTab($event)"
+        (handleSelectedDocument)="onDocumentSelected($event)"
+        >
+        <ng-content></ng-content>
+      </lib-document-list>
+    </div>
+  </div>
+  <p-confirmDialog 
+    [style]="{width: '25vw'}" 
+    acceptLabel="Yes"
+    rejectLabel="No"
+    appendTo="body"
+    acceptIcon="pi pi-check"
+    rejectIcon="pi pi-times">
+  </p-confirmDialog>
+</div>

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

@@ -0,0 +1,144 @@
+// Grid Layout Styles
+.document-container-layout {
+  display: grid;
+  grid-template-columns: 1fr;
+  height: 98vh;
+  overflow: auto;
+  position: relative;
+  
+  @media (min-width: 768px) {
+    grid-template-columns: 16.6667% 1fr;
+  }
+}
+
+.menu-panel {
+  background-color: #ffffff;
+  overflow-y: auto;
+  overflow-x: hidden;
+  
+  @media (min-width: 768px) {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    width: 16.6667%;
+  }
+  
+  // Hide scrollbar but maintain scroll functionality
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none; /* IE and Edge */
+  
+  &::-webkit-scrollbar {
+    display: none; /* Chrome, Safari and Opera */
+  }
+}
+
+.content-panel {
+  display: flex;
+  flex-direction: column;
+  height: 98vh;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding: 0;
+  
+  @media (min-width: 768px) {
+    margin-left: 16.6667%;
+  }
+  
+  // Ensure this is the only scrollable container
+  position: relative;
+  z-index: 10; // Higher z-index for content
+  
+  // Hide scrollbar but maintain scroll functionality
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none; /* IE and Edge */
+  
+  &::-webkit-scrollbar {
+    display: none; /* Chrome, Safari and Opera */
+  }
+}
+
+// Responsive design
+@media (max-width: 1024px) {
+  .menu-panel {
+    width: 240px;
+  }
+  
+  .content-panel {
+    margin-left: 240px;
+  }
+}
+
+@media (max-width: 768px) {
+  .document-container-layout {
+    grid-template-columns: 1fr;
+  }
+  
+  .menu-panel {
+    position: relative;
+    width: 100%;
+    height: 200px;
+    border-right: none;
+    border-bottom: 1px solid #e5e7eb;
+    z-index: auto; // Reset z-index on mobile
+  }
+  
+  .content-panel {
+    margin-left: 0;
+    flex: 1;
+  }
+}
+
+// Legacy scroll styles (keeping for backward compatibility)
+.custom-scroll{
+    overflow-y: hidden;
+    scrollbar-gutter: stable;
+  }
+  
+  .custom-scroll:hover {
+    overflow-y: auto;
+  }
+
+// Ensure no double scrollbars
+* {
+  scrollbar-width: thin;
+}
+
+// Remove problematic body overflow restrictions that break dialogs
+// body, html {
+//   overflow: hidden;
+//   height: 100%;
+// }
+
+// Override any conflicting scroll styles
+body, html {
+  height: 100%;
+  // Don't force overflow hidden as it breaks dialog positioning
+}
+
+// Override PrimeNG card styles that might cause scroll issues
+::ng-deep .p-card {
+  overflow: visible !important;
+}
+
+::ng-deep .p-card-body {
+  overflow: visible !important;
+}
+
+// Ensure dialogs appear above everything
+::ng-deep .p-dialog {
+  z-index: 9999 !important;
+}
+
+::ng-deep .p-dialog-mask {
+  z-index: 9998 !important;
+}
+
+// Ensure no nested scroll containers
+// ::ng-deep .content-panel * {
+//   overflow: visible !important;
+// }
+
+::ng-deep .content-panel .p-card {
+  overflow: visible !important;
+}

package/src/lib/document/components/document-container/document-container.component.spec.ts

@@ -0,0 +1,110 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { DocumentContainerComponent } from './document-container.component';
+import { of, throwError } from 'rxjs';
+import { DocumentHttpService } from '../../services/document-http.service';
+import { DocumentStore } from '../../state/document.store';
+import { DocumentQuery } from '../../state/document.query';
+import { DocumentService } from '../../state/document.service';
+import { CommonModule } from '@angular/common';
+import { HttpClientModule } from '@angular/common/http';
+import { SHARED } from '../../../../Shared/constant/SHARED';
+import { DocumentListComponent } from '../document-list/document-list.component';
+import { MessageService } from 'primeng/api';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { DialogModule } from 'primeng/dialog';
+
+describe('DocumentContainerComponent', () => {
+  let component: DocumentContainerComponent;
+  let fixture: ComponentFixture<DocumentContainerComponent>;
+  let mockDocumentHttpService: jasmine.SpyObj<DocumentHttpService>;
+  let mockDocumentStore: jasmine.SpyObj<DocumentStore>;
+  let mockDocumentQuery: jasmine.SpyObj<DocumentQuery>;
+  let mockDocumentService: jasmine.SpyObj<DocumentService>;
+
+  const dummyFolders = [
+    { _id: '1', name: 'Folder A', documentCount: 2 },
+    { _id: '2', name: 'Folder B', documentCount: 0 }
+  ];
+
+  const dummyDocuments = [
+    { _id: 'doc1', name: 'Document 1' },
+    { _id: 'doc2', name: 'Document 2' }
+  ];
+
+  beforeEach(async () => {
+    mockDocumentHttpService = jasmine.createSpyObj('DocumentHttpService', [
+      'getFoldersData',
+      'getDocumentByFolderID',
+      'getDocumentTypes' // ✅ Fix added here
+    ]);
+    mockDocumentHttpService.getDocumentTypes.and.returnValue(of([])); // ✅ Return dummy value
+  
+    mockDocumentStore = jasmine.createSpyObj('DocumentStore', ['setDocumentList']);
+    mockDocumentQuery = jasmine.createSpyObj('DocumentQuery', ['selectParentDocumentTypeId']);
+    mockDocumentService = jasmine.createSpyObj('DocumentService', ['dummy']);
+  
+    await TestBed.configureTestingModule({
+      declarations: [DocumentContainerComponent, DocumentListComponent],
+      imports: [CommonModule, HttpClientModule, DialogModule],
+      providers: [
+        { provide: DocumentHttpService, useValue: mockDocumentHttpService },
+        { provide: DocumentStore, useValue: mockDocumentStore },
+        { provide: DocumentQuery, useValue: mockDocumentQuery },
+        { provide: DocumentService, useValue: mockDocumentService },
+        MessageService
+      ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA]
+    }).compileComponents();
+  });
+  
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DocumentContainerComponent);
+    component = fixture.componentInstance;
+    component.contextId = 'abc123';
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should fetch folders and documents on ngOnInit', () => {
+    mockDocumentHttpService.getFoldersData.and.returnValue(of(dummyFolders));
+    mockDocumentQuery.selectParentDocumentTypeId.and.returnValue(of(null));
+    mockDocumentHttpService.getDocumentByFolderID.and.returnValue(of(dummyDocuments));
+
+    fixture.detectChanges(); // triggers ngOnInit
+
+    expect(mockDocumentHttpService.getFoldersData).toHaveBeenCalledWith('abc123');
+    expect(mockDocumentHttpService.getDocumentByFolderID).toHaveBeenCalledWith('1', 'abc123');
+    expect(mockDocumentStore.setDocumentList).toHaveBeenCalledWith(dummyDocuments);
+    expect(component.folderList.length).toBe(1); // Only folder with doc count > 0
+    expect(component.documentList.length).toBe(2);
+  });
+
+  it('should handle folder fetch error', () => {
+    const consoleSpy = spyOn(console, 'error');
+    mockDocumentHttpService.getFoldersData.and.returnValue(throwError(() => new Error('Error fetching folders')));
+    mockDocumentQuery.selectParentDocumentTypeId.and.returnValue(of(null));
+
+    fixture.detectChanges();
+
+    expect(consoleSpy).toHaveBeenCalled();
+  });
+
+  it('should handle document fetch error', () => {
+    const consoleSpy = spyOn(console, 'error');
+    mockDocumentHttpService.getFoldersData.and.returnValue(of(dummyFolders));
+    mockDocumentQuery.selectParentDocumentTypeId.and.returnValue(of(null));
+    mockDocumentHttpService.getDocumentByFolderID.and.returnValue(throwError(() => new Error('Error fetching docs')));
+
+    fixture.detectChanges();
+
+    expect(consoleSpy).toHaveBeenCalled();
+  });
+
+  it('should unsubscribe on destroy', () => {
+    spyOn(component['subscription'], 'unsubscribe');
+    component.ngOnDestroy();
+    expect(component['subscription'].unsubscribe).toHaveBeenCalled();
+  });
+});