cat-documents-ng 1.0.4 → 1.0.6

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

@@ -0,0 +1,362 @@
+.document-actions-container {
+  margin: 0;
+}
+
+.actions-card {
+  border-radius: 8px;
+  padding: 0.75rem;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+  width: 92%;
+  margin-left: 3%;
+
+  &.pending-card {
+    background-color: #f8f9fa;
+    border: 1px solid #e9ecef;
+  }
+
+  &.accepted-card {
+    background-color: #e8f5e9;
+    border: 1px solid #66bb6a;
+  }
+
+  &.rejected-card {
+    background-color: #feeaea;
+    border: 1px solid #e57373;
+  }
+
+  // StatusId-based card styles
+  &[class*="status-"] {
+    &.status-approved-card {
+      background-color: #e8f5e9;
+      border: 1px solid #66bb6a;
+    }
+
+    &.status-rejected-card {
+      background-color: #feeaea;
+      border: 1px solid #e57373;
+    }
+
+    &.status-pending-card {
+      background-color: #f8f9fa;
+      border: 1px solid #e9ecef;
+    }
+  }
+}
+
+
+
+.actions-buttons {
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+}
+
+.action-btn {
+  padding: 0.5rem 1rem;
+  border-radius: 6px;
+  border: 1px solid;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  min-width: 48%;
+  justify-content: center;
+
+  &:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+
+  i {
+    font-size: 0.875rem;
+  }
+}
+
+// Reject button styles
+.reject-btn {
+  &.default-reject {
+    background-color: #ffffff;
+    border-color: #ef4444;
+    color: #ef4444;
+
+    &:hover:not(:disabled) {
+      background-color: #fef2f2;
+      border-color: #dc2626;
+    }
+  }
+
+  &.secondary-reject {
+    background-color: #f5f5f5;
+    border-color: transparent;
+    color: #4a4a4a;
+
+    &:hover:not(:disabled) {
+      background-color: #edf2f7;
+    }
+  }
+
+  &.primary-reject {
+    background-color: #feeaea;
+    border-color: #e57373;
+    color: #e57373;
+
+    &:hover:not(:disabled) {
+      background-color: #fed7d7;
+      border-color: #fc8181;
+    }
+  }
+
+  // StatusId-based reject button styles
+  &[class*="status-"] {
+    &.status-approved-reject {
+      background-color: #f5f5f5;
+      border-color: transparent;
+      color: #4a4a4a;
+
+      &:hover:not(:disabled) {
+        background-color: #edf2f7;
+      }
+    }
+
+    &.status-rejected-reject {
+      background-color: #feeaea;
+      border-color: #e57373;
+      color: #e57373;
+
+      &:hover:not(:disabled) {
+        background-color: #fed7d7;
+        border-color: #fc8181;
+      }
+    }
+
+    &.status-pending-reject {
+      background-color: #ffffff;
+      border-color: #ef4444;
+      color: #ef4444;
+
+      &:hover:not(:disabled) {
+        background-color: #fef2f2;
+        border-color: #dc2626;
+      }
+    }
+  }
+}
+
+// Accept button styles
+.accept-btn {
+  &.default-accept {
+    background-color: #3b82f6;
+    border-color: #3b82f6;
+    color: #ffffff;
+
+    &:hover:not(:disabled) {
+      background-color: #2563eb;
+      border-color: #2563eb;
+    }
+  }
+
+  &.secondary-accept {
+    background-color: #f5f5f5;
+    border-color: transparent;
+    color: #4a4a4a;
+
+    &:hover:not(:disabled) {
+      background-color: #edf2f7;
+    }
+  }
+
+  &.primary-accept {
+    background-color: #4caf50;
+    border-color: #4caf50;
+    color: white;
+
+    &:hover:not(:disabled) {
+      background-color: #45a049;
+      border-color: #45a049;
+    }
+  }
+
+  // StatusId-based accept button styles
+  &[class*="status-"] {
+    &.status-approved-accept {
+      background-color: #4caf50;
+      border-color: #4caf50;
+      color: white;
+
+      &:hover:not(:disabled) {
+        background-color: #45a049;
+        border-color: #45a049;
+      }
+    }
+
+    &.status-rejected-accept {
+      background-color: #f5f5f5;
+      border-color: transparent;
+      color: #4a4a4a;
+
+      &:hover:not(:disabled) {
+        background-color: #edf2f7;
+      }
+    }
+
+    &.status-pending-accept {
+      background-color: #3b82f6;
+      border-color: #3b82f6;
+      color: #ffffff;
+
+      &:hover:not(:disabled) {
+        background-color: #2563eb;
+        border-color: #2563eb;
+      }
+    }
+  }
+}
+
+
+
+// Dialog styles
+:host ::ng-deep .confirmation-dialog {
+  .p-dialog {
+    border-radius: 8px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    border: none;
+    overflow: hidden;
+  }
+
+  .p-dialog-header {
+    padding: 1.25rem 1.5rem;
+    background-color: white;
+    border-bottom: none;
+    border-top-right-radius:10px ;
+    border-top-left-radius:10px ;
+    .p-dialog-header-icon {
+      display: none;
+    }
+    
+    .p-dialog-title {
+      font-size: 1.125rem;
+      font-weight: 600;
+      color: #2d3748;
+      margin: 0;
+    }
+  }
+
+  .p-dialog-content {
+    padding: 1.5rem;
+    background-color: white;
+  }
+
+  .p-dialog-footer {
+    padding: 1rem 1.5rem;
+    background-color: #f7fafc;
+    border-top: 1px solid #e2e8f0;
+    display: flex;
+    gap: 0.75rem;
+    justify-content: flex-end;
+    border-bottom-right-radius:10px ;
+    border-bottom-left-radius:10px ;
+  }
+}
+
+.dialog-content {
+  .note-label {
+    display: block;
+    margin-bottom: 0.75rem;
+    font-weight: 500;
+    font-size: 0.875rem;
+    color: #2d3748;
+  }
+
+  .note-textarea {
+    width: 100%;
+    min-height: 100px;
+    padding: 0.75rem;
+    border: 1px solid #e2e8f0;
+    border-radius: 6px;
+    font-family: inherit;
+    font-size: 0.875rem;
+    line-height: 1.5;
+    resize: vertical;
+    background-color: white;
+    color: #2d3748;
+
+    &::placeholder {
+      color: #a0aec0;
+    }
+
+    &:focus {
+      outline: none;
+      border-color: #3182ce;
+      box-shadow: 0 0 0 3px rgba(49, 130, 206, 0.1);
+    }
+  }
+}
+
+.dialog-footer {
+  display: flex;
+  gap: 0.75rem;
+  justify-content: flex-end;
+
+  button {
+    min-width: 80px;
+    padding: 0.5rem 1rem;
+    border-radius: 6px;
+    font-weight: 500;
+    font-size: 0.875rem;
+    border: 1px solid;
+    cursor: pointer;
+    transition: all 0.2s ease;
+
+    &.p-button-secondary {
+      background-color: #f7fafc;
+      border-color: #e2e8f0;
+      color: #4a5568;
+
+      &:hover {
+        background-color: #edf2f7;
+        border-color: #cbd5e0;
+      }
+    }
+
+    &.p-button-success {
+      background-color: #38a169;
+      border-color: #38a169;
+      color: white;
+
+      &:hover {
+        background-color: #2f855a;
+        border-color: #2f855a;
+      }
+    }
+
+    &.p-button-danger {
+      background-color: #e53e3e;
+      border-color: #e53e3e;
+      color: white;
+
+      &:hover {
+        background-color: #c53030;
+        border-color: #c53030;
+      }
+    }
+  }
+}
+
+// No actions message styles
+.no-actions-message {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.5rem;
+  min-height: 40px;
+  
+  .no-actions-text {
+    color: #6b7280;
+    font-size: 0.875rem;
+    font-style: italic;
+    text-align: center;
+  }
+} 

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

@@ -0,0 +1,297 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { DocumentActionsComponent } from './document-actions.component';
+import { DocumentActionsService, DocumentAction } from '../../services/document-actions.service';
+import { DialogModule } from 'primeng/dialog';
+import { ButtonModule } from 'primeng/button';
+import { InputTextareaModule } from 'primeng/inputtextarea';
+import { FormsModule } from '@angular/forms';
+import { SHARED } from '../../../../Shared/constant/SHARED';
+import { SessionService } from '../../../../Shared/services/session.service';
+
+describe('DocumentActionsComponent', () => {
+  let component: DocumentActionsComponent;
+  let fixture: ComponentFixture<DocumentActionsComponent>;
+  let mockSessionService: jasmine.SpyObj<SessionService>;
+
+  beforeEach(async () => {
+    const sessionServiceSpy = jasmine.createSpyObj('SessionService', ['getUserRole']);
+
+    await TestBed.configureTestingModule({
+      declarations: [ DocumentActionsComponent ],
+      imports: [
+        DialogModule,
+        ButtonModule,
+        InputTextareaModule,
+        FormsModule
+      ],
+      providers: [ 
+        DocumentActionsService,
+        { provide: SessionService, useValue: sessionServiceSpy }
+      ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(DocumentActionsComponent);
+    component = fixture.componentInstance;
+    mockSessionService = TestBed.inject(SessionService) as jasmine.SpyObj<SessionService>;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should identify Team Leader role correctly', () => {
+    mockSessionService.getUserRole.and.returnValue('TeamLeader');
+    expect(component['isUserTeamLeader']()).toBe(true);
+    
+    mockSessionService.getUserRole.and.returnValue('User');
+    expect(component['isUserTeamLeader']()).toBe(false);
+  });
+
+  it('should identify Underwriter role correctly', () => {
+    mockSessionService.getUserRole.and.returnValue('Underwriter User');
+    expect(component['isUserUnderwriter']()).toBe(true);
+    
+    mockSessionService.getUserRole.and.returnValue('User');
+    expect(component['isUserUnderwriter']()).toBe(false);
+  });
+
+  it('should show accept dialog when accept button is clicked', () => {
+    component.showApproveRejectActions = true;
+    fixture.detectChanges();
+    
+    const acceptButton = fixture.nativeElement.querySelector('.accept-btn');
+    acceptButton.click();
+    fixture.detectChanges();
+    
+    expect(component.showAcceptDialog).toBe(true);
+  });
+
+  it('should show reject dialog when reject button is clicked', () => {
+    component.showApproveRejectActions = true;
+    fixture.detectChanges();
+    
+    const rejectButton = fixture.nativeElement.querySelector('.reject-btn');
+    rejectButton.click();
+    fixture.detectChanges();
+    
+    expect(component.showRejectDialog).toBe(true);
+  });
+
+  it('should emit action when accept is confirmed', () => {
+    spyOn(component.actionPerformed, 'emit');
+    component.acceptNote = 'Test acceptance note';
+    
+    component.onAcceptConfirm();
+    
+    expect(component.actionPerformed.emit).toHaveBeenCalledWith({
+      type: SHARED.ACCEPT_ACTION,
+      note: 'Test acceptance note'
+    });
+    expect(component.showAcceptDialog).toBe(false);
+    expect(component.acceptNote).toBe('');
+  });
+
+  it('should emit action when reject is confirmed', () => {
+    spyOn(component.actionPerformed, 'emit');
+    component.rejectNote = 'Test rejection note';
+    
+    component.onRejectConfirm();
+    
+    expect(component.actionPerformed.emit).toHaveBeenCalledWith({
+      type: SHARED.REJECT_ACTION,
+      note: 'Test rejection note'
+    });
+    expect(component.showRejectDialog).toBe(false);
+    expect(component.rejectNote).toBe('');
+  });
+
+  describe('Button disabled state', () => {
+    it('should disable both buttons when document is approved (lowercase)', () => {
+      component.currentStatus = SHARED.STATUS_ACCEPTED;
+      fixture.detectChanges();
+      
+      expect(component.areButtonsDisabled).toBe(true);
+      expect(component.isDocumentApproved).toBe(true);
+      expect(component.isDocumentRejected).toBe(false);
+    });
+
+    it('should disable both buttons when document is approved (uppercase)', () => {
+      component.currentStatus = SHARED.STATUS_APPROVED;
+      fixture.detectChanges();
+      
+      expect(component.areButtonsDisabled).toBe(true);
+      expect(component.isDocumentApproved).toBe(true);
+      expect(component.isDocumentRejected).toBe(false);
+    });
+
+    it('should disable both buttons when document is rejected (lowercase)', () => {
+      component.currentStatus = SHARED.STATUS_REJECTED_LOWERCASE;
+      fixture.detectChanges();
+      
+      expect(component.areButtonsDisabled).toBe(true);
+      expect(component.isDocumentApproved).toBe(false);
+      expect(component.isDocumentRejected).toBe(true);
+    });
+
+    it('should disable both buttons when document is rejected (uppercase)', () => {
+      component.currentStatus = SHARED.STATUS_REJECTED;
+      fixture.detectChanges();
+      
+      expect(component.areButtonsDisabled).toBe(true);
+      expect(component.isDocumentApproved).toBe(false);
+      expect(component.isDocumentRejected).toBe(true);
+    });
+
+    it('should enable both buttons when document is pending', () => {
+      component.currentStatus = SHARED.STATUS_PENDING;
+      fixture.detectChanges();
+      
+      expect(component.areButtonsDisabled).toBe(false);
+      expect(component.isDocumentApproved).toBe(false);
+      expect(component.isDocumentRejected).toBe(false);
+    });
+
+    it('should handle undefined status gracefully', () => {
+      component.currentStatus = undefined;
+      fixture.detectChanges();
+      
+      expect(component.areButtonsDisabled).toBe(false);
+      expect(component.isDocumentApproved).toBe(false);
+      expect(component.isDocumentRejected).toBe(false);
+    });
+  });
+
+  it('should emit delete action when delete button is clicked', () => {
+    spyOn(component.actionPerformed, 'emit');
+    
+    component.onDeleteClick();
+    
+    expect(component.actionPerformed.emit).toHaveBeenCalledWith({
+      type: SHARED.DELETE_ACTION
+    });
+  });
+
+  it('should close dialogs when cancel is clicked', () => {
+    component.showAcceptDialog = true;
+    component.showRejectDialog = true;
+    component.acceptNote = 'test';
+    component.rejectNote = 'test';
+    
+    component.onCancel();
+    
+    expect(component.showAcceptDialog).toBe(false);
+    expect(component.showRejectDialog).toBe(false);
+    expect(component.acceptNote).toBe('');
+    expect(component.rejectNote).toBe('');
+  });
+
+  it('should return correct card class based on status', () => {
+    component.currentStatus = SHARED.STATUS_PENDING;
+    component.ngOnChanges({});
+    expect(component.cardClass).toBe(SHARED.CARD_PENDING);
+    
+    component.currentStatus = SHARED.STATUS_ACCEPTED;
+    component.ngOnChanges({});
+    expect(component.cardClass).toBe(SHARED.CARD_ACCEPTED);
+    
+    component.currentStatus = SHARED.STATUS_REJECTED_LOWERCASE;
+    component.ngOnChanges({});
+    expect(component.cardClass).toBe(SHARED.CARD_REJECTED);
+  });
+
+  it('should return correct button classes based on status', () => {
+    component.currentStatus = SHARED.STATUS_PENDING;
+    component.ngOnChanges({});
+    expect(component.rejectButtonClass).toBe(SHARED.BUTTON_DEFAULT_REJECT);
+    expect(component.acceptButtonClass).toBe(SHARED.BUTTON_DEFAULT_ACCEPT);
+    
+    component.currentStatus = SHARED.STATUS_ACCEPTED;
+    component.ngOnChanges({});
+    expect(component.rejectButtonClass).toBe(SHARED.BUTTON_SECONDARY_REJECT);
+    expect(component.acceptButtonClass).toBe(SHARED.BUTTON_PRIMARY_ACCEPT);
+    
+    component.currentStatus = SHARED.STATUS_REJECTED_LOWERCASE;
+    component.ngOnChanges({});
+    expect(component.rejectButtonClass).toBe(SHARED.BUTTON_PRIMARY_REJECT);
+    expect(component.acceptButtonClass).toBe(SHARED.BUTTON_SECONDARY_ACCEPT);
+  });
+
+  describe('Action Visibility Logic', () => {
+    it('should show approve/reject actions when isUploaded is false', () => {
+      component.isUploaded = false;
+      component.currentStatus = SHARED.STATUS_PENDING;
+      mockSessionService.getUserRole.and.returnValue('User');
+      
+      component.ngOnChanges({});
+      
+      expect(component.showApproveRejectActions).toBe(true);
+      expect(component.showDeleteAction).toBe(false);
+      expect(component.showNoActions).toBe(false);
+    });
+
+    it('should show delete action when isUploaded is true and user is Team Leader', () => {
+      component.isUploaded = true;
+      component.currentStatus = SHARED.STATUS_ACCEPTED;
+      mockSessionService.getUserRole.and.returnValue('TeamLeader');
+      
+      component.ngOnChanges({});
+      
+      expect(component.showApproveRejectActions).toBe(false);
+      expect(component.showDeleteAction).toBe(true);
+      expect(component.showNoActions).toBe(false);
+    });
+
+    it('should show no actions when document is in pending status', () => {
+      component.isUploaded = false;
+      component.currentStatus = SHARED.STATUS_PENDING;
+      mockSessionService.getUserRole.and.returnValue('User');
+      
+      component.ngOnChanges({});
+      
+      expect(component.showApproveRejectActions).toBe(false);
+      expect(component.showDeleteAction).toBe(false);
+      expect(component.showNoActions).toBe(true);
+    });
+
+    it('should show no actions when document is uploaded by UW and user is not Team Leader', () => {
+      component.isUploaded = true;
+      component.currentStatus = SHARED.STATUS_ACCEPTED;
+      component.document = { uploadedBy: 'UW' };
+      mockSessionService.getUserRole.and.returnValue('User');
+      
+      component.ngOnChanges({});
+      
+      expect(component.showApproveRejectActions).toBe(false);
+      expect(component.showDeleteAction).toBe(false);
+      expect(component.showNoActions).toBe(true);
+    });
+
+    it('should show delete action when document is uploaded by UW and user is Team Leader', () => {
+      component.isUploaded = true;
+      component.currentStatus = SHARED.STATUS_ACCEPTED;
+      component.document = { uploadedBy: 'UW' };
+      mockSessionService.getUserRole.and.returnValue('TeamLeader');
+      
+      component.ngOnChanges({});
+      
+      expect(component.showApproveRejectActions).toBe(false);
+      expect(component.showDeleteAction).toBe(true);
+      expect(component.showNoActions).toBe(false);
+    });
+
+    it('should show no actions when document is uploaded by UW and user is Underwriter', () => {
+      component.isUploaded = true;
+      component.currentStatus = SHARED.STATUS_ACCEPTED;
+      component.document = { uploadedBy: 'UW' };
+      mockSessionService.getUserRole.and.returnValue('Underwriter User');
+      
+      component.ngOnChanges({});
+      
+      expect(component.showApproveRejectActions).toBe(false);
+      expect(component.showDeleteAction).toBe(false);
+      expect(component.showNoActions).toBe(true);
+    });
+  });
+});