cat-documents-ng 1.0.3 → 1.0.4

package/README.md

@@ -1,59 +1,322 @@
-# CatDocumentsNg
+## Installation
+To install the library, use the following npm command:
+npm i cat-documents-ng
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.0.5.
+# CatDocumentLib
 
-## Development server
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.0.0.
 
-To start a local development server, run:
+## Using the Components
+To use the lib-document-container component in your project, include it in your template as follows:
+it needs an contextId to get document-container deatils.
+<lib-document-container [contextId]="contextId"></lib-document-container>
 
-```bash
-ng serve
-```
+Using the Document Viewer
 
-Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
+If you want to use the standalone document-viewer component, include it in your template like this:
+the document which you want to see pass it to the document-viewer.
+<document-viewer [selectedDocument]="selectedDocument"></document-viewer>
 
-## Code scaffolding
+Both components are designed to integrate seamlessly into your Angular application.
 
-Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+## Usage
 
-```bash
-ng generate component component-name
-```
+Add DocumentModule to your module's imports
 
-For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { AppComponent } from './app/app.component';
 
-```bash
-ng generate --help
-```
+import { DocumentModule } from 'cat-documents-ng';
 
-## Building
+@NgModule({
+  imports: [BrowserModule, DocumentModule],
+  declarations: [AppComponent],
+  bootstrap: [AppComponent]
+})
 
-To build the project run:
+class AppModule {}
+platformBrowserDynamic().bootstrapModule(AppModule);
 
-```bash
-ng build
-```
+## DoumentContainer Overview
+The DocumentContainerComponent is a comprehensive Angular component for managing and displaying a list of documents, integrating services and folder components.
 
-This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
+Features
 
-## Running unit tests
+Document Fetching:
 
-To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+Fetches documents based on contextId using DocumentService.
 
-```bash
-ng test
-```
+Handles subscription management for observables.
 
-## Running end-to-end tests
+Component Integration:
 
-For end-to-end (e2e) testing, run:
+Uses FolderContainerComponent to display folder panels.
 
-```bash
-ng e2e
-```
+Displays documents via DocumentListComponent.
 
-Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
+Template Highlights
 
-## Additional Resources
+Grid Layout: Organizes folder and document displays in a scrollable container.
+
+Component Embedding: Integrates lib-folder-container and lib-document-list for seamless functionality.
+
+Key Properties and Methods
+
+Properties:
+
+contextId: Input for context identification.
+
+documentList: Stores the list of documents fetched from the service.
+
+Methods:
+
+ngOnInit(): Fetches documents using DocumentService based on contextId.
+
+ngOnDestroy(): Cleans up subscriptions on component destruction.
+![Alt text for the image](../../projects/cat-document-lib/src/assets/images/Document%20interface.png)
+
+## DocumentUploadComponent Overview
+
+The DocumentUploadComponent is a robust Angular component for handling file uploads with real-time progress tracking and user-friendly interfaces.
+
+Features
+
+File Upload:
+
+Allows drag-and-drop or manual selection of files.
+
+Accepts .pdf and .png file formats.
+
+Supports multiple file uploads.
+
+Progress Tracking:
+
+Displays individual file upload progress.
+
+Shows overall progress as a percentage.
+
+Error Handling:
+
+Provides feedback for upload errors.
+
+Allows users to remove failed uploads.
+
+Template Highlights
+
+Drag-and-Drop Interface: Encourages intuitive file uploads.
+
+Progress Bars: Visualizes upload progress for individual files and total size.
+
+Dynamic Interaction: Includes removal options for uploaded or in-progress files.
+
+Key Properties and Methods
+
+Properties:
+
+contextId: Input for the context to associate with uploaded files.
+
+uploadedFiles: List of uploaded files.
+
+totalSizePercent: Tracks overall upload progress.
+
+Methods:
+
+choose(event, callback): Triggers file explorer.
+
+handleTemplatedUpload(file): Processes and uploads a single file.
+
+onSelectedFiles(event): Handles new file selections and initiates uploads.
+
+handleDocumentRemove(file, index): Removes a file from the upload list.
+
+getProgress(file): Retrieves upload progress for a specific file.
+
+## DocumentViewerComponent Overview
+
+The DocumentViewerComponent is an Angular component for managing and viewing detailed document information, including images and PDFs.
+
+Features
+
+Document Display:
+
+Displays documents as images or PDFs based on the content type.
+
+Alert and Summary Integration:
+
+Provides alerts and timeline summaries for document status.
+
+Editable Notes:
+
+Allows users to add and edit notes related to the document.
+
+Property Details:
+
+Displays detailed property information associated with the document.
+
+Template Highlights
+
+Content Viewer: Dynamically displays images or PDFs based on document type.
+
+Interactive Alerts: Shows verification status with interactive visuals.
+
+Timeline Summary: Uses a timeline to show document-related events.
+
+Property Details: Displays additional document-related property information.
+
+Key Properties and Methods
+
+Properties:
+
+selectedDocument: Input for the currently selected document.
+
+notes: Editable notes associated with the document.
+
+countries: List of countries for additional document metadata.
+
+propertyDetails: Additional details related to the document.
+
+alertData: Data for alerts and verification statuses.
+
+Methods:
+
+isImage(contentType): Determines if the document is an image based on MIME type.
+![Alt text for the image](../../projects/cat-document-lib/src/assets/images/Pdf%20viewer%20dialog.png)
+
+## DocumentListComponent Overview
+The DocumentListComponent is an Angular component designed to display a list of documents and manage interactions such as viewing document details and uploading new files. It integrates seamlessly with other components like the Document Viewer and Upload Sidebar to provide a comprehensive document management experience.
+
+Features
+
+Displays a list of documents using the lib-document-list-item component.
 
+Supports user interaction for viewing individual documents.
+
+Includes functionality to upload new documents via a sidebar.
+
+Configurable through input properties for customization and integration.
+
+Key Properties
+
+Input Properties
+
+contextId: (string)
+
+Represents the context identifier for document operations.
+
+Default Value: SHARED.EMPTY
+
+documentList: (DocumentModel[])
+
+An array of documents to display in the component.
+
+Default Value: []
+
+Internal Properties
+
+selectedDocument: (DocumentModel)
+
+Represents the currently selected document for viewing in the dialog.
+
+isSidebarVisible: (boolean)
+
+Determines the visibility of the document upload sidebar.
+
+Default Value: false
+
+isdialogVisible: (boolean)
+
+Determines the visibility of the document viewer dialog.
+
+Default Value: false
+
+Key Methods
+
+handleFileUploadClick(event: MouseEvent): void
+
+Handles the click event for the file upload button.
+
+Prevents event propagation and displays the upload sidebar.
+
+Parameters:
+
+event: The MouseEvent triggered by the button click.
+
+handleClickForDocument(document: DocumentModel): void
+
+Selects a document to view and displays it in the dialog.
+
+Parameters:
+
+document: The document clicked by the user.
+
+handleCloseModal(): void
+
+Closes the document viewer dialog and resets the selected document.
+
+## FolderBlockComponent Overview
+
+The FolderBlockComponent is an Angular component designed for displaying folder blocks with functionality to filter based on folder IDs.
+
+Features
+
+Folder Display:
+
+Renders a grid of folder blocks with details such as file count and status.
+
+Each folder block is represented by a FolderBlockModel.
+
+Status Indicators:
+
+Displays counts for missing and pending files using SHARED constants.
+
+Template Highlights
+
+Folder Details: Displays file counts, folder name, and dynamic status indicators.
+
+Filter Interaction: Allows users to filter documents by clicking on a folder.
+
+Key Properties and Methods
+
+Properties:
+
+folderBlocks: Input property for an array of FolderBlockModel representing folder data.
+
+missingFileCount & pendingFileCount: Display counts for missing and pending files.
+
+Methods:
+
+handleClickForFilter(folderBlockId): Validates the folder ID and triggers filtering logic.
+
+## FolderContainerComponent Overview
+
+The FolderContainerComponent is responsible for rendering a container that displays a list of documents along with associated folder panel data.
+
+Features
+
+Folder and Document Integration:
+
+Combines folder panel data (FOLDERPANEL) and a list of documents (DocumentModel[]).
+
+Displays folder blocks using FolderBlockComponent.
+
+Data Sourcing:
+
+Sources folder panel data from FOLDERPANEL.
+
+Accepts a document list as an input.
+
+Template Highlights
+
+Folder Blocks Display: Uses lib-folder-block to render folder panels.
+
+Key Properties
+
+Properties:
+
+documentList: Input for a list of documents to display.
+
+folderBlocks: Data sourced from FOLDERPANEL for folder blocks.
+
+## Additional Resources
 For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.

package/Shared/components/confirmation-dialog/confirmation-dialog.component.d.ts

@@ -0,0 +1,44 @@
+import { ConfirmationService } from 'primeng/api';
+import * as i0 from "@angular/core";
+export interface ConfirmationOptions {
+    message: string;
+    header?: string;
+    icon?: string;
+    acceptLabel?: string;
+    rejectLabel?: string;
+    acceptIcon?: string;
+    rejectIcon?: string;
+    acceptButtonClass?: string;
+    rejectButtonClass?: string;
+}
+export declare class ConfirmationDialogComponent {
+    private confirmationService;
+    confirmationOptions: ConfirmationOptions;
+    constructor(confirmationService: ConfirmationService);
+    /**
+     * Shows the confirmation dialog with the specified options
+     * @param options - Configuration options for the confirmation dialog
+     * @param acceptCallback - Function to execute when user accepts
+     * @param rejectCallback - Function to execute when user rejects
+     */
+    confirm(options: Partial<ConfirmationOptions>, acceptCallback: () => void, rejectCallback?: () => void): void;
+    /**
+     * Static method to show a confirmation dialog (for components that don't want to inject this component)
+     * @param confirmationService - The ConfirmationService instance
+     * @param options - Configuration options for the confirmation dialog
+     * @param acceptCallback - Function to execute when user accepts
+     * @param rejectCallback - Function to execute when user rejects
+     */
+    static confirm(confirmationService: ConfirmationService, options: Partial<ConfirmationOptions>, acceptCallback: () => void, rejectCallback?: () => void): void;
+    /**
+     * Static method to show a delete confirmation dialog
+     * @param confirmationService - The ConfirmationService instance
+     * @param itemName - Name of the item to be deleted
+     * @param acceptCallback - Function to execute when user accepts deletion
+     * @param rejectCallback - Function to execute when user rejects deletion
+     */
+    static confirmDelete(confirmationService: ConfirmationService, itemName: string, acceptCallback: () => void, rejectCallback?: () => void): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ConfirmationDialogComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ConfirmationDialogComponent, "app-confirmation-dialog", never, { "confirmationOptions": { "alias": "confirmationOptions"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ConfirmationDialogComponent>;
+}

package/Shared/components/table-primary/table-primary.component.d.ts

@@ -0,0 +1,31 @@
+import { EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
+import { SHARED } from '../../constant/SHARED';
+import { ProcessedRowData, TableData } from './table-primary.model';
+import * as i0 from "@angular/core";
+export declare class TablePrimaryComponent implements OnChanges {
+    tableData: TableData;
+    showHeader: boolean;
+    tableStyle: any;
+    rowClick: EventEmitter<any>;
+    rowCtrlClick: EventEmitter<any>;
+    processedData: ProcessedRowData[];
+    readonly SHARED: typeof SHARED;
+    get visibleColumns(): import("cat-documents-ng").TableColumn[];
+    ngOnChanges(changes: SimpleChanges): void;
+    private processTableData;
+    getStatusClass(status: string): string;
+    getStatusIcon(status: string): string;
+    getFileExtension(fileName: string): string;
+    onRowClick(event: MouseEvent, rowData: any): void;
+    getVisibleColumnCount(): number;
+    /**
+     * Formats document display name based on whether aliasName exists:
+     * - Without aliasName: fileName on top, docName below
+     * - With aliasName: aliasName on top, docName - fileName below
+     * @param rowData The row data containing docName, aliasName, and fileName
+     * @returns HTML string with proper formatting
+     */
+    formatDocumentDisplayName(rowData: any): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TablePrimaryComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TablePrimaryComponent, "lib-table-primary", never, { "tableData": { "alias": "tableData"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "tableStyle": { "alias": "tableStyle"; "required": false; }; }, { "rowClick": "rowClick"; "rowCtrlClick": "rowCtrlClick"; }, never, never, false, never>;
+}

package/Shared/components/table-primary/table-primary.model.d.ts

@@ -0,0 +1,19 @@
+export interface TableColumn {
+    field: string;
+    header: string;
+    type?: 'text' | 'status' | 'document' | 'actions';
+    width?: string;
+}
+export interface TableData {
+    columns: TableColumn[];
+    data: any[];
+}
+export interface ProcessedRowData {
+    _fileExtension?: string;
+    _isPdfFile?: boolean;
+    _isImageFile?: boolean;
+    _isExcelFile?: boolean;
+    _isOtherFile?: boolean;
+    _statusClass?: string;
+    _statusIcon?: string;
+}

package/Shared/constant/ERROR.d.ts

@@ -0,0 +1,52 @@
+/**
+ * A utility class containing common error messages.
+ * @class ERRORS
+ */
+export declare class ERRORS {
+    /**
+     * Error message for invalid recipient.
+     * @static
+     * @type {string}
+     */
+    static INVALID_RECIPIENT: string;
+    static NO_VALUE_FOUND: string;
+    /**
+     * Error message for invalid document.
+     * @static
+     * @type {string}
+     */
+    static ERROR_FETCHING_DOCUMENTS: string;
+    /**
+     * Error message for invalid document.
+     * @static
+     * @type {string}
+     */
+    static ERROR_FETCHING_FOLDERS: string;
+    /**
+     * Error message for invalid document.
+     * @static
+     * @type {string}
+     */
+    static ERROR_ALLDOCUMENT_MISSING: string;
+    /**
+     * Error message for invalid document.
+     * @static
+     * @type {string}
+     */
+    static ERROR_DOCUMENT_TYPES: string;
+    static ERROR_DOCUMENT_CATAGORY: string;
+    static NO_DOCUMENT_URL: string;
+    static DOWNLOAD_FAIL: string;
+    static ERROR_DELETING_DOCUMENT: string;
+    static ERROR_RECEIVING_DOCUMENT_LIST: string;
+    static CONTEXT_ID_REQUIRED: string;
+    static ERROR_FETCHING_STATUS_DATA: string;
+    static ERROR_FETCHING_USER_LIST: string;
+    static ERROR_FETCHING_DOCUMENT_LIST: string;
+    static ERROR_FETCHING_DOCUMENT_CATEGORIES: string;
+    static ERROR_FETCHING_DOCUMENTS_BY_STATUS: string;
+    static ERROR_FETCHING_DOCUMENTS_BY_CATEGORY: string;
+    static ERROR_CALLING_API_WITH_SELECTION: string;
+    static ERROR_FILE_NAME_INVALID_CHARACTERS: string;
+    static ERROR_FILE_NAME_EMPTY: string;
+}