ngx-techlify-core 11.4.1 → 11.4.5-beta.0

package/bundles/ngx-techlify-core.umd.js

@@ -1,8 +1,30 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/material/dialog'), require('@angular/material/table'), require('@angular/material/sort'), require('@ngneat/until-destroy'), require('@angular/common'), require('@angular/forms'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators'), require('@angular/material/snack-bar'), require('@angular/cdk/a11y'), require('@angular/cdk/coercion'), require('@angular/material/form-field'), require('@angular/material/select'), require('@angular/material/icon'), require('@angular/router'), require('@angular/material/tooltip'), require('@angular/material/core'), require('@angular/material/button'), require('@angular/material/checkbox'), require('@angular/material/input'), require('@angular/material/menu'), require('@angular/material/progress-spinner'), require('@angular/material/card'), require('@angular/material/divider'), require('@angular/material/chips'), require('@angular/material/datepicker'), require('@angular/material/list'), require('@angular/flex-layout'), require('ngx-infinite-scroll'), require('ngx-doc-viewer'), require('ngx-editor'), require('xlsx'), require('@angular/platform-browser'), require('jsondiffpatch'), require('@angular/cdk/keycodes'), require('@angular/material/autocomplete'), require('@angular/material/button-toggle'), require('@angular/material/slide-toggle')) :
-    typeof define === 'function' && define.amd ? define('ngx-techlify-core', ['exports', '@angular/core', '@angular/material/dialog', '@angular/material/table', '@angular/material/sort', '@ngneat/until-destroy', '@angular/common', '@angular/forms', '@angular/common/http', 'rxjs', 'rxjs/operators', '@angular/material/snack-bar', '@angular/cdk/a11y', '@angular/cdk/coercion', '@angular/material/form-field', '@angular/material/select', '@angular/material/icon', '@angular/router', '@angular/material/tooltip', '@angular/material/core', '@angular/material/button', '@angular/material/checkbox', '@angular/material/input', '@angular/material/menu', '@angular/material/progress-spinner', '@angular/material/card', '@angular/material/divider', '@angular/material/chips', '@angular/material/datepicker', '@angular/material/list', '@angular/flex-layout', 'ngx-infinite-scroll', 'ngx-doc-viewer', 'ngx-editor', 'xlsx', '@angular/platform-browser', 'jsondiffpatch', '@angular/cdk/keycodes', '@angular/material/autocomplete', '@angular/material/button-toggle', '@angular/material/slide-toggle'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['ngx-techlify-core'] = {}, global.ng.core, global.ng.material.dialog, global.ng.material.table, global.ng.material.sort, global['@ngneat/until-destroy'], global.ng.common, global.ng.forms, global.ng.common.http, global.rxjs, global.rxjs.operators, global.ng.material.snackBar, global.ng.cdk.a11y, global.ng.cdk.coercion, global.ng.material.formField, global.ng.material.select, global.ng.material.icon, global.ng.router, global.ng.material.tooltip, global.ng.material.core, global.ng.material.button, global.ng.material.checkbox, global.ng.material.input, global.ng.material.menu, global.ng.material.progressSpinner, global.ng.material.card, global.ng.material.divider, global.ng.material.chips, global.ng.material.datepicker, global.ng.material.list, global.ng.flexLayout, global['ngx-infinite-scroll'], global['ngx-doc-viewer'], global['ngx-editor'], global.xlsx, global.ng.platformBrowser, global.jsondiffpatch, global.ng.cdk.keycodes, global.ng.material.autocomplete, global.ng.material.buttonToggle, global.ng.material.slideToggle));
-}(this, (function (exports, i0, dialog, table, sort, untilDestroy, common, forms, i1$1, rxjs, operators, i1, a11y, coercion, formField, select, icon, i1$2, tooltip, core, button, checkbox, input, menu, progressSpinner, card, divider, chips, datepicker, list, flexLayout, ngxInfiniteScroll, ngxDocViewer, ngxEditor, XLSX, platformBrowser, jsondiffpatch, keycodes, autocomplete, buttonToggle, slideToggle) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/material/dialog'), require('@angular/material/table'), require('@angular/material/sort'), require('@ngneat/until-destroy'), require('@angular/common'), require('@angular/forms'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators'), require('@angular/material/snack-bar'), require('@angular/cdk/a11y'), require('@angular/cdk/coercion'), require('@angular/material/form-field'), require('@angular/material/select'), require('moment'), require('@angular/material/icon'), require('@angular/router'), require('@angular/material/tooltip'), require('@angular/material/core'), require('@angular/material/button'), require('@angular/material/checkbox'), require('@angular/material/input'), require('@angular/material/menu'), require('@angular/material/progress-spinner'), require('@angular/material/card'), require('@angular/material/divider'), require('@angular/material/chips'), require('@angular/material/datepicker'), require('@angular/material/list'), require('@angular/material/button-toggle'), require('@angular/flex-layout'), require('ngx-infinite-scroll'), require('ngx-doc-viewer'), require('ngx-editor'), require('xlsx'), require('@angular/platform-browser'), require('jsondiffpatch'), require('@angular/cdk/keycodes'), require('@angular/material/autocomplete'), require('@angular/material/slide-toggle')) :
+    typeof define === 'function' && define.amd ? define('ngx-techlify-core', ['exports', '@angular/core', '@angular/material/dialog', '@angular/material/table', '@angular/material/sort', '@ngneat/until-destroy', '@angular/common', '@angular/forms', '@angular/common/http', 'rxjs', 'rxjs/operators', '@angular/material/snack-bar', '@angular/cdk/a11y', '@angular/cdk/coercion', '@angular/material/form-field', '@angular/material/select', 'moment', '@angular/material/icon', '@angular/router', '@angular/material/tooltip', '@angular/material/core', '@angular/material/button', '@angular/material/checkbox', '@angular/material/input', '@angular/material/menu', '@angular/material/progress-spinner', '@angular/material/card', '@angular/material/divider', '@angular/material/chips', '@angular/material/datepicker', '@angular/material/list', '@angular/material/button-toggle', '@angular/flex-layout', 'ngx-infinite-scroll', 'ngx-doc-viewer', 'ngx-editor', 'xlsx', '@angular/platform-browser', 'jsondiffpatch', '@angular/cdk/keycodes', '@angular/material/autocomplete', '@angular/material/slide-toggle'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['ngx-techlify-core'] = {}, global.ng.core, global.ng.material.dialog, global.ng.material.table, global.ng.material.sort, global['@ngneat/until-destroy'], global.ng.common, global.ng.forms, global.ng.common.http, global.rxjs, global.rxjs.operators, global.ng.material.snackBar, global.ng.cdk.a11y, global.ng.cdk.coercion, global.ng.material.formField, global.ng.material.select, global.moment, global.ng.material.icon, global.ng.router, global.ng.material.tooltip, global.ng.material.core, global.ng.material.button, global.ng.material.checkbox, global.ng.material.input, global.ng.material.menu, global.ng.material.progressSpinner, global.ng.material.card, global.ng.material.divider, global.ng.material.chips, global.ng.material.datepicker, global.ng.material.list, global.ng.material.buttonToggle, global.ng.flexLayout, global['ngx-infinite-scroll'], global['ngx-doc-viewer'], global['ngx-editor'], global.xlsx, global.ng.platformBrowser, global.jsondiffpatch, global.ng.cdk.keycodes, global.ng.material.autocomplete, global.ng.material.slideToggle));
+}(this, (function (exports, i0, dialog, table, sort, untilDestroy, common, forms, i1$1, rxjs, operators, i1, a11y, coercion, formField, select, moment_, icon, i1$2, tooltip, core, button, checkbox, input, menu, progressSpinner, card, divider, chips, datepicker, list, buttonToggle, flexLayout, ngxInfiniteScroll, ngxDocViewer, ngxEditor, XLSX, platformBrowser, jsondiffpatch, keycodes, autocomplete, slideToggle) { 'use strict';
+
+    function _interopNamespace(e) {
+        if (e && e.__esModule) return e;
+        var n = Object.create(null);
+        if (e) {
+            Object.keys(e).forEach(function (k) {
+                if (k !== 'default') {
+                    var d = Object.getOwnPropertyDescriptor(e, k);
+                    Object.defineProperty(n, k, d.get ? d : {
+                        enumerable: true,
+                        get: function () {
+                            return e[k];
+                        }
+                    });
+                }
+            });
+        }
+        n['default'] = e;
+        return Object.freeze(n);
+    }
+
+    var moment___namespace = /*#__PURE__*/_interopNamespace(moment_);
 
     var ActionPopup = /** @class */ (function () {
         function ActionPopup() {
@@ -1369,9 +1391,13 @@
         EntityFileService.prototype.deleteEntityFile = function (model) {
             return this.http.delete("api/entity-files/" + model.id).toPromise();
         };
-        EntityFileService.prototype.uploadEntityFile = function (file) {
+        EntityFileService.prototype.uploadEntityFile = function (file, params) {
             var formData = new FormData();
             formData.append("fileData", file, file.name);
+            if (params === null || params === void 0 ? void 0 : params.entity_id) {
+                formData.append('entity_id', params.entity_id);
+                formData.append('entity_type', params.entity_type);
+            }
             return this.http
                 .skipHeader()
                 .post("api/entity-files-upload", formData).toPromise();
@@ -1437,7 +1463,8 @@
                 entity_type: [''],
                 entity_id: [],
                 file: ['', forms.Validators.required],
-                url: ['', forms.Validators.required]
+                url: ['', forms.Validators.required],
+                file_size: ['', forms.Validators.required],
             });
         };
         EntityFileFormComponent.prototype.ngOnInit = function () {
@@ -1516,12 +1543,8 @@
                             return [4 /*yield*/, this.entityFileService.uploadEntityFile(this.fileList[0])];
                         case 1:
                             result = _c.sent();
-                            this.entityFileGroup
-                                .get("file")
-                                .setValue(result.item.file);
-                            this.entityFileGroup
-                                .get("url")
-                                .setValue(result.item.url);
+                            this.entityFileGroup.patchValue(result.item);
+                            ;
                             this.fileList = [];
                             _c.label = 2;
                         case 2: return [2 /*return*/];
@@ -1560,7 +1583,7 @@
     EntityFileFormComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'entity-file-form',
-                    template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n    <div fxLayout=\"column\" class=\"mat-typography\">\n        <div mat-dialog-title class=\"text-center\">\n            <div>Entity File</div>\n        </div>\n\n        <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n            <ng-container *ngIf=\"!hideTitleAndDetails\">\n                <mat-form-field>\n                    <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n                </mat-form-field>\n                <mat-form-field>\n                    <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n                </mat-form-field>\n            </ng-container>\n\n            <ng-template #fileUpload>\n                <section fxFlex=\"100%\">\n                    <div>Entity File*</div>\n                    <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n                    </app-file-dropper>\n                    <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n                        {{getErrorMessage(\"url\")}}\n                    </div>\n                </section>\n            </ng-template>\n\n\n            <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n                <app-document-viewer [file]=\"entityFileGroup.get('file').value\"\n                    [fileUrl]=\"entityFileGroup.get('url').value\" [config]=\"this.viewerConfig\" (remove)=\"removeFile()\"\n                    [disableEdit]=\"updateMode\">\n                </app-document-viewer>\n\n            </div>\n\n            <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n                <button mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n                    Cancel\n                </button>\n                <button mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n            </div>\n        </div>\n    </div>\n</form>",
+                    template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n  <div fxLayout=\"column\" class=\"mat-typography\">\n    <div mat-dialog-title class=\"text-center\">\n      <div>Entity File</div>\n    </div>\n    <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n      <ng-container *ngIf=\"!hideTitleAndDetails\">\n        <mat-form-field>\n          <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n        </mat-form-field>\n        <mat-form-field>\n          <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n        </mat-form-field>\n      </ng-container>\n      <ng-template #fileUpload>\n        <section fxFlex=\"100%\">\n          <div>Entity File*</div>\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n          <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n            {{getErrorMessage(\"url\")}}\n          </div>\n        </section>\n      </ng-template>\n      <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n        <app-document-viewer [file]=\"entityFileGroup.get('file').value\" [fileUrl]=\"entityFileGroup.get('url').value\"\n          [config]=\"this.viewerConfig\" (remove)=\"removeFile()\" [disableEdit]=\"updateMode\">\n        </app-document-viewer>\n      </div>\n      <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n        <button mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n          Cancel\n        </button>\n        <button mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n      </div>\n    </div>\n  </div>\n</form>\n",
                     styles: [""]
                 },] }
     ];
@@ -1580,17 +1603,37 @@
             this.alertService = alertService;
             this.dialog = dialog;
             this.viewOnly = false;
+            this.title = "File";
             this.filters = {};
             this.entityFiles = [];
-            this.displayedColumns = ['index', 'title', 'details', 'file',];
+            this.displayedColumns = [
+                'index',
+                'title',
+                'details',
+                'file_size',
+                'uploaded_on',
+            ];
             this.isWorking = false;
             this.search = new forms.FormControl('');
             this.page = 1;
             this.perPage = 25;
             this.lastPage = 0;
+            this.fileList = [];
         }
         EntityFilesViewAllComponent.prototype.ngOnInit = function () {
             var _this = this;
+            //File dropper config
+            this.fileConfig = {
+                fileId: "entityDashboardDropper",
+                containerId: "entityDashboardDropperContainer",
+                styles: {
+                    height: "500px"
+                },
+                multiple: false,
+                acceptFile: "*",
+                maxSize: 10,
+                acceptFileText: "All Files"
+            };
             this.viewerConfig = {
                 imageStyle: {
                     height: '200px',
@@ -1626,6 +1669,7 @@
                     switch (_a.label) {
                         case 0:
                             this.filters.page = this.page;
+                            this.filters.perPage = this.perPage;
                             this.isWorking = true;
                             return [4 /*yield*/, this.entityFileService.getEntityFiles(this.filters)];
                         case 1:
@@ -1721,12 +1765,42 @@
         EntityFilesViewAllComponent.prototype.resetFieldValue = function () {
             this.search.setValue("");
         };
+        EntityFilesViewAllComponent.prototype.sizeOf = function (bytes) {
+            if (!bytes) {
+                return "0.00 B";
+            }
+            var e = Math.floor(Math.log(bytes) / Math.log(1024));
+            return (bytes / Math.pow(1024, e)).toFixed(2) + ' ' + ' KMGTP'.charAt(e) + 'B';
+        };
+        EntityFilesViewAllComponent.prototype.fileChanged = function (event) {
+            return __awaiter(this, void 0, void 0, function () {
+                var result;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            this.fileList = event;
+                            if (!(this.fileList.length > 0)) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.entityFileService.uploadEntityFile(this.fileList[0], {
+                                    entity_type: this.entityType,
+                                    entity_id: this.entityId,
+                                })];
+                        case 1:
+                            result = _a.sent();
+                            this.fileList = [];
+                            this.alertService.addAlert('Successfull uploaded', 'success');
+                            this.reload();
+                            _a.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
+        };
         return EntityFilesViewAllComponent;
     }());
     exports.ɵo.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-entity-files-view-all',
-                    template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"!displayMode\">\n    <div fxLayout=\"column\" fxLayoutGap=\"0.25rem\">\n        <h3 class=\"font-weight-bold\" fxLayoutAlign=\"center center\"> Files\n            <button type=\"button\" class=\"mx-1\" mat-mini-fab color=\"primary\" (click)=\"addEntityFile()\" *ngIf=\"!viewOnly\">\n                <mat-icon>add</mat-icon>\n            </button>\n        </h3>\n        <div fxLayout=\"row wrap\" fxLayoutAlign=\"start\" *ngIf=\"!removeSearch\">\n            <mat-form-field class=\"mt-1\">\n                <input type=\"text\" matInput [formControl]=\"search\" placeholder=\"Title\" name=\"title\"\n                    autocomplete=\"off\" />\n                <button mat-button *ngIf=\"filters.title\" matSuffix mat-icon-button (click)=\"resetFieldValue()\">\n                    <mat-icon>close</mat-icon>\n                </button>\n            </mat-form-field>\n        </div>\n        <table mat-table [dataSource]=\"entityFiles\" class=\"w-100\" matSort multiTemplateDataRows\n            infiniteScrollContainer=\"body\" infiniteScroll [infiniteScrollDistance]=\"1.5\" [infiniteScrollThrottle]=\"50\"\n            [fromRoot]=\"true\" (scrolled)=\"onScroll()\">\n\n            <!-- Index Column -->\n            <ng-container matColumnDef=\"index\">\n                <th mat-header-cell *matHeaderCellDef> # </th>\n                <td mat-cell *matCellDef=\"let element; let i = dataIndex\"> {{ i+1 }} </td>\n            </ng-container>\n\n            <!-- Title Column -->\n            <ng-container matColumnDef=\"title\">\n                <th mat-header-cell *matHeaderCellDef> Title </th>\n                <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\n            </ng-container>\n\n            <!-- Details Column -->\n            <ng-container matColumnDef=\"details\">\n                <th mat-header-cell *matHeaderCellDef> Details </th>\n                <td mat-cell *matCellDef=\"let element\"> {{element.details}} </td>\n            </ng-container>\n\n            <!-- File Column -->\n            <ng-container matColumnDef=\"file\">\n                <th mat-header-cell *matHeaderCellDef> File </th>\n                <td mat-cell *matCellDef=\"let element\">\n                    <a href=\"{{element.url}}\" target=\"_blank\">\n                        <button mat-button type=\"button\">View</button>\n                    </a>\n                </td>\n            </ng-container>\n\n            <!-- Actions Column -->\n            <ng-container matColumnDef=\"actions\">\n                <th mat-header-cell *matHeaderCellDef> Actions </th>\n                <td mat-cell *matCellDef=\"let element\" style=\"min-width:110px\">\n                    <button type=\"button\" mat-icon-button (click)=\"editEntityFile(element)\">\n                        <mat-icon>edit</mat-icon>\n                    </button>\n                    <button type=\"button\" mat-icon-button (click)=\"deleteEntityFile(element)\">\n                        <mat-icon>delete</mat-icon>\n                    </button>\n                </td>\n            </ng-container>\n\n            <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n            <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n        </table>\n    </div>\n</div>\n\n<div fxLayout=\"row wrap\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"displayMode\">\n\n    <div *ngFor=\"let efile of entityFiles\">\n        <app-document-viewer [file]=\"efile.file\" [fileUrl]=\"efile.url\" [config]=\"this.viewerConfig\"\n            [disableEdit]=\"true\">\n        </app-document-viewer>\n        <a href=\"{{efile.url}}\" target=\"_blank\">\n            <button mat-button type=\"button\">View</button>\n        </a>\n    </div>\n\n</div>",
+                    template: "<div class=\"mat-typography\" *ngIf=\"!displayMode\">\n  <div fxLayout=\"row\" fxLayoutGap=\"1rem\">\n    <mat-card fxFlex=\"70%\">\n      <mat-card-title fxLayout fxLayoutGap=\"1rem\">\n        <h3 class=\"font-weight-bold primary-color\" fxLayout=\"center center\">\n          <mat-icon>\n            <span class=\"material-icons\">\n              description\n            </span>\n          </mat-icon>\n          {{title}}s\n        </h3>\n        <div>\n          <button type=\"button\" class=\"mx-1\" mat-raised-button color=\"primary\" (click)=\"addEntityFile()\"\n            *ngIf=\"!viewOnly\">\n            <mat-icon>\n              <span class=\"material-icons\">\n                add_circle_outline\n              </span>\n            </mat-icon>\n            {{title}}\n          </button>\n        </div>\n        <mat-form-field *ngIf=\"!removeSearch\" appearance=\"outline\" style=\"font-size: 10px;\">\n          <mat-label>Search</mat-label>\n          <input type=\"text\" matInput [formControl]=\"search\" placeholder=\"Search\" name=\"title\" autocomplete=\"off\" />\n          <button mat-button *ngIf=\"filters.title\" matSuffix mat-icon-button (click)=\"resetFieldValue()\">\n            <mat-icon>close</mat-icon>\n          </button>\n        </mat-form-field>\n      </mat-card-title>\n      <mat-card-content class=\"entity-file-card\">\n        <table mat-table [dataSource]=\"entityFiles\" class=\"w-100\" matSort multiTemplateDataRows infiniteScroll\n          [infiniteScrollDistance]=\"1.5\" [infiniteScrollThrottle]=\"50\" (scrolled)=\"onScroll()\">\n\n          <!-- Index Column -->\n          <ng-container matColumnDef=\"index\">\n            <th mat-header-cell *matHeaderCellDef> # </th>\n            <td mat-cell *matCellDef=\"let element; let i = dataIndex\"> {{ i+1 }} </td>\n          </ng-container>\n\n          <!-- Title Column -->\n          <ng-container matColumnDef=\"title\">\n            <th mat-header-cell *matHeaderCellDef> Title </th>\n            <td mat-cell *matCellDef=\"let element\">\n              <div>\n                <span>\n                  {{element.title}}\n                </span>\n                <span>\n                  <a href=\"{{element.url}}\" target=\"_blank\" class=\"text-decoration-none text-muted\">\n                    <button mat-icon-button type=\"button\">\n                      <mat-icon>download</mat-icon>\n                    </button>\n                  </a>\n                </span>\n              </div>\n            </td>\n          </ng-container>\n\n          <!-- Details Column -->\n          <ng-container matColumnDef=\"details\">\n            <th mat-header-cell *matHeaderCellDef> Details </th>\n            <td mat-cell *matCellDef=\"let element\"> {{element.details}} </td>\n          </ng-container>\n\n          <!-- File size Column -->\n          <ng-container matColumnDef=\"file_size\">\n            <th mat-header-cell *matHeaderCellDef> File Size </th>\n            <td mat-cell *matCellDef=\"let element\"> {{ sizeOf(element.file_size)}} </td>\n          </ng-container>\n\n          <!-- Uploaded On Column -->\n          <ng-container matColumnDef=\"uploaded_on\">\n            <th mat-header-cell *matHeaderCellDef> Uploaded On </th>\n            <td mat-cell *matCellDef=\"let element\">\n              <div>\n                {{element.created_at | date: 'mediumDate'}}\n              </div>\n              <div class=\"text-muted\">\n                By {{element.creator?.name}}\n              </div>\n            </td>\n          </ng-container>\n\n          <!-- Actions Column -->\n          <ng-container matColumnDef=\"actions\">\n            <th mat-header-cell *matHeaderCellDef> Actions </th>\n            <td mat-cell *matCellDef=\"let element\" style=\"min-width:110px\" class=\"text-muted\">\n              <button type=\"button\" mat-icon-button (click)=\"editEntityFile(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n              <button type=\"button\" mat-icon-button (click)=\"deleteEntityFile(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n            </td>\n          </ng-container>\n\n          <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n          <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n        </table>\n      </mat-card-content>\n    </mat-card>\n    <section fxFlex=\"30%\">\n      <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n      </app-file-dropper>\n    </section>\n  </div>\n</div>\n\n<div fxLayout=\"row wrap\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"displayMode\">\n  <div *ngFor=\"let efile of entityFiles\">\n    <app-document-viewer [file]=\"efile.file\" [fileUrl]=\"efile.url\" [config]=\"this.viewerConfig\" [disableEdit]=\"true\">\n    </app-document-viewer>\n    <a href=\"{{efile.url}}\" target=\"_blank\">\n      <button mat-button type=\"button\">View</button>\n    </a>\n  </div>\n</div>\n",
                     styles: [""]
                 },] }
     ];
@@ -1742,7 +1816,8 @@
         viewOnly: [{ type: i0.Input }],
         removeSearch: [{ type: i0.Input }],
         hideTitleAndDetails: [{ type: i0.Input }],
-        displayMode: [{ type: i0.Input }]
+        displayMode: [{ type: i0.Input }],
+        title: [{ type: i0.Input }]
     };
     exports.ɵo = __decorate([
         untilDestroy.UntilDestroy()
@@ -2281,6 +2356,7 @@
             this.edit = false;
             this.sort = true;
             this.items = [];
+            this.apiDataProperty = 'data';
             this.cache = false;
             this.perPage = 25;
             this.inDataSearch = false;
@@ -2411,12 +2487,12 @@
                 request = this.http.cache().get(this.apiUrl, { params: this.filters });
             }
             rxjs.of().pipe(operators.startWith(true), operators.switchMap(function (_) { return rxjs.from(request); }), operators.finalize(function () { return _this.isLoading = false; }), untilDestroy.untilDestroyed(this)).subscribe(function (result) {
-                _this.items = _this.items.concat(result.data);
+                _this.items = _this.items.concat(result[_this.apiDataProperty]);
                 if (_this.cache) {
                     _this.cachedItems = _this.items;
                 }
-                _this.filters.page = result.current_page;
-                _this.filters.lastPage = result.last_page;
+                _this.filters.page = (result === null || result === void 0 ? void 0 : result.current_page) || 1;
+                _this.filters.lastPage = (result === null || result === void 0 ? void 0 : result.last_page) || 1;
             });
         };
         SearchableSelectorComponent.prototype.setDescribedByIds = function (ids) {
@@ -2580,6 +2656,7 @@
         searchField: [{ type: i0.Input }],
         itemComponent: [{ type: i0.Input }],
         items: [{ type: i0.Input }],
+        apiDataProperty: [{ type: i0.Input }],
         cache: [{ type: i0.Input }],
         perPage: [{ type: i0.Input }],
         inDataSearch: [{ type: i0.Input }],
@@ -2791,6 +2868,28 @@
         selectedValue: [{ type: i0.Input }]
     };
 
+    var Timeline = /** @class */ (function () {
+        function Timeline() {
+        }
+        return Timeline;
+    }());
+    Timeline.CUSTOM = 1;
+    Timeline.TODAY = 2;
+    Timeline.YESTERDAY = 3;
+    Timeline.THIS_WEEK = 4;
+    Timeline.LAST_WEEK = 5;
+    Timeline.THIS_MONTH = 6;
+    Timeline.LAST_MONTH = 7;
+    Timeline.THIS_QUARTER = 8;
+    Timeline.LAST_QUARTER = 9;
+    Timeline.THIS_YEAR = 10;
+    Timeline.LAST_YEAR = 11;
+    Timeline.ALL = 12;
+    Timeline.TOMMOROW = 13;
+    Timeline.NEXT_WEEK = 14;
+    Timeline.NEXT_MONTH = 15;
+
+    var moment = moment___namespace;
     function calculateTimeline(value) {
         var date = new Date();
         var data = {
@@ -2799,77 +2898,86 @@
             'show_custom_field': false
         };
         switch (value) {
-            case 1: { //Custom
+            case Timeline.CUSTOM: { //Custom
                 data.show_custom_field = true;
                 break;
             }
-            case 2: { // Today
-                data.date_from = date;
-                data.date_to = date;
+            case Timeline.TODAY: { // Today
+                var now = moment();
+                data.date_from = now.startOf('day').toISOString();
+                data.date_to = now.endOf('day').toISOString();
+                break;
+            }
+            case Timeline.YESTERDAY: { // Yesterday
+                var now = moment().subtract(1, 'day');
+                data.date_from = now.startOf('day').toISOString();
+                data.date_to = now.endOf('day').toISOString();
+                break;
+            }
+            case Timeline.THIS_WEEK: { // This Week
+                var now = moment();
+                data.date_from = now.startOf('isoWeek').toISOString();
+                data.date_to = now.endOf('isoWeek').toISOString();
                 break;
             }
-            case 3: { // Yesterday
-                var yesterday = new Date(date);
-                yesterday.setDate(yesterday.getDate() - 1);
-                data.date_from = yesterday;
-                data.date_to = yesterday;
+            case Timeline.LAST_WEEK: { // Last Week
+                var now = moment().subtract(1, 'week');
+                data.date_from = now.startOf('isoWeek').toISOString();
+                data.date_to = now.endOf('isoWeek').toISOString();
                 break;
             }
-            case 4: { // This Week
-                var first = date.getDate() - date.getDay() + 1; // First day is the day of the month - the day of the week
-                var last = first + 6; // last day is the first day + 6
-                data.date_from = new Date(date.setDate(first));
-                data.date_to = new Date(date.setDate(last));
+            case Timeline.THIS_MONTH: { //This Month
+                var now = moment();
+                data.date_from = now.startOf('month').toISOString();
+                data.date_to = now.endOf('month').toISOString();
                 break;
             }
-            case 5: { // Last Week
-                var d = new Date();
-                var to = d.setTime(d.getTime() - (d.getDay() ? d.getDay() : 7) * 24 * 60 * 60 * 1000);
-                var from = d.setTime(d.getTime() - 6 * 24 * 60 * 60 * 1000);
-                data.date_from = new Date(from);
-                data.date_to = new Date(to);
+            case Timeline.LAST_MONTH: { // Last Month
+                var now = moment().subtract(1, 'month');
+                data.date_from = now.startOf('month').toISOString();
+                data.date_to = now.endOf('month').toISOString();
                 break;
             }
-            case 6: { //This Month
-                data.date_from = new Date(date.getFullYear(), date.getMonth(), 1);
-                data.date_to = new Date(date.getFullYear(), date.getMonth() + 1, 0);
+            case Timeline.THIS_QUARTER: { // This Quarter
+                var now = moment();
+                data.date_from = now.startOf('quarter').toISOString();
+                data.date_to = now.endOf('quarter').toISOString();
                 break;
             }
-            case 7: { // Last Month
-                var d = new Date(); // current date
-                d.setDate(1); // going to 1st of the month
-                d.setHours(-1);
-                data.date_from = new Date(date.getFullYear(), date.getMonth() - 1, 1);
-                data.date_to = d;
+            case Timeline.LAST_QUARTER: { // Last Quarter
+                var now = moment().subtract(1, 'quarter');
+                data.date_from = now.startOf('quarter').toISOString();
+                data.date_to = now.endOf('quarter').toISOString();
                 break;
             }
-            case 8: { // This Quarter
-                var quarter = Math.floor((date.getMonth() / 3));
-                var startFullQuarter = new Date(date.getFullYear(), quarter * 3, 1);
-                var endFullQuarter = new Date(startFullQuarter.getFullYear(), startFullQuarter.getMonth() + 3, 0);
-                data.date_from = startFullQuarter;
-                data.date_to = endFullQuarter;
+            case Timeline.THIS_YEAR: { // This Year
+                var now = moment();
+                data.date_from = now.startOf('year').toISOString();
+                data.date_to = now.endOf('year').toISOString();
                 break;
             }
-            case 9: { // Last Quarter
-                var quarter = Math.floor((date.getMonth() / 3));
-                var startFullQuarter = new Date(date.getFullYear(), quarter * 3 - 3, 1);
-                var endFullQuarter = new Date(startFullQuarter.getFullYear(), startFullQuarter.getMonth() + 3, 0);
-                data.date_from = startFullQuarter;
-                data.date_to = endFullQuarter;
+            case Timeline.LAST_YEAR: { // Last Year
+                var now = moment().subtract(1, 'year');
+                data.date_from = now.startOf('year').toISOString();
+                data.date_to = now.endOf('year').toISOString();
                 break;
             }
-            case 10: { // This Year
-                data.date_from = new Date("1/1/" + (new Date()).getFullYear());
-                ;
-                data.date_to = new Date("12/31/" + (new Date()).getFullYear());
+            case Timeline.TOMMOROW: {
+                var now = moment().add(1, 'day');
+                data.date_from = now.startOf('day').toISOString();
+                data.date_to = now.endOf('day').toISOString();
                 break;
             }
-            case 11: { // Last Year
-                data.date_from = new Date("1/1/" + (new Date().getFullYear() - 1));
-                ;
-                data.date_to = new Date("12/31/" + (new Date().getFullYear() - 1));
+            case Timeline.NEXT_WEEK: {
+                var now = moment().add(1, 'week');
+                data.date_from = now.startOf('isoWeek').toISOString();
+                data.date_to = now.endOf('isoWeek').toISOString();
                 break;
+            }
+            case Timeline.NEXT_MONTH: {
+                var now = moment().add(1, 'month');
+                data.date_from = now.startOf('month').toISOString();
+                data.date_to = now.endOf('month').toISOString();
                 break;
             }
             default: { // All
@@ -2881,24 +2989,6 @@
         return data;
     }
 
-    var Timeline = /** @class */ (function () {
-        function Timeline() {
-        }
-        return Timeline;
-    }());
-    Timeline.CUSTOM = 1;
-    Timeline.TODAY = 2;
-    Timeline.YESTERDAY = 3;
-    Timeline.THIS_WEEK = 4;
-    Timeline.LAST_WEEK = 5;
-    Timeline.THIS_MONTH = 6;
-    Timeline.LAST_MONTH = 7;
-    Timeline.THIS_QUARTER = 8;
-    Timeline.LAST_QUARTER = 9;
-    Timeline.THIS_YEAR = 10;
-    Timeline.LAST_YEAR = 11;
-    Timeline.ALL = 12;
-
     var TimelineFilterComponent_1;
     exports.ɵbb = TimelineFilterComponent_1 = /** @class */ (function () {
         function TimelineFilterComponent(formBuilder, ngControl, datePipe) {
@@ -2906,18 +2996,21 @@
             this.datePipe = datePipe;
             this.timelineValue = new forms.FormControl('');
             this.timelines = [
-                { value: 1, viewValue: 'Custom' },
-                { value: 2, viewValue: 'Today' },
-                { value: 3, viewValue: 'Yesterday' },
-                { value: 4, viewValue: 'This Week' },
-                { value: 5, viewValue: 'Last Week' },
-                { value: 6, viewValue: 'This Month' },
-                { value: 7, viewValue: 'Last Month' },
-                { value: 8, viewValue: 'This Quarter' },
-                { value: 9, viewValue: 'Last Quarter' },
-                { value: 10, viewValue: 'This Year' },
-                { value: 11, viewValue: 'Last Year' },
-                { value: 12, viewValue: 'All dates' },
+                { value: Timeline.CUSTOM, viewValue: 'Custom' },
+                { value: Timeline.TODAY, viewValue: 'Today' },
+                { value: Timeline.YESTERDAY, viewValue: 'Yesterday' },
+                { value: Timeline.TOMMOROW, viewValue: 'Tomorrow' },
+                { value: Timeline.THIS_WEEK, viewValue: 'This Week' },
+                { value: Timeline.LAST_WEEK, viewValue: 'Last Week' },
+                { value: Timeline.NEXT_WEEK, viewValue: 'Next Week' },
+                { value: Timeline.THIS_MONTH, viewValue: 'This Month' },
+                { value: Timeline.LAST_MONTH, viewValue: 'Last Month' },
+                { value: Timeline.NEXT_MONTH, viewValue: 'Next Month' },
+                { value: Timeline.THIS_QUARTER, viewValue: 'This Quarter' },
+                { value: Timeline.LAST_QUARTER, viewValue: 'Last Quarter' },
+                { value: Timeline.THIS_YEAR, viewValue: 'This Year' },
+                { value: Timeline.LAST_YEAR, viewValue: 'Last Year' },
+                { value: Timeline.ALL, viewValue: 'All dates' },
             ];
             this.dateFrom = 'date_from';
             this.dateTo = 'date_to';
@@ -3474,7 +3567,8 @@
                         chips.MatChipsModule,
                         datepicker.MatDatepickerModule,
                         list.MatListModule,
-                        tooltip.MatTooltipModule
+                        tooltip.MatTooltipModule,
+                        buttonToggle.MatButtonToggleModule
                     ]
                 },] }
     ];
@@ -5522,7 +5616,7 @@
                             return [3 /*break*/, 3];
                         case 2:
                             error_1 = _a.sent();
-                            this.alertService.addAlert("Unable to process, try later", "warn");
+                            console.log("Current user updates failed");
                             return [3 /*break*/, 3];
                         case 3: return [2 /*return*/];
                     }
@@ -8011,21 +8105,16 @@
     exports.ɵbt = UpdateViewModule;
     exports.ɵbu = UpdateViewComponent;
     exports.ɵbv = DataManager;
-    exports.ɵbw = AlertService;
-    exports.ɵbx = ErrorHandlerService;
-    exports.ɵby = FieldMappingComponent;
-    exports.ɵbz = FailedItemsListComponent;
+    exports.ɵbw = ErrorHandlerService;
+    exports.ɵbx = FieldMappingComponent;
+    exports.ɵby = FailedItemsListComponent;
+    exports.ɵbz = ImportHistoryListComponent;
     exports.ɵc = ErrorSnackComponent;
-    exports.ɵca = ImportHistoryListComponent;
-    exports.ɵcb = HttpService;
-    exports.ɵcc = ImportSuccessComponent;
-    exports.ɵcd = DataImportComponent;
-    exports.ɵce = ErrorHandlerService;
-    exports.ɵcf = StorageService;
-    exports.ɵcg = TechlifyFeatureService;
-    exports.ɵch = DataManager;
-    exports.ɵci = AuthenticationGuard;
-    exports.ɵcj = OnOffSwitchComponent;
+    exports.ɵca = ImportSuccessComponent;
+    exports.ɵcb = DataImportComponent;
+    exports.ɵcc = StorageService;
+    exports.ɵcd = TechlifyFeatureService;
+    exports.ɵce = OnOffSwitchComponent;
     exports.ɵd = HTTP_DYNAMIC_INTERCEPTORS;
     exports.ɵe = HttpService;
     exports.ɵf = RouteReusableStrategy;