cat-documents-ng 0.0.4 → 0.0.6

package/projects/cat-document-lib/src/Shared/constant/SHARED.ts

@@ -0,0 +1,232 @@
+/**
+ * The `SHARED` class contains shared constants used across the application.
+ * These constants are related to document statuses and other shared data.
+ */
+export class SHARED {
+  /**
+   * Represents the count of missing files.
+   */
+  static MISSINGCOUNT = 2;
+
+  /**
+   * Represents the count of pending files.
+   */
+  static PENDINGCOUNT = 3;
+
+  /**
+   * Represents an empty string.
+   */
+  static EMPTY = "";
+
+  /**
+   * Represents an true.
+   * @static
+   * @type {boolean}
+   */
+  static TRUE: boolean = true;
+
+
+  /**
+   * Represents an false.
+   * @static
+   * @type {boolean}
+   */
+  static FALSE: boolean = false;
+
+  /**
+   * Represents an INITIAL_COUNT.
+   */
+  static INITIAL_COUNT = 0
+  /**
+   * Represents an INITIAL_VALUE.
+   */
+  static INITIAL_VALUE = 0
+
+  /**
+   * Represents the constant value for one (1).
+   * @static
+   * @type {number}
+   */
+  static ONE: number = 1
+
+  /**
+   * Represents the constant value for two (2).
+   * @static
+   * @type {number}
+   */
+  static TWO: number = 2
+
+  /**
+   * Represents the constant value for ten (10).
+   * @static
+   * @type {number}
+   */
+  static TEN: number = 10
+
+  /**
+   * Represents the constant string value 'files' used for file-related operations.
+   * @static
+   * @type {string}
+   */
+  static FILE: string = 'file';
+
+  /**
+   * Represents the array of file size units ('B', 'KB', 'MB') used for file size formatting.
+   * @static
+   * @type {string[]}
+   */
+  static FILE_SIZE_UNITS: string[] = ['B', 'KB', 'MB'];
+
+  /**
+   * Show SEVERITY value.
+   * @static
+   * @type {'error'}
+   */
+  static SEVERITY:string = 'error'
+
+  /**
+   * Show upload summery if it's failed.
+   * @static
+   * @type {'Upload Failed'}
+   */
+  static UPLOAD_SUMMERY:string = 'Upload Failed'
+
+  /**
+   * Represent empty array.
+   * @static
+   * @type {{}}
+   */
+  static EMPTY_ARRAY = []
+
+  /**
+   * Represent contextId.
+   * @static
+   * @type {string}
+   */
+  static CONTEXT_ID : string = 'contextId'
+  
+  /**
+   * Represent fileSize.
+   * @static
+   * @type {string}
+   */
+  static FILE_SIZE : string = 'fileSize'
+}
+
+/**
+ * `DUMMYDOCUMENTLIST` is a mock list of document objects used for testing and development purposes.
+ * Each document includes an ID, file name, status, and document URL.
+ */
+export const DUMMYDOCUMENTLIST = [
+  {
+    _id: 1,
+    fileName: 'Document 1',
+    status: 'pending',
+    documentUrl: 'https://vadimdez.github.io/ng2-pdf-viewer/assets/pdf-test.pdf',
+  },
+  {
+    _id: 2,
+    fileName: 'Document 2',
+    status: 'verified',
+    documentUrl: 'https://vadimdez.github.io/ng2-pdf-viewer/assets/pdf-test.pdf',
+  },
+  {
+    _id: 3,
+    fileName: 'Document 3',
+    status: 'sentReminder',
+    documentUrl: 'https://vadimdez.github.io/ng2-pdf-viewer/assets/pdf-test.pdf',
+  },
+  {
+    _id: 4,
+    fileName: 'Document 4',
+    status: 'pending',
+    documentUrl: 'https://vadimdez.github.io/ng2-pdf-viewer/assets/pdf-test.pdf',
+  },
+];
+
+/**
+ * `FOLDERPANEL` is a mock list of folder data representing various folders in the application.
+ * Each folder contains an ID, file count, text description, missing files count, and pending files count.
+ */
+export const FOLDERPANEL = [
+  {
+    _id: 'folder1',
+    fileCount: 10,
+    text: 'Documents',
+    missingFiles: 3,
+    pendingFiles: 2,
+  },
+  {
+    _id: 'folder2',
+    fileCount: 5,
+    text: 'Images',
+    missingFiles: 0,
+    pendingFiles: 1,
+  },
+  {
+    _id: 'folder3',
+    fileCount: 20,
+    text: 'Reports',
+    missingFiles: 5,
+    pendingFiles: 0,
+  },
+  {
+    _id: 'folder4',
+    fileCount: 8,
+    text: 'Videos',
+    missingFiles: 0,
+    pendingFiles: 0,
+  },
+  {
+    _id: 'folder5',
+    fileCount: 15,
+    text: 'Archives',
+    missingFiles: 1,
+    pendingFiles: 3,
+  }
+];
+
+/**
+ * Dummy data for sumaery.
+ * @type {{}}
+ */
+export const DUMMYSUMMARY = [
+  {
+    status: 'Valuation report requested on 10th Oct 2024',
+    date: '15/10/2020 10:30',
+    icon: 'pi pi-shopping-cart',
+    color: '#9C27B0',
+    image: 'game-controller.jpg',
+  },
+  {
+    status: 'Valuation report received on 13th Oct 2024',
+    date: '15/10/2020 14:00',
+    icon: 'pi pi-cog',
+    color: '#673AB7',
+  },
+  {
+    status: 'Waiting for Valuation Report to be accepted',
+    date: '15/10/2020 16:15',
+    icon: 'pi pi-shopping-cart',
+    color: '#FF9800',
+  },
+];
+
+/**
+ * Dummy data for list box.
+ * @type {{}}
+ */
+export const COUNTRIES = [
+  { name: 'Any Word', code: 'NY', checked: false },
+  { name: 'Case Sensitive', code: 'RM', checked: false },
+  { name: 'Wildcard Search', code: 'LDN', checked: false },
+  { name: 'Whole Word Only', code: 'IST', checked: false },
+];
+
+/**
+ * Default supported image types.
+ * @type {{}}
+ */
+export const SUPPORTED_IMAGE_TYPES = [
+  'image/png'
+];

package/{Shared/constant/URLS.d.ts → projects/cat-document-lib/src/Shared/constant/URLS.ts}

@@ -1,29 +1,31 @@
-/**
- * Class that holds the URLs used throughout the application.
- * These URLs are typically used for making API requests and accessing various resources.
- * @class URLS
- * @typedef {URLS}
- */
-export declare class URLS {
-    /**
-     * The URL to fetch the application configuration file.
-     * This JSON file typically contains settings and options for the application.
-     * @static
-     * @type {string}
-     */
-    static CONFIGFILEURL: string;
-    /**
-     * The URL endpoint for document uploads.
-     * Used to send documents to the server for storage or processing.
-     * @static
-     * @type {string}
-     */
-    static DOCUMENT_UPLOAD: string;
-    /**
-     * The query parameter to pass a context ID in API requests.
-     * Used to specify the context for certain API calls, such as filtering or scoping the request.
-     * @static
-     * @type {string}
-     */
-    static CONTEXT: string;
-}
+/**
+ * Class that holds the URLs used throughout the application.
+ * These URLs are typically used for making API requests and accessing various resources.
+ * @class URLS
+ * @typedef {URLS}
+ */
+export class URLS {
+    /**
+     * The URL to fetch the application configuration file.
+     * This JSON file typically contains settings and options for the application.
+     * @static
+     * @type {string}
+     */
+    static CONFIGFILEURL = "assets/config/app.config.json";
+
+    /**
+     * The URL endpoint for document uploads.
+     * Used to send documents to the server for storage or processing.
+     * @static
+     * @type {string}
+     */
+    static DOCUMENT_UPLOAD = "documents";
+
+    /**
+     * The query parameter to pass a context ID in API requests.
+     * Used to specify the context for certain API calls, such as filtering or scoping the request.
+     * @static
+     * @type {string}
+     */
+    static CONTEXT = "?contextId=";
+}

package/projects/cat-document-lib/src/Shared/services/app-config.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { AppConfigService } from './app-config.service';
+
+describe('AppConfigService', () => {
+  let service: AppConfigService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(AppConfigService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

package/projects/cat-document-lib/src/Shared/services/app-config.service.ts

@@ -0,0 +1,73 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { firstValueFrom } from 'rxjs';
+import { URLS } from '../constant/URLS';
+
+/**
+ * Service that handles loading and providing configuration settings for the application.
+ * It fetches configuration data from a remote server and exposes various configuration options.
+ * @class AppConfigService
+ * @typedef {AppConfigService}
+ */
+@Injectable({
+  providedIn: 'root'
+})
+export class AppConfigService {
+
+  /**
+   * Holds the configuration data loaded from the server.
+   * @private
+   * @type {*}
+   */
+  private appConfig: any;
+
+  /**
+   * Creates an instance of AppConfigService.
+   * Initializes the HttpClient for making HTTP requests.
+   * @class
+   * @param {HttpClient} http - The HttpClient service used for making HTTP requests.
+   */
+  constructor(private http: HttpClient) {}
+
+  /**
+   * Loads the application configuration from the server by making an HTTP request to the configuration URL.
+   * This method retrieves the configuration data and assigns it to the appConfig property.
+   * @async
+   * @returns {*}
+   */
+  async loadAppConfig() {
+    try {
+      this.appConfig = await firstValueFrom(this.http.get(URLS.CONFIGFILEURL));
+    } catch (error) {
+      throw new Error("Api url is missing.")
+    }
+  }
+  
+
+  /**
+   * Returns the base URL for the API from the loaded configuration.
+   * @readonly
+   * @type {*}
+   */
+  get apiBaseUrl() {
+    return this.appConfig?.apiUrl;
+  }
+
+  /**
+   * Returns the local server API URL from the loaded configuration.
+   * @readonly
+   * @type {*}
+   */
+  get localServerApi() {
+    return this.appConfig?.localServerApi;
+  }
+
+  /**
+   * Returns the visibility options from the loaded configuration.
+   * @readonly
+   * @type {*}
+   */
+  get visibilityOptions() {
+    return this.appConfig?.visibilityOption;
+  }
+}

package/{Shared/services/global-error.handler.d.ts → projects/cat-document-lib/src/Shared/services/global-error.handler.ts}

@@ -1,27 +1,29 @@
-import { ErrorHandler, Injector } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * GlobalErrorHandler is a custom error handler that implements the ErrorHandler interface.
- * It is used to handle both HTTP errors and other types of errors globally in the application.
- * @class
- * @implements {ErrorHandler}
- * @decorator {Injectable}
- */
-export declare class GlobalErrorHandler implements ErrorHandler {
-    private injector;
-    /**
-     * Creates an instance of GlobalErrorHandler.
-     * @constructor
-     * @param {Injector} injector - The Angular injector used to get instances of services.
-     */
-    constructor(injector: Injector);
-    /**
-     * Handles errors globally in the application.
-     *
-     * @param {any} error - The error object that needs to be handled.
-     * @returns {void}
-     */
-    handleError(error: any): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<GlobalErrorHandler, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<GlobalErrorHandler>;
-}
+import { ErrorHandler, Injectable, Injector } from '@angular/core';
+import { HttpErrorResponse } from '@angular/common/http';
+
+/**
+ * GlobalErrorHandler is a custom error handler that implements the ErrorHandler interface.
+ * It is used to handle both HTTP errors and other types of errors globally in the application.
+ * @class
+ * @implements {ErrorHandler}
+ * @decorator {Injectable}
+ */
+@Injectable()
+export class GlobalErrorHandler implements ErrorHandler {
+    /**
+     * Creates an instance of GlobalErrorHandler.
+     * @constructor
+     * @param {Injector} injector - The Angular injector used to get instances of services.
+     */
+    constructor(private injector: Injector) { }
+
+    /**
+     * Handles errors globally in the application.
+     * 
+     * @param {any} error - The error object that needs to be handled.
+     * @returns {void}
+     */
+    handleError(error: any): void {
+        console.error('GlobalErrorHandler:', error);
+    }
+}

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

@@ -0,0 +1,6 @@
+<div class="grid m-0">
+    <div class="col-12 md:col-12 lg:col-12 overflow-y-scroll py-0 pl-0" >
+      <lib-folder-container [documentList]="documentList"></lib-folder-container>
+      <lib-document-list [documentList]="documentList"></lib-document-list>
+    </div>
+</div>

package/projects/cat-document-lib/src/lib/document/components/document-container/document-container.component.ts

@@ -0,0 +1,82 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { SHARED } from '../../../../Shared/constant/SHARED';
+import { DocumentService } from '../../state/document.service';
+import { DocumentModel } from '../../models/document.model';
+import { URLS } from '../../../../Shared/constant/URLS';
+import { Subscription } from 'rxjs';
+
+
+/**
+ *This component is responsible for managing and displaying a list of documents.
+ * @class DocumentContainerComponent
+ * @typedef {DocumentContainerComponent}
+ */
+@Component({
+  selector: 'lib-document-container',
+  standalone: false,
+  templateUrl: './document-container.component.html',
+  styleUrl: './document-container.component.scss'
+})
+export class DocumentContainerComponent implements OnInit{
+
+  /**
+   * Creates an instance of DocumentContainerComponent.
+   * @class
+   * @param {DocumentService} documentService - Service to manage document-related operations.
+   */
+  constructor(public documentService : DocumentService){
+
+  }
+  /**
+   * Get contextId in input.
+   * @type {string}
+   */
+  @Input() contextId : string = "786755";
+  /**
+   * The list of dummy documents.
+   * @type {Array}
+   */
+  documentList : DocumentModel[] = []
+
+  /**
+   * Holds the subscription to manage observable cleanup.
+   * @private
+   * @type {Subscription}
+   */
+  private subscription: Subscription = new Subscription();
+
+  /** 
+   * Call document service method to get the document by contextId.
+   */
+  ngOnInit(): void {
+    const documentSubscription = this.documentService
+      .getById(`${URLS.CONTEXT}${this.contextId}`)
+      .subscribe({
+        /**
+         * Handles the successful API response.
+         * @param {DocumentModel[]} res - The list of documents returned by the API.
+         */
+        next: (res: DocumentModel[]) => {
+          if (res) {
+            this.documentList = res;
+          }
+        },
+        /**
+         * Handles errors that occur during the API call.
+         * Logs the error to the console.
+         * @param {any} err - The error object returned from the API.
+         */
+        error: (err) => {
+          throw new Error(err)
+        }
+      });
+    this.subscription.add(documentSubscription);
+  }
+
+  /** 
+   * Unsubscribe subscription on destroy of component .
+   */
+  ngOnDestroy(): void {
+    this.subscription.unsubscribe();
+  }
+}

package/projects/cat-document-lib/src/lib/document/components/document-list/document-list.component.html

@@ -0,0 +1,35 @@
+<div class="document-viewer">
+  <p-dialog [(visible)]="isdialogVisible" [modal]="true" (onHide)="handleCloseModel()" [style]="{ width: '100vw' }"
+    [draggable]="false" [closable]="true">
+    <document-viewer [selectedDocument]="selectedDocument"></document-viewer>
+  </p-dialog>
+</div>
+
+<div class="col-12 p-0">
+  <div class="card p-0 document-list-wrapper">
+    <p-accordion>
+      <p-accordionTab [selected]="true" class="line-height-2 m-0">
+        <ng-template pTemplate="header" let-active="active">
+          <div class="flex  align-items-center justify-content-between w-full">
+            <span class="flex align-items-center  gap-2">
+              Documents
+            </span>
+            <button pButton pRipple class="p-button-raised" type="button" label="Upload File"
+              style="border-radius: 10px;" (click)="handleFileUploadClick($event)"></button>
+          </div>
+        </ng-template>
+        @for(document of documentList; track document){
+        <lib-document-list-item [document]="document"
+          (documentClick)="handleClickForDocument($event)"></lib-document-list-item>
+        }
+      </p-accordionTab>
+    </p-accordion>
+  </div>
+</div>
+<div class="grid">
+  <div class="col-12">
+    <p-sidebar [(visible)]="isSidebarVisible" position="right" [styleClass]="'right-sidebar'">
+      <lib-document-upload [contextId]="contextId"></lib-document-upload>
+    </p-sidebar>
+  </div>
+</div>

package/projects/cat-document-lib/src/lib/document/components/document-list/document-list.component.scss

@@ -0,0 +1,12 @@
+.document-list-wrapper{
+    .p-accordion-header-link {
+        padding: 0.5rem;
+    }
+    .p-sidebar-right{
+        width: 35%;
+    }
+}
+
+.right-sidebar{
+    width: 35%;
+}

package/projects/cat-document-lib/src/lib/document/components/document-list/document-list.component.ts

@@ -0,0 +1,73 @@
+import { Component, Input, ViewEncapsulation } from '@angular/core';
+import { DocumentModel } from '../../models/document.model';
+import { SHARED } from '../../../../Shared/constant/SHARED';
+
+
+/**
+ * This component is responsible for displaying a list of documents.
+ * @class DocumentListComponent
+ * @typedef {DocumentListComponent}
+ */
+@Component({
+  selector: 'lib-document-list',
+  standalone: false,
+  templateUrl: './document-list.component.html',
+  styleUrls: ['./document-list.component.scss'],
+  encapsulation: ViewEncapsulation.None
+})
+export class DocumentListComponent {
+
+  /**
+   * Represent contextId
+   * @type {string}
+   */
+  @Input() contextId : string = SHARED.EMPTY
+
+  selectedDocument !: DocumentModel
+  /**
+   * Default visbility of sidebar
+   * @type {boolean}
+   */
+  isSidebarVisible: boolean = SHARED.FALSE
+
+  /**
+   * Default visbility of dialog
+   * @type {boolean}
+   */
+  isdialogVisible: boolean = SHARED.FALSE
+
+  /**
+   * The list of documents to display.
+   * @type {DocumentModel[]}
+   */
+  @Input() documentList: DocumentModel[] = [];
+
+
+  /**
+   * Handles the click event for file upload.
+   * Prevents event propagation and displays the sidebar.
+   * @param {MouseEvent} event - The click event triggered by the user.
+   */
+  handleFileUploadClick(event: MouseEvent): void {
+    event.stopPropagation();
+    this.isSidebarVisible = SHARED.TRUE;
+  }
+
+ 
+  /**
+   * Select a individual document.
+   * @param {*} docuemnt - The document that was clicked by the user.
+   */
+  handleClickForDocument(docuemnt: DocumentModel) {
+    this.isdialogVisible = SHARED.TRUE
+    this.selectedDocument = docuemnt
+  }
+
+  /** 
+   * Close dialog.
+   */
+  handleCloseModel(){
+    this.selectedDocument = {_id : SHARED.INITIAL_VALUE};
+    this.isdialogVisible = SHARED.FALSE
+  }
+}