nuxeo-development-framework 3.0.0 → 3.0.2

package/bundles/nuxeo-development-framework.umd.js

@@ -20743,7 +20743,7 @@
         function IconService() {
         }
         IconService.prototype.getFileIcon = function (document, dataType) {
-            var _a;
+            var _a, _b, _c, _d;
             var thumb = 'assets/drive-icons/genericfile.png';
             if (dataType === 'document') {
                 try {
@@ -20775,7 +20775,7 @@
                         //(document.contextParameters.thumbnail.url) ? document.contextParameters.thumbnail.url : 'assets/drive-icons/video.png';
                     }
                     else if ((document.properties.file || document.properties['file:content'])['mime-type'].includes('image')) {
-                        thumb = (document.contextParameters.thumbnail) ? document.contextParameters.thumbnail.url : 'assets/drive-icons/photo.png';
+                        thumb = ((_b = document === null || document === void 0 ? void 0 : document.contextParameters) === null || _b === void 0 ? void 0 : _b.thumbnail) ? (_d = (_c = document === null || document === void 0 ? void 0 : document.contextParameters) === null || _c === void 0 ? void 0 : _c.thumbnail) === null || _d === void 0 ? void 0 : _d.url : 'assets/drive-icons/photo.png';
                     }
                     else if ((document.properties.file || document.properties['file:content'])['mime-type'].includes('zip')) {
                         thumb = 'assets/drive-icons/zip.png';
@@ -20954,13 +20954,15 @@
             }], ctorParameters: function () { return [{ type: i3__namespace.DatePipe }, { type: IconService }]; } });
 
     var MainfolderService = /** @class */ (function () {
-        function MainfolderService(nuxeoService, userPreference) {
+        function MainfolderService(nuxeoService, appConfigService, userPreference) {
             this.nuxeoService = nuxeoService;
+            this.appConfigService = appConfigService;
             this.userPreference = userPreference;
+            this.localStoragKeys = this.appConfigService.myConfiguration.localStorageKey;
         }
-        MainfolderService.prototype.fetchfileManager_mainFolderId = function () {
+        MainfolderService.prototype.fetchfileManager_mainFolderId = function (apiName) {
             return rxjs.from(this.nuxeoService.nuxeoClient
-                .operation('AC_UA_GetFileManagerID')
+                .operation(apiName ? apiName : 'AC_UA_GetFileManagerID')
                 .execute({
                 headers: {
                     properties: 'file, dublincore, creator, driveroot, departmentspace',
@@ -21010,12 +21012,12 @@
                 return rxjs.of(false);
             }));
         };
-        MainfolderService.prototype.save_fileManagerObj_ToLocalStorage = function (reset) {
+        MainfolderService.prototype.save_fileManagerObj_ToLocalStorage = function (apiName) {
             var _this = this;
-            if (reset === void 0) { reset = false; }
+            if (apiName === void 0) { apiName = 'AC_UA_GetFileManagerID'; }
             /*return this.userPreference.hasItem('fileManagerObj') && !reset
                  ? of(true):*/
-            return this.fetchfileManager_mainFolderId().pipe(operators.tap(function (res) {
+            return this.fetchfileManager_mainFolderId(apiName).pipe(operators.tap(function (res) {
                 console.log('res: ', res);
                 if (res) {
                     _this.fileManagerObj = {
@@ -21027,9 +21029,9 @@
                             return item;
                         }),
                     };
-                    _this.userPreference.set('fileManagerObj', JSON.stringify(_this.fileManagerObj));
+                    _this.userPreference.set(apiName ? _this.localStoragKeys[apiName] : 'fileManagerObj', JSON.stringify(_this.fileManagerObj));
                 }
-            }), operators.switchMap(function (value) { return rxjs.of(_this.get_fileManagerObj_FromLocalStorage()); }));
+            }), operators.switchMap(function (value) { return rxjs.of(_this.get_fileManagerObj_FromLocalStorage(apiName ? _this.localStoragKeys[apiName] : 'fileManagerObj')); }));
         };
         MainfolderService.prototype.save_myfilesManagerObj_ToLocalStorage = function () {
             var _this = this;
@@ -21075,9 +21077,9 @@
                     }
                 }));
         };
-        MainfolderService.prototype.get_fileManagerObj_FromLocalStorage = function () {
-            if (this.userPreference.hasItem('fileManagerObj')) {
-                return JSON.parse(this.userPreference.get('fileManagerObj'));
+        MainfolderService.prototype.get_fileManagerObj_FromLocalStorage = function (key) {
+            if (this.userPreference.hasItem(key ? key : 'fileManagerObj')) {
+                return JSON.parse(this.userPreference.get(key ? key : 'fileManagerObj'));
             }
             return null;
         };
@@ -21101,14 +21103,14 @@
         };
         return MainfolderService;
     }());
-    MainfolderService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: MainfolderService, deps: [{ token: NuxeoService$1 }, { token: UserPreferencesService$1 }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    MainfolderService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: MainfolderService, deps: [{ token: NuxeoService$1 }, { token: AppConfigService }, { token: UserPreferencesService$1 }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
     MainfolderService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: MainfolderService, providedIn: 'root' });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: MainfolderService, decorators: [{
                 type: i0.Injectable,
                 args: [{
                         providedIn: 'root',
                     }]
-            }], ctorParameters: function () { return [{ type: NuxeoService$1 }, { type: UserPreferencesService$1 }]; } });
+            }], ctorParameters: function () { return [{ type: NuxeoService$1 }, { type: AppConfigService }, { type: UserPreferencesService$1 }]; } });
 
     var RecentlyViewedService = /** @class */ (function () {
         function RecentlyViewedService(userPreference, callApiService) {
@@ -21183,12 +21185,14 @@
             this.router = router;
             this.recentlyViewedService = recentlyViewedService;
             this.onRefreshingFileManger = new rxjs.Subject();
+            this.onRefreshClipboard = new i0.EventEmitter();
             this.permissionsList = ['canDelete', 'canCreate', 'canDownload', 'canUpdate', 'canPublish', 'canPublishFolders', 'canGet', 'canCopy', 'canCopyFile', 'canDeleteFromSourceParent',
                 'canRenameToSourceParent', 'setSynchronize', 'setUnSynchronize', 'canAddToQuickAccess', 'canShare', 'canRename', 'canMove', 'canMoveFile', 'lockOwnerIfLocked', 'notSecretFile', 'isUserSubscriberToFile', 'canSubscribe'];
             this.userPermittedTypes = [];
             this.userPermittedTypesTotalSize = -1;
             this.userPermittedFilesOnly = [];
             this.isArabic = false;
+            this.clipboardPermissionList = ['canCopy', 'canMove'];
             // getTreeNodeChildren = (parent) => {
             //   let params = {
             //     queryParams: parent ? parent : '',
@@ -21241,6 +21245,54 @@
             this.fields = this.allFilesConfig.fields;
             this.pageProvider = this.allFilesConfig.pageProvider;
         };
+        // return accepted types for certain id
+        FileManagerService.prototype.getClipboardAcceptedTypes = function (id) {
+            return rxjs.from(this.nuxeoService.nuxeoClient
+                .repository()
+                .headers({
+                "properties": "*",
+                'X-NXenrichers-document': 'accepted_children',
+            })
+                .fetch(id)).pipe(operators.map(function (data) {
+                delete data._nuxeo;
+                delete data._repository;
+                return data;
+            }), operators.catchError(function (err) {
+                throw err;
+            }));
+        };
+        FileManagerService.prototype.getClipboardDocuments = function (docIds, sortObj) {
+            var _this = this;
+            return this.callApi.query({
+                pageProvider: 'Documents_InList_PP',
+                currentPageIndex: 0,
+                offset: 0,
+                pageSize: 15,
+                system_uuid: JSON.stringify(docIds),
+                sortBy: (sortObj) ? sortObj.sortBy : '',
+                sortOrder: (sortObj) ? sortObj.sortOrder : ''
+            }, {
+                headers: {
+                    "X-NXproperties": "dublincore,file,dmsfolder,generaldocument",
+                    "enrichers-document": "thumbnail,permissions"
+                }
+            }).pipe(operators.mergeMap(function (data) { return rxjs.from(data.entries).pipe(operators.mergeMap(
+            // this updates related to clipboard feature
+            function (item) {
+                item['isFile'] = _this.checkIfDocumentIsFile(item);
+                item['isSelected'] = false;
+                var permissionsCalls = _this.clipboardPermissionList.map(function (permission) {
+                    return _this.permissionEvaluatorService.evaluateRule(permission, { entity: item });
+                });
+                return rxjs.combineLatest(permissionsCalls);
+            }, function (original, detail) {
+                _this.clipboardPermissionList.forEach(function (value, index) {
+                    original[value] = detail[index];
+                });
+            }), operators.toArray(), operators.map(function (entry) { return (__spreadArray([], __read(data.entries))); })); }), operators.catchError(function (err) {
+                throw err;
+            }));
+        };
         FileManagerService.prototype.sortingTypes = function (types) {
             if (this.isArabic) {
                 types = types.sort(function (item1, item2) {
@@ -21463,10 +21515,11 @@
                 system_isTrashed: false,
                 pageSize: 500
             };
-            return (id == 'root' ? rxjs.of(this.mainFolderService.get_fileManagerObj_FromLocalStorage()) : this.callApi
-                .query(Object.assign({ pageProvider: this.pageProvider }, params), {
-                headers: this.headers,
-            }))
+            return (id == 'root' ? rxjs.of(this.mainFolderService.get_fileManagerObj_FromLocalStorage('fileManagerObj')) :
+                id === 'workSpaceRoot' ? rxjs.of(this.mainFolderService.get_fileManagerObj_FromLocalStorage('workSpaceFileMangerObj')) : this.callApi
+                    .query(Object.assign({ pageProvider: this.pageProvider }, params), {
+                    headers: this.headers,
+                }))
                 .pipe(operators.map(function (data) { return data.entries.map(function (item) { return _this.adapter.adaptIn(item, _this.fields); }); }), operators.map(function (entries) { return entries.map(function (item) { return _this.fileManagerAdapter.adapt(item); }); }), operators.mergeMap(function (entries) { return rxjs.from(entries).pipe(operators.mergeMap(function (item) {
                 var permissionsCalls = _this.permissionsList.map(function (permission) {
                     return _this.permissionEvaluatorService.evaluateRule(permission, { entity: item.entity });
@@ -21528,10 +21581,11 @@
                 currentPageIndex: 0,
                 pageSize: 500,
             };
-            return (id == 'root' ? this.mainFolderService.save_fileManagerObj_ToLocalStorage(true) : this.callApi
-                .query(Object.assign({ pageProvider: 'PP_Document_Content_DB' }, params), {
-                headers: this.headers,
-            }))
+            return (id == 'root' ? this.mainFolderService.save_fileManagerObj_ToLocalStorage('AC_UA_GetFileManagerID') :
+                id == 'workSpaceRoot' ? this.mainFolderService.save_fileManagerObj_ToLocalStorage('AC_UA_GetDepartmentWorkspaces') : this.callApi
+                    .query(Object.assign({ pageProvider: 'PP_Document_Content_DB' }, params), {
+                    headers: this.headers,
+                }))
                 .pipe(operators.map(function (data) { return data.entries.map(function (item) { return _this.adapter.adaptIn(item, _this.fields); }); }), operators.map(function (entries) { return entries.map(function (item) { return _this.fileManagerAdapter.adapt(item); }); }), operators.mergeMap(function (entries) { return rxjs.from(entries).pipe(operators.mergeMap(function (item) {
                 var permissionsCalls = _this.permissionsList.map(function (permission) {
                     return _this.permissionEvaluatorService.evaluateRule(permission, { entity: item.entity });
@@ -23265,6 +23319,48 @@
                     }]
             }], ctorParameters: function () { return [{ type: NuxeoService$1 }, { type: i1__namespace$6.MatDialog }, { type: AdapterService }]; } });
 
+    var DisplaySuitableIconComponent = /** @class */ (function () {
+        function DisplaySuitableIconComponent(iconService) {
+            this.iconService = iconService;
+            this.dataType = 'document';
+            this.archive = false;
+        }
+        DisplaySuitableIconComponent.prototype.ngOnInit = function () {
+            this.image = this.getFileIcon(this.data);
+        };
+        DisplaySuitableIconComponent.prototype.getFileIcon = function (document) {
+            if (!this.archive)
+                return this.iconService.getFileIcon(document, this.dataType);
+            else
+                return this.iconService.getArchivedDocumentIcon(document, this.dataType);
+        };
+        // used to recalculate icon when sorting in table ( when sorting component not rendered again so onint won't excuted )
+        DisplaySuitableIconComponent.prototype.ngOnChanges = function () {
+            this.image = this.getFileIcon(this.data);
+        };
+        return DisplaySuitableIconComponent;
+    }());
+    DisplaySuitableIconComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DisplaySuitableIconComponent, deps: [{ token: IconService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    DisplaySuitableIconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DisplaySuitableIconComponent, selector: "app-display-suitable-icon", inputs: { data: "data", size: "size", dataType: "dataType", archive: "archive" }, usesOnChanges: true, ngImport: i0__namespace, template: "<!-- <div *ngIf=\" data.type == 'Folder';else notFolder\">\r\n  <div [style.width]=\"size\">\r\n    <img class=\"w-full\" [src]=\"'assets/drive-icons/folder.png'\" />\r\n  </div>\r\n</div>\r\n<ng-template #notFolder>\r\n  <div *ngIf=\"!data.properties.file; else file\">\r\n    <img class=\"w-full\" [src]=\"'assets/drive-icons/generic.png'\" />\r\n  </div>\r\n  <ng-template #file>\r\n    <div *ngIf=\"data.properties.file['mime-type'].includes('image');else noImage\" [style.width]=\"size\">\r\n      <img class=\"w-full\" [src]=\"data.contextParameters.thumbnail.url | secure | async\" />\r\n      <ng-template #noImage>\r\n        <mat-icon svgIcon=\"iconsmind:photo\" class=\"icon-size-6\"></mat-icon>\r\n      </ng-template>    \r\n    </div>\r\n    <div *ngIf=\" data.properties.file['mime-type'].includes('video');else noVideo\" [style.width]=\"size\">\r\n      <figure class=\"hover-video w-full\">\r\n        <img class=\"w-full\" [src]=\"data.contextParameters.thumbnail.url | secure | async\" />\r\n        <figcaption>\r\n          <mat-icon svgIcon=\"iconsmind:play_music\" class=\"icon-size-4\"></mat-icon>\r\n        </figcaption>\r\n      </figure>\r\n      <ng-template #noVideo>\r\n        <mat-icon svgIcon=\"iconsmind:video_2\" class=\"icon-size-6\"></mat-icon>\r\n      </ng-template>   \r\n    </div>\r\n    <div *ngIf=\" data.properties.file['mime-type'].includes('application')\">\r\n      <mat-icon svgIcon=\"iconsmind:file\" class=\"icon-size-6\"></mat-icon>\r\n    </div>\r\n  </ng-template>\r\n</ng-template> -->\r\n\r\n\r\n<div [style.width]=\"size\">\r\n  <img class=\"w-full\" [src]=\"image\" />\r\n</div>", styles: [".hover-video{display:inline-block;margin:8px;max-width:100%;min-width:100%;overflow:hidden;position:relative;text-align:center}.hover-video *{box-sizing:border-box;transition:all .45s ease}.hover-video:before,.hover-video:after{position:absolute;top:0;bottom:0;left:0;right:0;content:\"\";transition:all .3s ease;z-index:1;opacity:0;transform:scaleY(2)}.hover-video video{vertical-align:top;max-width:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}.hover-video figcaption{position:absolute;top:0;bottom:0;left:0;right:0;align-items:center;z-index:1;display:flex;flex-direction:column;justify-content:center;line-height:1.1em;opacity:0;z-index:2;transition-delay:.1s;font-size:24px;font-family:sans-serif;font-weight:400;letter-spacing:1px;text-transform:uppercase}.hover-video{transform:scale(1);opacity:1}.hover-video>video{opacity:.7}.hover-video figcaption{opacity:1}.hover-video:hover figcaption:hover{opacity:.5;background-color:#eaecee}\n"] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DisplaySuitableIconComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'app-display-suitable-icon',
+                        templateUrl: './display-suitable-icon.component.html',
+                        styleUrls: ['./display-suitable-icon.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: IconService }]; }, propDecorators: { data: [{
+                    type: i0.Input,
+                    args: ['data']
+                }], size: [{
+                    type: i0.Input,
+                    args: ['size']
+                }], dataType: [{
+                    type: i0.Input
+                }], archive: [{
+                    type: i0.Input
+                }] } });
+
     var DynamicTabsComponent = /** @class */ (function () {
         function DynamicTabsComponent() {
             this.tabs = [];
@@ -24357,7 +24453,7 @@
         return SidepanelComponent;
     }());
     SidepanelComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: SidepanelComponent, deps: [{ token: i3__namespace.DatePipe }, { token: UserPreferencesService$1 }, { token: DialogMangmentService }, { token: DynamicFormService }, { token: DocumentsService }, { token: TagsApiService }, { token: TranslationService$1 }, { token: i1__namespace$6.MatDialog }, { token: SharedDocsService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    SidepanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: SidepanelComponent, selector: "app-sidepanel", inputs: { selectedItem: "selectedItem", menuOpen: "menuOpen", sourcePage: "sourcePage", allowAddAndBlock: "allowAddAndBlock" }, outputs: { onCloseSideMenu: "onCloseSideMenu" }, viewQueries: [{ propertyName: "detailsTemplate", first: true, predicate: ["detailsTemplate"], descendants: true, static: true }, { propertyName: "commentsTemplate", first: true, predicate: ["commentsTemplate"], descendants: true, static: true }, { propertyName: "activityTemplate", first: true, predicate: ["activityTemplate"], descendants: true, static: true }, { propertyName: "permissionsTemplate", first: true, predicate: ["permissionsTemplate"], descendants: true, static: true }, { propertyName: "filesTemplate", first: true, predicate: ["filesTemplate"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"side-menu-details\" SetRtl>\r\n    <div class=\"h-full\" *ngIf=\"selectedItem && showDetails && !sideMenuLoading\">\r\n        <div class=\"\">\r\n            <div class=\"mb-3 px-5 py-1 w-100 flex border-b-2 items-center\">\r\n                <title-with-icon class=\"-my-1.5\" [context]=\"selectedItem.entity\" [showTitle]=\"false\"></title-with-icon>\r\n\r\n                <div class=\"justify-center flex flex-col   flex-1 flex-grow-0 w-7/12\" *ngIf=\"!selectedItem.isDirectory\">\r\n                    <div class=\"text-base text-gray-500 font-bold truncate\"\r\n                        [title]=\"selectedItem.entity?.properties?.['file:content']?.['name']\"\r\n                        [alt]=\"selectedItem.entity?.properties?.['file:content']?.['name']\">\r\n                        {{selectedItem.entity?.properties?.['file:content']?.['name']}}\r\n                    </div>\r\n                    <div class=\"text-gray-500 text-sm\">\r\n                        {{((selectedItem.entity?.properties?.['file:content']?.['length']) / (1024 *\r\n                        1024)).toFixed(2) }}\r\n                        MB\r\n                    </div>\r\n                </div>\r\n                <div class=\"\r\n                         d-flex\r\n                         items-center\r\n                         text-base text-gray-500\r\n                         font-bold\r\n                     \" *ngIf=\"selectedItem.isDirectory\">\r\n                    {{ selectedItem?.name }}\r\n                </div>\r\n                <ng-container *permission=\"{name: 'lockOwnerIfLocked', entity: selectedItem.entity}\">\r\n                    <mat-icon class=\"text-gray-500 cursor-pointer  mx-3\"\r\n                        *permission=\"{name: 'canUpdate', entity: selectedItem.entity}\"\r\n                        matTooltip=\"{{ 'FOLDERS.UPDATE_DETAILS' | translate }}\"\r\n                        (click)=\"openUpdateFromSideMenu()\">edit</mat-icon>\r\n                </ng-container>\r\n            </div>\r\n            <mat-icon class=\"close-icon text-gray-500\" (click)=\"closeDetailsMenu()\"\r\n                [matTooltip]=\"'BUTTONS.CLOSE' | translate\">close</mat-icon>\r\n        </div>\r\n        <div class=\"dynamic-section\">\r\n            <div class=\"mx-2 h-full\">\r\n                <app-dynamic-tabs [tabs]=\"myTabs\"></app-dynamic-tabs>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"h-full font-bold d-flex justify-center items-center\" *ngIf=\"sideMenuLoading\">\r\n        {{ \"loading\" | translate }}\r\n    </div>\r\n</div>\r\n\r\n<!-- Comments -->\r\n<ng-template #commentsTemplate>\r\n    <div class=\"overflow-auto h-full\">\r\n        <app-comments-dashlet [correspondence]=\"sideMenuFileDetails\" [entityId]=\"selectedItem.entity.uid\"\r\n            [showaddcomment]=\"true\" [row]=\"false\">\r\n        </app-comments-dashlet>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- myLogFile -->\r\n<ng-template #activityTemplate>\r\n    <!-- <cts-viewer-log [correspondence]=\"selectedItem.entity\"></cts-viewer-log> -->\r\n    <div class=\"h-full mt-3\">\r\n        <app-activities-log [documentId]=\"selectedItem.entity.uid\" [documentTitle]=\"selectedItem.entity.title\"\r\n            [file]=\"sideMenuFileDetails\"></app-activities-log>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #permissionsTemplate>\r\n    <div class=\"h-full overflow-auto px-2 mt-3\">\r\n        <app-permissions [sourcePage]=\"sourcePage\"\r\n        [allowAddAndBlock]=\"allowAddAndBlock\"  [document]=\"sideMenuFileDetails\"\r\n            [documentId]=\"selectedItem.entity.uid\"></app-permissions>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Files Tab -->\r\n<ng-template #filesTemplate>\r\n    <div class=\"h-full overflow-auto px-2 mt-3\">\r\n        <cts-versions [file]=\"selectedItem.entity\"></cts-versions>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Details -->\r\n<ng-template #detailsTemplate>\r\n    <div class=\"pb-2 mt-3 h-full px-2 overflow-auto\">\r\n        <div class=\"static-data\">\r\n            <div class=\"mt-5\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.TITLE_ONLY\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{ dynamicFormData[\"dc:title\"] }}\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.DESCRIPTION_ONLY\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{ dynamicFormData[\"dc:description\"] }}\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.CREATED_AT\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{\r\n                    dynamicFormData[\"dc:created\"]\r\n                    | localizedDate: \"dd MMMM yyyy\":(isArabic? 'ar-AR' : 'en-US')\r\n                    }}\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.LAST_MODIFIED\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{\r\n                    dynamicFormData[\"dc:modified\"]\r\n                    | localizedDate: \"dd MMMM yyyy\":(isArabic? 'ar-AR' : 'en-US')\r\n                    }}\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"super-document-fields\">\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:documentSubject\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_SUBJECT\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:documentSubject\"] ? dynamicFormData[\"gdoc:documentSubject\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:documentNumber\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_NUMBER\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:documentNumber\"] ? dynamicFormData[\"gdoc:documentNumber\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:documentReferenceNumber\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_REF_NUMBER\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\" dir=\"ltr\">\r\n                        {{ dynamicFormData[\"gdoc:documentReferenceNumber\"] ?\r\n                        dynamicFormData[\"gdoc:documentReferenceNumber\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:gDocumentDate\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_DATE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:gDocumentDate\"] ? (dynamicFormData[\"gdoc:gDocumentDate\"] |\r\n                        localizedDate: \"dd MMMM yyyy\":(isArabic? 'ar-AR' : 'en-US')) : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='(selectedItem.entity.category && selectedItem.entity.category !== {})'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.CATEGORY\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.category && selectedItem.entity.category !== {}) ?\r\n                        (isArabic ? selectedItem.entity.category.arabicName : selectedItem.entity.category.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\"\r\n                    *ngIf='(selectedItem.entity.categoryType && selectedItem.entity.categoryType.arabicName)'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.CATEGORY_TYPE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.categoryType && selectedItem.entity.categoryType.arabicName) ?\r\n                        (isArabic ? selectedItem.entity.categoryType.arabicName :\r\n                        selectedItem.entity.categoryType.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\" *ngIf='(selectedItem.entity.mainTopic && selectedItem.entity.mainTopic.arabicName)'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.MAIN_TOPIC\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.mainTopic && selectedItem.entity.mainTopic.arabicName) ?\r\n                        (isArabic ? selectedItem.entity.mainTopic.arabicName :\r\n                        selectedItem.entity.mainTopic.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\"\r\n                    *ngIf='(selectedItem.entity.documentType && selectedItem.entity.documentType.arabicName)'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_TYPE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.documentType && selectedItem.entity.documentType.arabicName) ?\r\n                        (isArabic ? selectedItem.entity.documentType.arabicName :\r\n                        selectedItem.entity.documentType.englishTitle)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:secrecyLevel\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.SCRECY_LEVEL\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ 'vocabulary.VOC_SecrecyLevel.' + dynamicFormData[\"gdoc:secrecyLevel\"] | translate}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:importance\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.IMPORTANCE_LEVEL\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ 'vocabulary.VOC_Importance.' + dynamicFormData[\"gdoc:importance\"] | translate}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='selectedItem.entity.department'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DEPARTMENT_NAME\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ selectedItem.entity.department ?\r\n                        (isArabic ? selectedItem.entity.department.arabicName :\r\n                        selectedItem.entity.department.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <!-- <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:departmentCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DEPARTMENT_CODE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:departmentCode\"] ? dynamicFormData[\"gdoc:departmentCode\"] : '--'}}\r\n                    </div>\r\n                </div> -->\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:agencyCategoryCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.AGENCY_CATEGORY_CODE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:agencyCategoryCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:agencyCategoryCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:agencyCategoryCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:agencyNameCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.AGENCY_NAME\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:agencyNameCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:agencyNameCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:agencyNameCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:countryCategoryCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.COUNTRY_CATEGORY_CODE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:countryCategoryCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:countryCategoryCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:countryCategoryCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:countryCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.COUNTRY_NAME\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:countryCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:countryCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:countryCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:remarks\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.REMARKS\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:remarks\"] ? dynamicFormData[\"gdoc:remarks\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.BY\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm d-flex\">\r\n                    <div class=\"d-flex items-center bg-gray-100 rounded-xl\">\r\n                        <app-user [user]=\"dynamicFormData['dc:creator']\"></app-user>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\" *ngIf=\"dynamicFormData['dc:contributors'].length > 0\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.CONTRUBITORS\" | translate }}\r\n                </div>\r\n                <div class=\"d-flex flex-wrap\">\r\n                    <div class=\"d-flex items-center bg-gray-100 rounded-xl mb-2\"\r\n                        *ngFor=\"let user of dynamicFormData['dc:contributors']\">\r\n                        <app-user [user]=\"user\"></app-user>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\" *ngIf=\"sharedListUser.length > 0\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{\"share.shareWith\" | translate}}\r\n                </div>\r\n                <div class=\"d-flex flex-wrap\">\r\n                    <div class=\"d-flex items-center bg-gray-100 rounded-xl mb-2\" *ngFor=\"let user of sharedListUser\">\r\n                        <app-user [user]=\"user\"></app-user>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"mt-5\" *ngIf=\"dynamicForm && dynamicFormData\">\r\n            <app-multiple-dynamic-form-viewer [form]=\"dynamicForm\"\r\n                [data]=\"dynamicFormData\"></app-multiple-dynamic-form-viewer>\r\n        </div>\r\n        <div class=\"tags-wrappers relative px-0 py-3\">\r\n            <cts-correspondence-tags [correspondence]=\"sideMenuFileDetails\" [customClass]=\"'tags-dms-wrapper'\"\r\n                [useParams]=\"true\" [addCustomApiName]=\"'Services.TagDocument'\"\r\n                [deleteCustomApiName]=\"'Services.UntagDocument'\">\r\n            </cts-correspondence-tags>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [""], components: [{ type: i2__namespace$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicTabsComponent, selector: "app-dynamic-tabs", inputs: ["tabs", "selectedIndex"] }, { type: CommentsDashletComponent, selector: "app-comments-dashlet", inputs: ["entityId", "correspondence", "row", "showaddcomment", "showCommentActions"] }, { type: ActivitiesLogComponent, selector: "app-activities-log", inputs: ["documentId", "file", "documentTitle"], outputs: ["success"] }, { type: PermissionsComponent, selector: "app-permissions", inputs: ["documentId", "document", "allowAddAndBlock", "sourcePage"] }, { type: VersionsComponent, selector: "cts-versions", inputs: ["selectedVersion", "file", "actions"], outputs: ["handleActions"] }, { type: UserComponent, selector: "app-user", inputs: ["user", "type"] }, { type: MultipleDynamicFormViewerComponent, selector: "app-multiple-dynamic-form-viewer", inputs: ["form", "data"] }, { type: CorrespondenceTagsComponent, selector: "cts-correspondence-tags", inputs: ["correspondence", "customClass", "addCustomApiName", "deleteCustomApiName", "useParams", "accordionMode", "systemTags", "accordionOpen", "title"] }], directives: [{ type: SetRtlDirective, selector: "[SetRtl]" }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i8__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i3__namespace$3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace$1.TranslatePipe, "localizedDate": LocalizedDatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    SidepanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: SidepanelComponent, selector: "app-sidepanel", inputs: { selectedItem: "selectedItem", menuOpen: "menuOpen", sourcePage: "sourcePage", allowAddAndBlock: "allowAddAndBlock" }, outputs: { onCloseSideMenu: "onCloseSideMenu" }, viewQueries: [{ propertyName: "detailsTemplate", first: true, predicate: ["detailsTemplate"], descendants: true, static: true }, { propertyName: "commentsTemplate", first: true, predicate: ["commentsTemplate"], descendants: true, static: true }, { propertyName: "activityTemplate", first: true, predicate: ["activityTemplate"], descendants: true, static: true }, { propertyName: "permissionsTemplate", first: true, predicate: ["permissionsTemplate"], descendants: true, static: true }, { propertyName: "filesTemplate", first: true, predicate: ["filesTemplate"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"side-menu-details\" SetRtl>\r\n    <div class=\"h-full\" *ngIf=\"selectedItem && showDetails && !sideMenuLoading\">\r\n        <div class=\"\">\r\n            <div class=\"mb-3 px-5 py-1 w-100 flex border-b-2 items-center\">\r\n                <!-- <title-with-icon class=\"-my-1.5\" [context]=\"selectedItem.entity\" [showTitle]=\"false\"></title-with-icon> -->\r\n                <app-display-suitable-icon [data]=\"selectedItem\" [size]=\"'40px'\"></app-display-suitable-icon>\r\n\r\n                <div class=\"justify-center flex flex-col   flex-1 flex-grow-0 w-7/12\" *ngIf=\"!selectedItem.isDirectory\">\r\n                    <div class=\"text-base text-gray-500 font-bold truncate\"\r\n                        [title]=\"selectedItem.entity?.properties?.['file:content']?.['name']\"\r\n                        [alt]=\"selectedItem.entity?.properties?.['file:content']?.['name']\">\r\n                        {{selectedItem.entity?.properties?.['file:content']?.['name']}}\r\n                    </div>\r\n                    <div class=\"text-gray-500 text-sm\">\r\n                        {{((selectedItem.entity?.properties?.['file:content']?.['length']) / (1024 *\r\n                        1024)).toFixed(2) }}\r\n                        MB\r\n                    </div>\r\n                </div>\r\n                <div class=\"\r\n                         d-flex\r\n                         items-center\r\n                         text-base text-gray-500\r\n                         font-bold\r\n                     \" *ngIf=\"selectedItem.isDirectory\">\r\n                    {{ selectedItem?.name }}\r\n                </div>\r\n                <ng-container *permission=\"{name: 'lockOwnerIfLocked', entity: selectedItem.entity}\">\r\n                    <mat-icon class=\"text-gray-500 cursor-pointer  mx-3\"\r\n                        *permission=\"{name: 'canUpdate', entity: selectedItem.entity}\"\r\n                        matTooltip=\"{{ 'FOLDERS.UPDATE_DETAILS' | translate }}\"\r\n                        (click)=\"openUpdateFromSideMenu()\">edit</mat-icon>\r\n                </ng-container>\r\n            </div>\r\n            <mat-icon class=\"close-icon text-gray-500\" (click)=\"closeDetailsMenu()\"\r\n                [matTooltip]=\"'BUTTONS.CLOSE' | translate\">close</mat-icon>\r\n        </div>\r\n        <div class=\"dynamic-section\">\r\n            <div class=\"mx-2 h-full\">\r\n                <app-dynamic-tabs [tabs]=\"myTabs\"></app-dynamic-tabs>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"h-full font-bold d-flex justify-center items-center\" *ngIf=\"sideMenuLoading\">\r\n        {{ \"loading\" | translate }}\r\n    </div>\r\n</div>\r\n\r\n<!-- Comments -->\r\n<ng-template #commentsTemplate>\r\n    <div class=\"overflow-auto h-full\">\r\n        <app-comments-dashlet [correspondence]=\"sideMenuFileDetails\" [entityId]=\"selectedItem.entity.uid\"\r\n            [showaddcomment]=\"true\" [row]=\"false\">\r\n        </app-comments-dashlet>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- myLogFile -->\r\n<ng-template #activityTemplate>\r\n    <!-- <cts-viewer-log [correspondence]=\"selectedItem.entity\"></cts-viewer-log> -->\r\n    <div class=\"h-full mt-3\">\r\n        <app-activities-log [documentId]=\"selectedItem.entity.uid\" [documentTitle]=\"selectedItem.entity.title\"\r\n            [file]=\"sideMenuFileDetails\"></app-activities-log>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #permissionsTemplate>\r\n    <div class=\"h-full overflow-auto px-2 mt-3\">\r\n        <app-permissions [sourcePage]=\"sourcePage\"\r\n        [allowAddAndBlock]=\"allowAddAndBlock\"  [document]=\"sideMenuFileDetails\"\r\n            [documentId]=\"selectedItem.entity.uid\"></app-permissions>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Files Tab -->\r\n<ng-template #filesTemplate>\r\n    <div class=\"h-full overflow-auto px-2 mt-3\">\r\n        <cts-versions [file]=\"selectedItem.entity\"></cts-versions>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Details -->\r\n<ng-template #detailsTemplate>\r\n    <div class=\"pb-2 mt-3 h-full px-2 overflow-auto\">\r\n        <div class=\"static-data\">\r\n            <div class=\"mt-5\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.TITLE_ONLY\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{ dynamicFormData[\"dc:title\"] }}\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.DESCRIPTION_ONLY\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{ dynamicFormData[\"dc:description\"] }}\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.CREATED_AT\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{\r\n                    dynamicFormData[\"dc:created\"]\r\n                    | localizedDate: \"dd MMMM yyyy\":(isArabic? 'ar-AR' : 'en-US')\r\n                    }}\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.LAST_MODIFIED\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm\">\r\n                    {{\r\n                    dynamicFormData[\"dc:modified\"]\r\n                    | localizedDate: \"dd MMMM yyyy\":(isArabic? 'ar-AR' : 'en-US')\r\n                    }}\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"super-document-fields\">\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:documentSubject\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_SUBJECT\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:documentSubject\"] ? dynamicFormData[\"gdoc:documentSubject\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:documentNumber\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_NUMBER\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:documentNumber\"] ? dynamicFormData[\"gdoc:documentNumber\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:documentReferenceNumber\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_REF_NUMBER\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\" dir=\"ltr\">\r\n                        {{ dynamicFormData[\"gdoc:documentReferenceNumber\"] ?\r\n                        dynamicFormData[\"gdoc:documentReferenceNumber\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:gDocumentDate\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_DATE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:gDocumentDate\"] ? (dynamicFormData[\"gdoc:gDocumentDate\"] |\r\n                        localizedDate: \"dd MMMM yyyy\":(isArabic? 'ar-AR' : 'en-US')) : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='(selectedItem.entity.category && selectedItem.entity.category !== {})'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.CATEGORY\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.category && selectedItem.entity.category !== {}) ?\r\n                        (isArabic ? selectedItem.entity.category.arabicName : selectedItem.entity.category.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\"\r\n                    *ngIf='(selectedItem.entity.categoryType && selectedItem.entity.categoryType.arabicName)'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.CATEGORY_TYPE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.categoryType && selectedItem.entity.categoryType.arabicName) ?\r\n                        (isArabic ? selectedItem.entity.categoryType.arabicName :\r\n                        selectedItem.entity.categoryType.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\" *ngIf='(selectedItem.entity.mainTopic && selectedItem.entity.mainTopic.arabicName)'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.MAIN_TOPIC\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.mainTopic && selectedItem.entity.mainTopic.arabicName) ?\r\n                        (isArabic ? selectedItem.entity.mainTopic.arabicName :\r\n                        selectedItem.entity.mainTopic.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\"\r\n                    *ngIf='(selectedItem.entity.documentType && selectedItem.entity.documentType.arabicName)'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DOCUMENT_TYPE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ (selectedItem.entity.documentType && selectedItem.entity.documentType.arabicName) ?\r\n                        (isArabic ? selectedItem.entity.documentType.arabicName :\r\n                        selectedItem.entity.documentType.englishTitle)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:secrecyLevel\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.SCRECY_LEVEL\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ 'vocabulary.VOC_SecrecyLevel.' + dynamicFormData[\"gdoc:secrecyLevel\"] | translate}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:importance\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.IMPORTANCE_LEVEL\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ 'vocabulary.VOC_Importance.' + dynamicFormData[\"gdoc:importance\"] | translate}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='selectedItem.entity.department'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DEPARTMENT_NAME\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ selectedItem.entity.department ?\r\n                        (isArabic ? selectedItem.entity.department.arabicName :\r\n                        selectedItem.entity.department.englishName)\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <!-- <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:departmentCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.DEPARTMENT_CODE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:departmentCode\"] ? dynamicFormData[\"gdoc:departmentCode\"] : '--'}}\r\n                    </div>\r\n                </div> -->\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:agencyCategoryCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.AGENCY_CATEGORY_CODE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:agencyCategoryCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:agencyCategoryCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:agencyCategoryCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:agencyNameCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.AGENCY_NAME\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:agencyNameCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:agencyNameCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:agencyNameCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:countryCategoryCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.COUNTRY_CATEGORY_CODE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:countryCategoryCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:countryCategoryCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:countryCategoryCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:countryCode\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.COUNTRY_NAME\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:countryCode\"] ?\r\n                        (isArabic ? dynamicFormData[\"gdoc:countryCode\"]['properties']['label_ar']\r\n                        : dynamicFormData[\"gdoc:countryCode\"]['properties']['label_en'])\r\n                        : '--'}}\r\n                    </div>\r\n                </div>\r\n                <div class=\"mt-3\" *ngIf='dynamicFormData[\"gdoc:remarks\"]'>\r\n                    <div class=\"text-gray-500 font-bold text-base\">\r\n                        {{ \"CREATE.REMARKS\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-gray-900 text-sm\">\r\n                        {{ dynamicFormData[\"gdoc:remarks\"] ? dynamicFormData[\"gdoc:remarks\"] : '--'}}\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"mt-3\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.BY\" | translate }}\r\n                </div>\r\n                <div class=\"text-gray-900 text-sm d-flex\">\r\n                    <div class=\"d-flex items-center bg-gray-100 rounded-xl\">\r\n                        <app-user [user]=\"dynamicFormData['dc:creator']\"></app-user>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\" *ngIf=\"dynamicFormData['dc:contributors'].length > 0\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{ \"FOLDERS.CONTRUBITORS\" | translate }}\r\n                </div>\r\n                <div class=\"d-flex flex-wrap\">\r\n                    <div class=\"d-flex items-center bg-gray-100 rounded-xl mb-2\"\r\n                        *ngFor=\"let user of dynamicFormData['dc:contributors']\">\r\n                        <app-user [user]=\"user\"></app-user>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"mt-3\" *ngIf=\"sharedListUser.length > 0\">\r\n                <div class=\"text-gray-500 font-bold text-base\">\r\n                    {{\"share.shareWith\" | translate}}\r\n                </div>\r\n                <div class=\"d-flex flex-wrap\">\r\n                    <div class=\"d-flex items-center bg-gray-100 rounded-xl mb-2\" *ngFor=\"let user of sharedListUser\">\r\n                        <app-user [user]=\"user\"></app-user>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"mt-5\" *ngIf=\"dynamicForm && dynamicFormData\">\r\n            <app-multiple-dynamic-form-viewer [form]=\"dynamicForm\"\r\n                [data]=\"dynamicFormData\"></app-multiple-dynamic-form-viewer>\r\n        </div>\r\n        <div class=\"tags-wrappers relative px-0 py-3\">\r\n            <cts-correspondence-tags [correspondence]=\"sideMenuFileDetails\" [customClass]=\"'tags-dms-wrapper'\"\r\n                [useParams]=\"true\" [addCustomApiName]=\"'Services.TagDocument'\"\r\n                [deleteCustomApiName]=\"'Services.UntagDocument'\">\r\n            </cts-correspondence-tags>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [""], components: [{ type: DisplaySuitableIconComponent, selector: "app-display-suitable-icon", inputs: ["data", "size", "dataType", "archive"] }, { type: i2__namespace$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicTabsComponent, selector: "app-dynamic-tabs", inputs: ["tabs", "selectedIndex"] }, { type: CommentsDashletComponent, selector: "app-comments-dashlet", inputs: ["entityId", "correspondence", "row", "showaddcomment", "showCommentActions"] }, { type: ActivitiesLogComponent, selector: "app-activities-log", inputs: ["documentId", "file", "documentTitle"], outputs: ["success"] }, { type: PermissionsComponent, selector: "app-permissions", inputs: ["documentId", "document", "allowAddAndBlock", "sourcePage"] }, { type: VersionsComponent, selector: "cts-versions", inputs: ["selectedVersion", "file", "actions"], outputs: ["handleActions"] }, { type: UserComponent, selector: "app-user", inputs: ["user", "type"] }, { type: MultipleDynamicFormViewerComponent, selector: "app-multiple-dynamic-form-viewer", inputs: ["form", "data"] }, { type: CorrespondenceTagsComponent, selector: "cts-correspondence-tags", inputs: ["correspondence", "customClass", "addCustomApiName", "deleteCustomApiName", "useParams", "accordionMode", "systemTags", "accordionOpen", "title"] }], directives: [{ type: SetRtlDirective, selector: "[SetRtl]" }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i8__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i3__namespace$3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace$1.TranslatePipe, "localizedDate": LocalizedDatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: SidepanelComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -25360,48 +25456,6 @@
                         }] }, { type: NuxeoService$1 }, { type: DialogMangmentService }, { type: GlobalPdfTron }];
         } });
 
-    var DisplaySuitableIconComponent = /** @class */ (function () {
-        function DisplaySuitableIconComponent(iconService) {
-            this.iconService = iconService;
-            this.dataType = 'document';
-            this.archive = false;
-        }
-        DisplaySuitableIconComponent.prototype.ngOnInit = function () {
-            this.image = this.getFileIcon(this.data);
-        };
-        DisplaySuitableIconComponent.prototype.getFileIcon = function (document) {
-            if (!this.archive)
-                return this.iconService.getFileIcon(document, this.dataType);
-            else
-                return this.iconService.getArchivedDocumentIcon(document, this.dataType);
-        };
-        // used to recalculate icon when sorting in table ( when sorting component not rendered again so onint won't excuted )
-        DisplaySuitableIconComponent.prototype.ngOnChanges = function () {
-            this.image = this.getFileIcon(this.data);
-        };
-        return DisplaySuitableIconComponent;
-    }());
-    DisplaySuitableIconComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DisplaySuitableIconComponent, deps: [{ token: IconService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    DisplaySuitableIconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DisplaySuitableIconComponent, selector: "app-display-suitable-icon", inputs: { data: "data", size: "size", dataType: "dataType", archive: "archive" }, usesOnChanges: true, ngImport: i0__namespace, template: "<!-- <div *ngIf=\" data.type == 'Folder';else notFolder\">\r\n  <div [style.width]=\"size\">\r\n    <img class=\"w-full\" [src]=\"'assets/drive-icons/folder.png'\" />\r\n  </div>\r\n</div>\r\n<ng-template #notFolder>\r\n  <div *ngIf=\"!data.properties.file; else file\">\r\n    <img class=\"w-full\" [src]=\"'assets/drive-icons/generic.png'\" />\r\n  </div>\r\n  <ng-template #file>\r\n    <div *ngIf=\"data.properties.file['mime-type'].includes('image');else noImage\" [style.width]=\"size\">\r\n      <img class=\"w-full\" [src]=\"data.contextParameters.thumbnail.url | secure | async\" />\r\n      <ng-template #noImage>\r\n        <mat-icon svgIcon=\"iconsmind:photo\" class=\"icon-size-6\"></mat-icon>\r\n      </ng-template>    \r\n    </div>\r\n    <div *ngIf=\" data.properties.file['mime-type'].includes('video');else noVideo\" [style.width]=\"size\">\r\n      <figure class=\"hover-video w-full\">\r\n        <img class=\"w-full\" [src]=\"data.contextParameters.thumbnail.url | secure | async\" />\r\n        <figcaption>\r\n          <mat-icon svgIcon=\"iconsmind:play_music\" class=\"icon-size-4\"></mat-icon>\r\n        </figcaption>\r\n      </figure>\r\n      <ng-template #noVideo>\r\n        <mat-icon svgIcon=\"iconsmind:video_2\" class=\"icon-size-6\"></mat-icon>\r\n      </ng-template>   \r\n    </div>\r\n    <div *ngIf=\" data.properties.file['mime-type'].includes('application')\">\r\n      <mat-icon svgIcon=\"iconsmind:file\" class=\"icon-size-6\"></mat-icon>\r\n    </div>\r\n  </ng-template>\r\n</ng-template> -->\r\n\r\n\r\n<div [style.width]=\"size\">\r\n  <img class=\"w-full\" [src]=\"image\" />\r\n</div>", styles: [".hover-video{display:inline-block;margin:8px;max-width:100%;min-width:100%;overflow:hidden;position:relative;text-align:center}.hover-video *{box-sizing:border-box;transition:all .45s ease}.hover-video:before,.hover-video:after{position:absolute;top:0;bottom:0;left:0;right:0;content:\"\";transition:all .3s ease;z-index:1;opacity:0;transform:scaleY(2)}.hover-video video{vertical-align:top;max-width:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}.hover-video figcaption{position:absolute;top:0;bottom:0;left:0;right:0;align-items:center;z-index:1;display:flex;flex-direction:column;justify-content:center;line-height:1.1em;opacity:0;z-index:2;transition-delay:.1s;font-size:24px;font-family:sans-serif;font-weight:400;letter-spacing:1px;text-transform:uppercase}.hover-video{transform:scale(1);opacity:1}.hover-video>video{opacity:.7}.hover-video figcaption{opacity:1}.hover-video:hover figcaption:hover{opacity:.5;background-color:#eaecee}\n"] });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DisplaySuitableIconComponent, decorators: [{
-                type: i0.Component,
-                args: [{
-                        selector: 'app-display-suitable-icon',
-                        templateUrl: './display-suitable-icon.component.html',
-                        styleUrls: ['./display-suitable-icon.component.scss']
-                    }]
-            }], ctorParameters: function () { return [{ type: IconService }]; }, propDecorators: { data: [{
-                    type: i0.Input,
-                    args: ['data']
-                }], size: [{
-                    type: i0.Input,
-                    args: ['size']
-                }], dataType: [{
-                    type: i0.Input
-                }], archive: [{
-                    type: i0.Input
-                }] } });
-
     var AttachmentItemComponent = /** @class */ (function () {
         function AttachmentItemComponent(translationService) {
             this.translationService = translationService;
@@ -26744,7 +26798,7 @@
         return ScanModalComponent;
     }());
     ScanModalComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: ScanModalComponent, deps: [{ token: i1$6.MAT_DIALOG_DATA }, { token: i1__namespace$6.MatDialogRef }, { token: UploadManagmentService }, { token: DialogMangmentService }, { token: FileManagerService }, { token: CustomToastrService }, { token: i6__namespace.FormBuilder }, { token: DynamicFormService }, { token: DateHelperService }, { token: AdapterService }, { token: TranslationService$1 }, { token: NuxeoService$1 }, { token: UserService }, { token: AppConfigService }, { token: 'environment' }, { token: DocumentScanService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ScanModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: ScanModalComponent, selector: "app-scan-modal", ngImport: i0__namespace, template: "<div class=\"scanner-modal-body relative h-full\">\r\n    <!--  -->\r\n    <!-- tabs -->\r\n    <div\r\n        class=\"scanner-tabs d-flex justify-around items-center border-b-2 border-gray-200 mb-5 text-gray-900 text-lg\"\r\n    >\r\n        <div\r\n            class=\"scanner-single-tab cursor-pointer w-1/2 text-center py-2 border-gray-900 hover:bg-gray-100\"\r\n            (click)=\"changTabTo('scan')\"\r\n            [ngClass]=\"{ 'font-bold border-b-4': activeTab === 'scan' }\"\r\n        >\r\n            {{\"CREATE.SCAN\" | translate}}\r\n        </div>\r\n        <div\r\n            class=\"scanner-single-tab cursor-pointer w-1/2 text-center py-2 border-gray-900 hover:bg-gray-100\"\r\n            (click)=\"changTabTo('form')\"\r\n            [ngClass]=\"{ 'font-bold border-b-4': activeTab === 'form' }\"\r\n        >\r\n        {{\"CREATE.DETAILS\" | translate}}\r\n        </div>\r\n    </div>\r\n    <div class=\"tabs-body-wrapper\">\r\n        <!-- uploader indicator loading -->\r\n        <div\r\n            class=\"upload-loader mx-2\"\r\n            *ngIf=\"uploadMangmentService.uploadedFilesStatus.uploadInProgress\"\r\n        >\r\n            <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\r\n        </div>\r\n\r\n        <!-- scanner -->\r\n        <div class=\"\" [ngClass]=\"{ 'd-none': activeTab === 'form' }\">\r\n            <app-document-scan\r\n                [hideUploadButton]=\"true\"\r\n                [useStoredFile]=\"true\"\r\n            ></app-document-scan>\r\n        </div>\r\n\r\n        <!-- forms and properties  -->\r\n        <div\r\n            class=\"forms-section\"\r\n            [ngClass]=\"{ 'd-none': activeTab === 'scan' }\"\r\n        >\r\n            <div class=\"w-2/3\">\r\n                <div class=\"mb-5\">\r\n                    <div class=\"label-style\">\r\n                        {{ \"CREATE.FILE_TYPE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-base text-gray-900\">\r\n                        {{ isArabic ?  fileType.arabicText : fileType.englishText }}\r\n                    </div>\r\n                </div>\r\n                <div class=\"file-fields mt-3\" SetRtl>\r\n                    <form [formGroup]=\"fileForm\" *ngIf=\"fileForm\">\r\n                        <div class=\"single-field mb-3\">\r\n                            <div class=\"label-style\">\r\n                                {{ \"CREATE.TITLE\" | translate\r\n                                }}<span class=\"text-red-500\">*</span>\r\n                            </div>\r\n                            <input\r\n                                class=\"field-style\"\r\n                                formControlName=\"title\"\r\n                                placeholder=\" {{ 'CREATE.TITLE' | translate }}\"\r\n                            />\r\n                        </div>\r\n                        <div class=\"single-field mb-3\">\r\n                            <div class=\"label-style\">\r\n                                {{ \"CREATE.DESCRIPTION\" | translate }}\r\n                            </div>\r\n                            <input\r\n                                class=\"field-style\"\r\n                                formControlName=\"description\"\r\n                                placeholder=\" {{\r\n                                    'CREATE.DESCRIPTION' | translate\r\n                                }}\"\r\n                            />\r\n                        </div>\r\n\r\n                        <!------------------ new statis form  ---------------------------->\r\n                        <div *ngIf=\"usingExtraFields\">\r\n                            \r\n                            <app-dynamic-fields-renderer [form]=\"fileForm\" [agencyNameFilter]=\"agencyNameFilter\" [countryNameFilter]=\"countryNameFilter\"></app-dynamic-fields-renderer>\r\n\r\n                            <!-- <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.DOCUMENT_SUBJECT\" | translate\r\n                                    }}<span class=\"text-red-500\">*</span>\r\n                                </div>\r\n                                <input\r\n                                    class=\"field-style\"\r\n                                    formControlName=\"subject\"\r\n                                    placeholder=\" {{\r\n                                        'CREATE.DOCUMENT_SUBJECT' | translate\r\n                                    }}\"\r\n                                />\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.DOCUMENT_NUMBER\" | translate }}\r\n                                </div>\r\n                                <input\r\n                                    class=\"field-style\"\r\n                                    formControlName=\"documentNumber\"\r\n                                    placeholder=\" {{\r\n                                        'CREATE.DOCUMENT_NUMBER' | translate\r\n                                    }}\"\r\n                                />\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <cts-dynamic-form-hijri-dateitem\r\n                                    formControlName=\"gdocumentDate\"\r\n                                    label=\"CREATE.DOCUMENT_DATE\"\r\n                                >\r\n                                </cts-dynamic-form-hijri-dateitem>\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-dynamic-form-vocabulary-item\r\n                                    [label]=\"'CREATE.SCRECY_LEVEL'\"\r\n                                    [bindLabel]=\"'label'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"false\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    [vocabularyType]=\"'VOC_SecrecyLevel'\"\r\n                                    formControlName=\"secrecyLevel\"\r\n                                >\r\n                                </app-dynamic-form-vocabulary-item>\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-dynamic-form-vocabulary-item\r\n                                    [label]=\"'CREATE.IMPORTANCE_LEVEL'\"\r\n                                    [bindLabel]=\"'label'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"false\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    [vocabularyType]=\"'VOC_Importance'\"\r\n                                    formControlName=\"importanceLevel\"\r\n                                >\r\n                                </app-dynamic-form-vocabulary-item>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.DEPARTMENT_CODE\" | translate }}\r\n                                </div>\r\n                                <app-dynamic-form-department\r\n                                    formControlName=\"departmentCode\"\r\n                                    [placeholder]=\"'please select department'\"\r\n                                    [pp_departmentNestedTree]=\"\r\n                                        'PP_OS_Departments'\r\n                                    \"\r\n                                    [pp_departmentTree]=\"'PP_OS_Departments'\"\r\n                                    [customPrefix]=\"'osdept'\"\r\n                                    [customParentProperty]=\"\r\n                                        'osdepartment_parentDepartmentCode'\r\n                                    \"\r\n                                    [useCustomAddEditAction]=\"true\"\r\n                                >\r\n                                </app-dynamic-form-department>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.AGENCY_CATEGORY_CODE'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"agencyCategoryCode\"\r\n                                    [vocbularyId]=\"'VOC_AgencyCategory'\"\r\n                                    [useFilter]=\"false\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.AGENCY_NAME'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"agencyName\"\r\n                                    [vocbularyId]=\"'VOC_Agency'\"\r\n                                    [filter]=\"agencyNameFilter\"\r\n                                    [useFilter]=\"true\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.COUNTRY_CATEGORY_CODE'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"countryCategoryCode\"\r\n                                    [vocbularyId]=\"'VOC_CountryCategory'\"\r\n                                    [useFilter]=\"false\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.COUNTRY_NAME'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"countryName\"\r\n                                    [vocbularyId]=\"'VOC_Country'\"\r\n                                    [filter]=\"countryNameFilter\"\r\n                                    [useFilter]=\"true\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.REMARKS\" | translate }}\r\n                                </div>\r\n                                <input\r\n                                    class=\"field-style\"\r\n                                    formControlName=\"remarks\"\r\n                                    placeholder=\" {{\r\n                                        'CREATE.REMARKS' | translate\r\n                                    }}\"\r\n                                />\r\n                            </div> -->\r\n                        </div>\r\n\r\n                        <!-- ----------------------------------------------------------- -->\r\n                    </form>\r\n                    <!-- *ngIf=\"\" -->\r\n                    <div\r\n                        class=\"dynamic-part -mx-4\"\r\n                        *ngIf=\"selectedFile.dynamicForm && showRenderer\"\r\n                    >\r\n                        <app-dynamic-form\r\n                            [form]=\"selectedFile.dynamicForm\"\r\n                            [data]=\"temporaryDyanmicData\"\r\n                            (change)=\"ondynamicFormChange($event)\"\r\n                        ></app-dynamic-form>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <!-- actions and buttons  -->\r\n    <div\r\n        class=\"w-full d-flex justify-between scanner-actions-wrapper absolute bottom-0\"\r\n    >\r\n        <div class=\"flex\">\r\n            <button class=\"cancelation-button\" (click)=\"closeDialog()\">\r\n                {{ \"BUTTONS.CANCEL\" | translate }}\r\n            </button>\r\n            <button class=\"cancelation-button mx-2\" (click)=\"minimizDialog()\">\r\n                {{ \"BUTTONS.MINIMIZED\" | translate }}\r\n            </button>\r\n        </div>\r\n\r\n        <!--  -->\r\n        <div class=\"d-flex\">\r\n            <!-- <button\r\n                *ngIf=\"creationFailed\"\r\n                [disabled]=\"\r\n                    scannerUploadButton.disabled ||\r\n                    !selectedFile.dynamicData.valid ||\r\n                    fileForm.invalid\r\n                \"\r\n                [ngClass]=\"{\r\n                    'opacity-30 cursor-not-allowed':\r\n                        scannerUploadButton.disabled ||\r\n                        !selectedFile.dynamicData.valid ||\r\n                        fileForm.invalid\r\n                }\"\r\n                (click)=\"createDocument()\"\r\n                class=\"submission-button\"\r\n            >\r\n                {{ \"BUTTONS.TRY_AGAIN\" | translate }}\r\n            </button> -->\r\n            <button\r\n                (click)=\"createDocument()\"\r\n                [disabled]=\"\r\n                    scannerUploadButton.disabled ||\r\n                    !selectedFile.dynamicData.valid ||\r\n                    fileForm.invalid\r\n                \"\r\n                [ngClass]=\"{\r\n                    'opacity-30 cursor-not-allowed':\r\n                        scannerUploadButton.disabled ||\r\n                        !selectedFile.dynamicData.valid ||\r\n                        fileForm.invalid\r\n                }\"\r\n                class=\"submission-button\"\r\n            >\r\n                {{ uploadMangmentService.scanCreationFailed ?  (\"BUTTONS.TRY_AGAIN\" | translate) : (\"BUTTONS.CREATE\" | translate) }}\r\n            </button>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".forms-section{display:flex;justify-content:center}.tabs-body-wrapper{height:calc(100% - 125px);overflow-y:auto;overflow-x:hidden}\n"], components: [{ type: ScanComponent, selector: "app-document-scan", inputs: ["useStoredFile", "hideUploadButton"], outputs: ["file"] }, { type: DynamicFieldsRendererComponent, selector: "app-dynamic-fields-renderer", inputs: ["form", "agencyNameFilter", "countryNameFilter", "fields"] }, { type: DynamicFormComponent, selector: "app-dynamic-form", inputs: ["form", "data", "readOnly"], outputs: ["change"] }], directives: [{ type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SetRtlDirective, selector: "[SetRtl]" }, { type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    ScanModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: ScanModalComponent, selector: "app-scan-modal", ngImport: i0__namespace, template: "<div class=\"scanner-modal-body relative h-full\">\r\n    <!--  -->\r\n    <!-- tabs -->\r\n    <div\r\n        class=\"scanner-tabs d-flex justify-around items-center border-b-2 border-gray-200 mb-5 text-gray-900 text-lg\"\r\n    >\r\n        <div\r\n            class=\"scanner-single-tab cursor-pointer w-1/2 text-center py-2 border-gray-900 hover:bg-gray-100\"\r\n            (click)=\"changTabTo('scan')\"\r\n            [ngClass]=\"{ 'font-bold border-b-4': activeTab === 'scan' }\"\r\n        >\r\n            {{\"CREATE.SCAN\" | translate}}\r\n        </div>\r\n        <div\r\n            class=\"scanner-single-tab cursor-pointer w-1/2 text-center py-2 border-gray-900 hover:bg-gray-100\"\r\n            (click)=\"changTabTo('form')\"\r\n            [ngClass]=\"{ 'font-bold border-b-4': activeTab === 'form' }\"\r\n        >\r\n        {{\"CREATE.DETAILS\" | translate}}\r\n        </div>\r\n    </div>\r\n    <div class=\"tabs-body-wrapper\">\r\n        <!-- uploader indicator loading -->\r\n        <div\r\n            class=\"upload-loader mx-2\"\r\n            *ngIf=\"uploadMangmentService.uploadedFilesStatus.uploadInProgress\"\r\n        >\r\n            <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\r\n        </div>\r\n\r\n        <!-- scanner -->\r\n        <div class=\"\" [ngClass]=\"{ 'd-none': activeTab === 'form' }\">\r\n            <app-document-scan\r\n                [hideUploadButton]=\"true\"\r\n                [useStoredFile]=\"true\"\r\n            ></app-document-scan>\r\n        </div>\r\n\r\n        <!-- forms and properties  -->\r\n        <div\r\n            class=\"forms-section\"\r\n            [ngClass]=\"{ 'd-none': activeTab === 'scan' }\"\r\n        >\r\n            <div class=\"w-2/3\">\r\n                <div class=\"mb-5\">\r\n                    <div class=\"label-style\">\r\n                        {{ \"CREATE.FILE_TYPE\" | translate }}\r\n                    </div>\r\n                    <div class=\"text-base text-gray-900\">\r\n                        {{ isArabic ?  fileType.arabicText : fileType.englishText }}\r\n                    </div>\r\n                </div>\r\n                <div class=\"file-fields mt-3\" SetRtl>\r\n                    <form [formGroup]=\"fileForm\" *ngIf=\"fileForm\">\r\n                        <div class=\"single-field mb-3\">\r\n                            <div class=\"label-style\">\r\n                                {{ \"CREATE.TITLE\" | translate\r\n                                }}<span class=\"text-red-500\">*</span>\r\n                            </div>\r\n                            <input\r\n                                class=\"field-style\"\r\n                                formControlName=\"title\"\r\n                                placeholder=\" {{ 'CREATE.TITLE' | translate }}\"\r\n                            />\r\n                        </div>\r\n                        <div class=\"single-field mb-3\">\r\n                            <div class=\"label-style\">\r\n                                {{ \"CREATE.DESCRIPTION\" | translate }}\r\n                            </div>\r\n                            <input\r\n                                class=\"field-style\"\r\n                                formControlName=\"description\"\r\n                                placeholder=\" {{\r\n                                    'CREATE.DESCRIPTION' | translate\r\n                                }}\"\r\n                            />\r\n                        </div>\r\n\r\n                        <!------------------ new statis form  ---------------------------->\r\n                        <div *ngIf=\"usingExtraFields\">\r\n                            \r\n                            <app-dynamic-fields-renderer [form]=\"fileForm\" [agencyNameFilter]=\"agencyNameFilter\" [countryNameFilter]=\"countryNameFilter\"></app-dynamic-fields-renderer>\r\n\r\n                            <!-- <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.DOCUMENT_SUBJECT\" | translate\r\n                                    }}<span class=\"text-red-500\">*</span>\r\n                                </div>\r\n                                <input\r\n                                    class=\"field-style\"\r\n                                    formControlName=\"subject\"\r\n                                    placeholder=\" {{\r\n                                        'CREATE.DOCUMENT_SUBJECT' | translate\r\n                                    }}\"\r\n                                />\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.DOCUMENT_NUMBER\" | translate }}\r\n                                </div>\r\n                                <input\r\n                                    class=\"field-style\"\r\n                                    formControlName=\"documentNumber\"\r\n                                    placeholder=\" {{\r\n                                        'CREATE.DOCUMENT_NUMBER' | translate\r\n                                    }}\"\r\n                                />\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <cts-dynamic-form-hijri-dateitem\r\n                                    formControlName=\"gdocumentDate\"\r\n                                    label=\"CREATE.DOCUMENT_DATE\"\r\n                                >\r\n                                </cts-dynamic-form-hijri-dateitem>\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-dynamic-form-vocabulary-item\r\n                                    [label]=\"'CREATE.SCRECY_LEVEL'\"\r\n                                    [bindLabel]=\"'label'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"false\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    [vocabularyType]=\"'VOC_SecrecyLevel'\"\r\n                                    formControlName=\"secrecyLevel\"\r\n                                >\r\n                                </app-dynamic-form-vocabulary-item>\r\n                            </div>\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-dynamic-form-vocabulary-item\r\n                                    [label]=\"'CREATE.IMPORTANCE_LEVEL'\"\r\n                                    [bindLabel]=\"'label'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"false\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    [vocabularyType]=\"'VOC_Importance'\"\r\n                                    formControlName=\"importanceLevel\"\r\n                                >\r\n                                </app-dynamic-form-vocabulary-item>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.DEPARTMENT_CODE\" | translate }}\r\n                                </div>\r\n                                <app-dynamic-form-department\r\n                                    formControlName=\"departmentCode\"\r\n                                    [placeholder]=\"'please select department'\"\r\n                                    [pp_departmentNestedTree]=\"\r\n                                        'PP_OS_Departments'\r\n                                    \"\r\n                                    [pp_departmentTree]=\"'PP_OS_Departments'\"\r\n                                    [customPrefix]=\"'osdept'\"\r\n                                    [customParentProperty]=\"\r\n                                        'osdepartment_parentDepartmentCode'\r\n                                    \"\r\n                                    [useCustomAddEditAction]=\"true\"\r\n                                >\r\n                                </app-dynamic-form-department>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.AGENCY_CATEGORY_CODE'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"agencyCategoryCode\"\r\n                                    [vocbularyId]=\"'VOC_AgencyCategory'\"\r\n                                    [useFilter]=\"false\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.AGENCY_NAME'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"agencyName\"\r\n                                    [vocbularyId]=\"'VOC_Agency'\"\r\n                                    [filter]=\"agencyNameFilter\"\r\n                                    [useFilter]=\"true\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.COUNTRY_CATEGORY_CODE'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"countryCategoryCode\"\r\n                                    [vocbularyId]=\"'VOC_CountryCategory'\"\r\n                                    [useFilter]=\"false\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <app-translated-vocabulary-select\r\n                                    [label]=\"'CREATE.COUNTRY_NAME'\"\r\n                                    [arbBindLabel]=\"'label_ar'\"\r\n                                    [engBindLabel]=\"'label_en'\"\r\n                                    [bindValue]=\"'id'\"\r\n                                    placeholder=\"{{\r\n                                        'VOCABULARY.SELECT_ITEM' | translate\r\n                                    }}\"\r\n                                    [multiple]=\"false\"\r\n                                    [searchable]=\"true\"\r\n                                    [closeOnSelect]=\"true\"\r\n                                    [hideSelectedItems]=\"false\"\r\n                                    formControlName=\"countryName\"\r\n                                    [vocbularyId]=\"'VOC_Country'\"\r\n                                    [filter]=\"countryNameFilter\"\r\n                                    [useFilter]=\"true\"\r\n                                >\r\n                                </app-translated-vocabulary-select>\r\n                            </div>\r\n\r\n                            <div class=\"single-field mb-3\">\r\n                                <div class=\"label-style\">\r\n                                    {{ \"CREATE.REMARKS\" | translate }}\r\n                                </div>\r\n                                <input\r\n                                    class=\"field-style\"\r\n                                    formControlName=\"remarks\"\r\n                                    placeholder=\" {{\r\n                                        'CREATE.REMARKS' | translate\r\n                                    }}\"\r\n                                />\r\n                            </div> -->\r\n                        </div>\r\n\r\n                        <!-- ----------------------------------------------------------- -->\r\n                    </form>\r\n                    <!-- *ngIf=\"\" -->\r\n                    <div\r\n                        class=\"dynamic-part -mx-4\"\r\n                        *ngIf=\"selectedFile.dynamicForm && showRenderer\"\r\n                    >\r\n                        <app-dynamic-form\r\n                            [form]=\"selectedFile.dynamicForm\"\r\n                            [data]=\"temporaryDyanmicData\"\r\n                            (change)=\"ondynamicFormChange($event)\"\r\n                        ></app-dynamic-form>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <!-- actions and buttons  -->\r\n    <div\r\n        class=\"w-full d-flex justify-between scanner-actions-wrapper absolute bottom-0\"\r\n    >\r\n        <div class=\"flex\">\r\n            <button class=\"cancelation-button\" (click)=\"closeDialog()\">\r\n                {{ \"BUTTONS.CANCEL\" | translate }}\r\n            </button>\r\n            <button class=\"cancelation-button mx-2\" (click)=\"minimizDialog()\">\r\n                {{ \"BUTTONS.MINIMIZED\" | translate }}\r\n            </button>\r\n        </div>\r\n\r\n        <!--  -->\r\n        <div class=\"d-flex\">\r\n            <!-- <button\r\n                *ngIf=\"creationFailed\"\r\n                [disabled]=\"\r\n                    scannerUploadButton.disabled ||\r\n                    !selectedFile.dynamicData.valid ||\r\n                    fileForm.invalid\r\n                \"\r\n                [ngClass]=\"{\r\n                    'opacity-30 cursor-not-allowed':\r\n                        scannerUploadButton.disabled ||\r\n                        !selectedFile.dynamicData.valid ||\r\n                        fileForm.invalid\r\n                }\"\r\n                (click)=\"createDocument()\"\r\n                class=\"submission-button\"\r\n            >\r\n                {{ \"BUTTONS.TRY_AGAIN\" | translate }}\r\n            </button> -->\r\n            <button\r\n                (click)=\"createDocument()\"\r\n                [disabled]=\"\r\n                    scannerUploadButton.disabled ||\r\n                    !selectedFile.dynamicData.valid ||\r\n                    fileForm.invalid\r\n                \"\r\n                [ngClass]=\"{\r\n                    'opacity-30 cursor-not-allowed':\r\n                        scannerUploadButton.disabled ||\r\n                        !selectedFile.dynamicData.valid ||\r\n                        fileForm.invalid\r\n                }\"\r\n                class=\"submission-button\"\r\n            >\r\n                {{ uploadMangmentService.scanCreationFailed ?  (\"BUTTONS.TRY_AGAIN\" | translate) : (\"BUTTONS.CREATE\" | translate) }}\r\n            </button>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".forms-section{display:flex;justify-content:center}.tabs-body-wrapper{height:calc(100% - 125px);overflow-y:auto;overflow-x:hidden}\n"], components: [{ type: i4__namespace$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: ScanComponent, selector: "app-document-scan", inputs: ["useStoredFile", "hideUploadButton"], outputs: ["file"] }, { type: DynamicFieldsRendererComponent, selector: "app-dynamic-fields-renderer", inputs: ["form", "agencyNameFilter", "countryNameFilter", "fields"] }, { type: DynamicFormComponent, selector: "app-dynamic-form", inputs: ["form", "data", "readOnly"], outputs: ["change"] }], directives: [{ type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SetRtlDirective, selector: "[SetRtl]" }, { type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: ScanModalComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -27208,6 +27262,262 @@
                     }]
             }] });
 
+    var ClipboardComponent = /** @class */ (function () {
+        function ClipboardComponent(fileManagerService, userService, customToastrService, userPreferenceService) {
+            this.fileManagerService = fileManagerService;
+            this.userService = userService;
+            this.customToastrService = customToastrService;
+            this.userPreferenceService = userPreferenceService;
+            this.onClipboardClose = new i0.EventEmitter();
+            this.onRefreshFolderTree = new i0.EventEmitter();
+            this.clipboardItems = []; // array of id to items in clipboard
+            this.preventedGroups = [];
+            this.clipboardDocments = []; // array of documents with full details of items in clipboard
+            this.enableCopy = false;
+            this.enableMove = false;
+            this.clipboardLoading = false;
+            this.documentSelectedInClipboard = [];
+        }
+        ClipboardComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this.refreshClipSubscription = this.fileManagerService.onRefreshClipboard.subscribe(function (res) {
+                _this.openClipboard();
+            });
+            this.openClipboard();
+        };
+        ClipboardComponent.prototype.ngOnDestroy = function () {
+            this.refreshClipSubscription ? this.refreshClipSubscription.unsubscribe() : null;
+        };
+        ClipboardComponent.prototype.closeClipboard = function () {
+            this.onClipboardClose.emit();
+            this.clipboardDocments = [];
+        };
+        ClipboardComponent.prototype.openClipboard = function () {
+            var _this = this;
+            this.enableCopy = false;
+            this.enableMove = false;
+            this.clipboardLoading = true;
+            if (this.myCurrecntFolderData.entity.properties['dmsfolder:documentTypeCode'] && this.myCurrecntFolderData.entity.properties['dmsfolder:documentTypeCode'] !== '08112021') {
+                // get accepted childerns for my current folder
+                // if (this.subtypesService.storedSubtypes[this.myCurrecntFolderData.entity.uid]) {
+                //     this.myTargetFolderAcceptedChildrens = this.subtypesService.storedSubtypes[this.myCurrecntFolderData.entity.uid];
+                // } else {
+                this.fileManagerService.getClipboardAcceptedTypes(this.myCurrecntFolderData.entity.uid).subscribe(function (res) {
+                    _this.myTargetFolderAcceptedChildrens = res;
+                }, function (error) {
+                    _this.clipboardLoading = false;
+                    _this.clipboardDocments = [];
+                });
+                // }
+            }
+            if (this.clipboardItems.length > 0) {
+                this.fileManagerService.getClipboardDocuments(this.clipboardItems).subscribe(function (res) {
+                    res.map(function (document) {
+                        document['canCopyToTarget'] = (_this.canPerformActionInsideTarget(document) && _this.checkIfNotTheSameParent(document) && document.canCopy);
+                        document['canMoveToTarget'] = (_this.canPerformActionInsideTarget(document) && _this.checkIfNotTheSameParent(document) && document.canMove);
+                    });
+                    _this.clipboardDocments = res;
+                    console.log(_this.clipboardDocments);
+                    _this.clipboardLoading = false;
+                });
+            }
+            else {
+                this.clipboardDocments = [];
+                this.clipboardLoading = false;
+            }
+        };
+        // prevent copying or moving the file to its same place since it is prevented 
+        // prevent copying or moving the folder inside it self
+        ClipboardComponent.prototype.checkIfNotTheSameParent = function (document) {
+            // let directory = this.getCurrentDirectory();
+            if (document.parentRef !== this.directory.dataItem.id && document.uid !== this.directory.dataItem.id) {
+                return true;
+            }
+            else {
+                return false;
+            }
+        };
+        ClipboardComponent.prototype.deletefromClipboard = function (document) {
+            var myindex = -1;
+            this.clipboardItems.map(function (id, index) {
+                if (document.uid === id) {
+                    myindex = index;
+                }
+            });
+            this.clipboardItems.splice(myindex, 1);
+            this.customToastrService.show('success', 'TOASTER.SUCCESS', "TOASTER.removed_from_clipboard");
+            // let directory = this.getCurrentDirectory();
+            // let id =
+            //     directory.dataItem === undefined
+            //         ? this.mainFolder
+            //         : this.getCurrentFolderId(directory);
+            // this.reinitializeFolderTree(id, directory);
+            this.onRefreshFolderTree.emit();
+            this.openClipboard();
+            this.userPreferenceService.set('clipboardItems', JSON.stringify(this.clipboardItems));
+        };
+        // function to check if i can perform action on that target folder or not 
+        ClipboardComponent.prototype.canPerformActionInsideTarget = function (document) {
+            var _a;
+            //check if target is 'other' type folder or dms folder
+            if (this.myCurrecntFolderData.entity.properties['dmsfolder:documentTypeCode'] === '08112021' && !this.checkIfInPreventedGroups(this.myCurrecntFolderData.entity.path)) {
+                // if my folder is from type others and not in prevented groups
+                return true;
+            }
+            else if (this.myCurrecntFolderData.entity.properties['dmsfolder:documentTypeCode'] && this.myCurrecntFolderData.entity.properties['dmsfolder:documentTypeCode'] !== '08112021') {
+                //if my folder has code and was not other type folder then check for accepted chilrdrn for that folder to contain this file type
+                if (document.isFile === 'File') {
+                    if (this.myTargetFolderAcceptedChildrens.contextParameters &&
+                        this.myTargetFolderAcceptedChildrens.contextParameters.accepted_children && Array.isArray(this.myTargetFolderAcceptedChildrens.contextParameters.accepted_children) &&
+                        this.myTargetFolderAcceptedChildrens.contextParameters.accepted_children.indexOf(document.properties['gdoc:documentTypeCode']) > -1) {
+                        return true;
+                    }
+                    else {
+                        return false;
+                    }
+                }
+                else {
+                    if (this.myTargetFolderAcceptedChildrens.contextParameters &&
+                        this.myTargetFolderAcceptedChildrens.contextParameters.accepted_children && Array.isArray(this.myTargetFolderAcceptedChildrens.contextParameters.accepted_children) &&
+                        ((_a = this.myTargetFolderAcceptedChildrens.contextParameters) === null || _a === void 0 ? void 0 : _a.accepted_children.indexOf(document.properties['dmsfolder:documentTypeCode'])) > -1) {
+                        return true;
+                    }
+                    else {
+                        return false;
+                    }
+                }
+            }
+            else {
+                // prevent action to this target 
+                return false;
+            }
+        };
+        // function to check if this path not belong to group that is prevented from creating folder of type others
+        ClipboardComponent.prototype.checkIfInPreventedGroups = function (path) {
+            // if in prevented froup rturn true else return false
+            console.log(path);
+            var myDepartment = this.userService.getUserDepartmentFromPath(path);
+            var exist = this.preventedGroups.indexOf(myDepartment) > -1 ? true : false;
+            return exist;
+        };
+        ClipboardComponent.prototype.copyFromInsideClipboard = function () {
+            var _this = this;
+            var clipboardSelectedItems = [];
+            var clipboardSelectedItemsLength = 0;
+            // seperate selected items in seperate array 
+            this.clipboardDocments.map(function (doc, index) {
+                // can't copy file in the same place it exist and can't copy folder inside it self 
+                if (doc.isSelected && doc.parentRef !== _this.directory.dataItem.id && doc.uid !== _this.directory.dataItem.id) {
+                    clipboardSelectedItems.push(doc.uid);
+                }
+            });
+            if (clipboardSelectedItems.length > 0) {
+                this.clipboardLoading = true;
+                //    this.currentPath = '';
+                this.fileManagerService
+                    .copyTo({ id: this.directory.dataItem.id, name: this.directory.dataItem.name }, clipboardSelectedItems.toString())
+                    .subscribe(function (res) {
+                    // remove selected items from clipboard after action is done
+                    _this.removeItemsAfterActionDone(clipboardSelectedItems);
+                    _this.clipboardLoading = false;
+                    _this.onClipboardClose.emit();
+                    _this.onRefreshFolderTree.emit();
+                    _this.customToastrService.show('success', 'TOASTER.SUCCESS', 'TOASTER.DOCUMENT_COPIED');
+                }, function (err) {
+                    _this.clipboardLoading = false;
+                    _this.customToastrService.show('error', 'TOASTER.ERROR', 'TOASTER.DOCUMENT_COPIED_ERROR');
+                });
+            }
+            else {
+                this.customToastrService.show('error', 'TOASTER.ERROR', 'TOASTER.DOCUMENT_COPIED_DESTINATION_ERROR');
+            }
+        };
+        ClipboardComponent.prototype.moveFromInsideClipboard = function () {
+            var _this = this;
+            var clipboardSelectedItems = [];
+            var clipboardSelectedItemsLength = 0;
+            // seperate selected items in seperate array 
+            this.clipboardDocments.map(function (doc, index) {
+                // can't move file in the same place it exist and can't move folder inside it self 
+                if (doc.isSelected && doc.parentRef !== _this.directory.dataItem.id && doc.uid !== _this.directory.dataItem.id) {
+                    clipboardSelectedItems.push(doc.uid);
+                }
+            });
+            if (clipboardSelectedItems.length > 0) {
+                this.clipboardLoading = true;
+                this.fileManagerService
+                    .moveTo({ id: this.directory.dataItem.id, name: this.directory.dataItem.name }, clipboardSelectedItems.toString())
+                    .subscribe(function (res) {
+                    // remove selected items from clipboard after action is done
+                    _this.removeItemsAfterActionDone(clipboardSelectedItems);
+                    _this.clipboardLoading = false;
+                    _this.onClipboardClose.emit();
+                    _this.onRefreshFolderTree.emit();
+                    _this.customToastrService.show('success', 'TOASTER.SUCCESS', 'TOASTER.DOCUMENT_MOVED');
+                }, function (err) {
+                    _this.clipboardLoading = false;
+                    _this.customToastrService.show('error', 'TOASTER.ERROR', 'TOASTER.DOCUMENT_MOVED_ERROR');
+                });
+            }
+            else
+                this.customToastrService.show('error', 'TOASTER.ERROR', 'TOASTER.DOCUMENT_MOVED_DESTINATION_ERROR');
+        };
+        ClipboardComponent.prototype.removeItemsAfterActionDone = function (selectedItems) {
+            this.clipboardItems = this.clipboardItems.filter(function (el) {
+                return !selectedItems.includes(el);
+            });
+            this.userPreferenceService.set('clipboardItems', JSON.stringify(this.clipboardItems));
+        };
+        ClipboardComponent.prototype.checking = function () {
+            var _this = this;
+            this.enableCopy = false;
+            this.enableMove = false;
+            this.documentSelectedInClipboard = [];
+            // console.log(this.clipboardDocments);
+            this.clipboardDocments.map(function (document) {
+                // wokring with only selected documents 
+                if (document.isSelected === true) {
+                    // document['canCopyToTarget'] = (this.canPerformActionInsideTarget(document) && document.canCopy);
+                    // document['canMoveToTarget'] = (this.canPerformActionInsideTarget(document) && document.canMove)
+                    _this.documentSelectedInClipboard.push(document);
+                }
+            });
+            if (this.documentSelectedInClipboard.length > 0) {
+                this.enableCopy = this.documentSelectedInClipboard.every(function (item) {
+                    return item.canCopyToTarget === true;
+                });
+                this.enableMove = this.documentSelectedInClipboard.every(function (item) {
+                    return item.canMoveToTarget === true;
+                });
+            }
+            console.log(this.documentSelectedInClipboard);
+        };
+        return ClipboardComponent;
+    }());
+    ClipboardComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: ClipboardComponent, deps: [{ token: FileManagerService }, { token: UserService }, { token: CustomToastrService }, { token: UserPreferencesService$1 }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ClipboardComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: ClipboardComponent, selector: "lib-clipboard", inputs: { clipboardItems: "clipboardItems", myCurrecntFolderData: "myCurrecntFolderData", preventedGroups: "preventedGroups", directory: "directory" }, outputs: { onClipboardClose: "onClipboardClose", onRefreshFolderTree: "onRefreshFolderTree" }, ngImport: i0__namespace, template: "<div class=\"clipboard-side-section relative\">\n\n    <div class=\"p-3 h-full\">\n        <div class=\"clipboard-header flex justify-between items-center border-b-2\">\n            <span class=\"flex text-gray-500 font-bold items-center\">\n                <span class=\"text-4xl bi bi-clipboard\"></span>\n                <span class=\"mx-2 text-xl\">{{'clipboard' | translate}}</span>\n            </span>\n            <mat-icon class=\"close-icon text-gray-500 cursor-pointer\" (click)=\"closeClipboard()\"\n                [matTooltip]=\"'BUTTONS.CLOSE' | translate\">close</mat-icon>\n        </div>\n        <!-- <div class=\"h-full font-bold d-flex justify-center items-center\" *ngIf=\"clipboardLoading\">\n            {{ \"loading\" | translate }}\n        </div> -->\n        <div class=\"w-full h-px bg-gray-200 mb-3\" *ngIf=\"clipboardLoading\">\n            <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n        </div>\n        <div class=\"clipboard-content flex flex-col justify-between items-between\">\n            <div class=\"h-full flex justify-center items-center text-gray-500\"\n                *ngIf=\"clipboardDocments.length === 0\">{{'no_clipboard_items' | translate}}</div>\n\n            <div class=\"px-2 h-5/6 overflow-y-auto\" *ngIf=\"clipboardDocments.length > 0\">\n                <div class=\"border-b-2\" *ngFor=\"let document of clipboardDocments\">\n                    <div class=\"py-1 w-82 flex  items-center justify-between\">\n                        <div class=\"flex items-center w-5/6\">\n                            <mat-checkbox [(ngModel)]=\"document.isSelected\" (change)=\"checking()\"> </mat-checkbox>\n                            <div class=\"flex w-full\">\n                                <!-- <title-with-icon class=\"w-1/6 -my-1.5\" [context]=\"document\"\n                                    [showTitle]=\"false\"></title-with-icon> -->\n                            <app-display-suitable-icon class=\"mx-1\" [data]=\"document\" [size]=\"'40px'\"></app-display-suitable-icon>\n\n                                <!--  -->\n                                <div *ngIf=\"document.isFile === 'File'\"\n                                    class=\"justify-center flex flex-col flex-1 flex-grow-0 w-5/6\">\n                                    <div class=\"text-base text-gray-500 font-bold truncate\"\n                                        [title]=\"document.properties?.['file:content']?.['name']\"\n                                        [alt]=\"document.properties?.['file:content']?.['name']\">\n                                        {{document['title']}}\n                                    </div>\n                                    <div class=\"text-gray-500 text-sm text-nowrap\">\n                                        {{((document.properties?.['file:content']?.['length']) / (1024 *\n                                        1024)).toFixed(2) }}\n                                        MB\n                                    </div>\n                                </div>\n                                <div class=\"\n                                     d-flex\n                                     items-center\n                                     text-base text-gray-500\n                                     font-bold\n                                 \" *ngIf=\"document.isFile === 'Folder'\">\n                                    {{ document?.title }}\n                                </div>\n                            </div>\n                        </div>\n                        <span [matTooltip]=\"'BUTTONS.REMOVE_CLIPBOARD' | translate\"\n                            class=\"cursor-pointer w-5 h-5 rounded-full border-2 flex justify-center items-center border-gray-500 \"\n                            (click)=\"deletefromClipboard(document)\">\n                            <span class=\"text-gray-500 bi bi-x text-lg flex items-center\"></span>\n                        </span>\n                    </div>\n                    <div class=\"text-md text-gray-500 text-center my-2\">\n                        <span *ngIf=\"document.canCopyToTarget && !document.canMoveToTarget\">{{'can_copy_only' |\n                            translate}}</span>\n                        <span *ngIf=\"!document.canCopyToTarget && document.canMoveToTarget\">{{'can_move_only' |\n                            translate}}</span>\n                        <span *ngIf=\"document.canCopyToTarget && document.canMoveToTarget\">{{'can_copy_and_move' |\n                            translate}}</span>\n                        <span\n                            *ngIf=\"!document.canCopyToTarget && !document.canMoveToTarget\">{{'can_not_copy_and_move'\n                            | translate}}</span>\n                    </div>\n                </div>\n\n            </div>\n            <div class=\"h-1/6 flex w-full justify-center items-center\">\n                <button class=\"submission-button mx-2\" [disabled]=\"!enableCopy\"\n                    (click)=\"copyFromInsideClipboard()\">{{'BUTTONS.COPY' | translate}}</button>\n                <button class=\"submission-button mx-2\" [disabled]=\"!enableMove\"\n                    (click)=\"moveFromInsideClipboard()\">{{'BUTTONS.MOVE' | translate}}</button>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"bg-transparent absolute top-0 bottom-0 left-0 right-0 \" *ngIf=\"clipboardLoading\">\n\n    </div>\n</div>", styles: [".clipboard-side-section{width:0px;overflow-x:hidden;height:91vh;background-color:#fff;overflow:hidden;border:1px solid lightgray;z-index:999;transition:.1s ease-in-out;border-bottom:none}.clipboard-side-section .clipboard-header{height:60px}.clipboard-side-section .clipboard-content{height:calc(100% - 60px)}\n"], components: [{ type: i2__namespace$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i7__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: DisplaySuitableIconComponent, selector: "app-display-suitable-icon", inputs: ["data", "size", "dataType", "archive"] }], directives: [{ type: i8__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: ClipboardComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'lib-clipboard',
+                        templateUrl: './clipboard.component.html',
+                        styleUrls: ['./clipboard.component.scss'],
+                        encapsulation: i0.ViewEncapsulation.None
+                    }]
+            }], ctorParameters: function () { return [{ type: FileManagerService }, { type: UserService }, { type: CustomToastrService }, { type: UserPreferencesService$1 }]; }, propDecorators: { onClipboardClose: [{
+                    type: i0.Output
+                }], onRefreshFolderTree: [{
+                    type: i0.Output
+                }], clipboardItems: [{
+                    type: i0.Input
+                }], myCurrecntFolderData: [{
+                    type: i0.Input
+                }], preventedGroups: [{
+                    type: i0.Input
+                }], directory: [{
+                    type: i0.Input
+                }] } });
+
     var FileMangerModule = /** @class */ (function () {
         function FileMangerModule() {
         }
@@ -27230,7 +27540,8 @@
             ScanModalComponent,
             ShareDialogComponent,
             TemplateModalComponent,
-            UpdateModalComponent], imports: [i3.CommonModule,
+            UpdateModalComponent,
+            ClipboardComponent], imports: [i3.CommonModule,
             i2$4.MatIconModule,
             DynamicFormModule,
             i6.FormsModule,
@@ -27268,7 +27579,11 @@
             UserModule,
             MutipleDynamicFormViewerModule,
             i2$1.BrowserTransferStateModule,
-            AttachmentModalModule], exports: [SidepanelComponent,
+            AttachmentModalModule,
+            i6.FormsModule,
+            DisplaySuitableIconModule,
+            i4$2.MatProgressBarModule,
+            i7.MatCheckboxModule], exports: [SidepanelComponent,
             CopyComponent,
             DeleteComponent,
             MoveComponent,
@@ -27292,7 +27607,8 @@
             i3$4.DxTemplateModule,
             i3$4.DxTextBoxModule,
             i3$4.DxFormModule,
-            i3$4.DxTreeViewModule] });
+            i3$4.DxTreeViewModule,
+            ClipboardComponent] });
     FileMangerModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: FileMangerModule, imports: [[
                 i3.CommonModule,
                 i2$4.MatIconModule,
@@ -27332,7 +27648,11 @@
                 UserModule,
                 MutipleDynamicFormViewerModule,
                 i2$1.BrowserTransferStateModule,
-                AttachmentModalModule
+                AttachmentModalModule,
+                i6.FormsModule,
+                DisplaySuitableIconModule,
+                i4$2.MatProgressBarModule,
+                i7.MatCheckboxModule
             ], i3$4.DxPopupModule,
             i3$4.DxScrollViewModule,
             i4$5.DxiToolbarItemModule,
@@ -27361,7 +27681,8 @@
                             ScanModalComponent,
                             ShareDialogComponent,
                             TemplateModalComponent,
-                            UpdateModalComponent
+                            UpdateModalComponent,
+                            ClipboardComponent
                         ],
                         imports: [
                             i3.CommonModule,
@@ -27402,7 +27723,11 @@
                             UserModule,
                             MutipleDynamicFormViewerModule,
                             i2$1.BrowserTransferStateModule,
-                            AttachmentModalModule
+                            AttachmentModalModule,
+                            i6.FormsModule,
+                            DisplaySuitableIconModule,
+                            i4$2.MatProgressBarModule,
+                            i7.MatCheckboxModule
                         ],
                         exports: [
                             SidepanelComponent,
@@ -27429,7 +27754,8 @@
                             i3$4.DxTemplateModule,
                             i3$4.DxTextBoxModule,
                             i3$4.DxFormModule,
-                            i3$4.DxTreeViewModule
+                            i3$4.DxTreeViewModule,
+                            ClipboardComponent
                         ]
                     }]
             }] });
@@ -27471,6 +27797,9 @@
             this.lastFolderTrackId = null;
             this.itemToDisplay = {};
             this.tempSave = null;
+            this.clipboardItems = []; // array of id to items in clipboard
+            this.showClipboard = false;
+            this.showDgdaClipboard = false; // flage related to dgda clipboard
             this.cancelButton = {
                 text: this.isArabic ? 'إلغاء' : 'Cancel',
                 onClick: function () {
@@ -27663,6 +27992,25 @@
                     disableClose: true,
                 });
             };
+            this.addToClipboard = function () {
+                var selectedItemsIds = _this.selectedItems.split(',');
+                var directory = _this.getCurrentDirectory();
+                var id = directory.dataItem === undefined
+                    ? _this.mainFolder
+                    : _this.getCurrentFolderId(directory);
+                if (selectedItemsIds.length === 1 && _this.clipboardItems.length > 0 && _this.clipboardItems.indexOf(selectedItemsIds[0]) > -1) {
+                    _this.customToastrService.show('error', 'TOASTER.ERROR', "TOASTER.item_already_added");
+                }
+                else {
+                    _this.clipboardItems = _.union(_this.clipboardItems, selectedItemsIds);
+                    _this.userPreferenceService.set('clipboardItems', JSON.stringify(_this.clipboardItems));
+                    _this.customToastrService.show('success', 'TOASTER.SUCCESS', "TOASTER.added_to_clipboard");
+                    _this.reinitializeFolderTree(id, directory);
+                    _this.fileManagerService.onRefreshClipboard.emit();
+                    _this.showClipboard = true;
+                    console.log(_this.clipboardItems);
+                }
+            };
             // -------------------------------------------------------------------------------------------------------------------------------------
             this.customizeIcon = function (fileSystemItem) {
                 var _a, _b, _c;
@@ -27774,7 +28122,8 @@
                     URL_ID = null;
                 }
                 if (((URL_ID && URL_ID != 'root' && this.trackedIdPropertyName === 'fileManagerTrackId') ||
-                    (URL_ID && this.trackedIdPropertyName === 'my-filesTrackId'))) {
+                    (URL_ID && this.trackedIdPropertyName === 'my-filesTrackId') ||
+                    (URL_ID && this.trackedIdPropertyName === 'workSpaceFileManagerTrackId'))) {
                     this.tempSave = URL_ID;
                     this.getSelectedFolderTree(URL_ID);
                 }
@@ -28055,6 +28404,8 @@
             // if (this.showDetails) {
             //     this.sideMenuLoading = true;
             // }
+            this.showClipboard = false;
+            this.showDgdaClipboard = false;
             this.myFileMangerInstance = e.component;
             this.currentDirectory = this.getCurrentDirectory();
             var selectedItem = this.fileManager.instance.getSelectedItems();
@@ -28154,6 +28505,8 @@
                 return __generator(this, function (_q) {
                     switch (_q.label) {
                         case 0:
+                            this.showClipboard = false; // close clipboard if navigated to any place
+                            this.showDgdaClipboard = false;
                             this.selectedFolderPath = (_a = e.directory.dataItem) === null || _a === void 0 ? void 0 : _a.entity.path;
                             if (e.directory.dataItem === undefined) {
                                 if (this.mainFolder === 'sharedDocumentsRoot') {
@@ -28185,10 +28538,10 @@
                             // if not coming from shared document then save the id to track it 
                             if (this.mainFolder !== 'sharedDocumentsRoot') {
                                 if ((_c = (_b = e.directory) === null || _b === void 0 ? void 0 : _b.dataItem) === null || _c === void 0 ? void 0 : _c.id) {
-                                    this.userPreferenceService.set("fileManagerTrackId", JSON.stringify((_e = (_d = e.directory) === null || _d === void 0 ? void 0 : _d.dataItem) === null || _e === void 0 ? void 0 : _e.id));
+                                    this.userPreferenceService.set(this.trackedIdPropertyName, JSON.stringify((_e = (_d = e.directory) === null || _d === void 0 ? void 0 : _d.dataItem) === null || _e === void 0 ? void 0 : _e.id));
                                 }
                                 else {
-                                    localStorage.removeItem(this.userPreferenceService.getPropertyKey('fileManagerTrackId'));
+                                    localStorage.removeItem(this.userPreferenceService.getPropertyKey(this.trackedIdPropertyName));
                                 }
                             }
                             this.itemListView = e.component._itemView._itemList;
@@ -28427,7 +28780,8 @@
         };
         FileManagerAbstract.prototype.openSideMenuDetails = function () {
             this.showDetails = true;
-            // this.sideMenuLoading = false;
+            this.showClipboard = false;
+            this.showDgdaClipboard = false;
         };
         FileManagerAbstract.prototype.closeSideMenu = function () {
             this.showDetails = false;
@@ -28735,6 +29089,7 @@
     exports.CardModule = CardModule;
     exports.ChartDataService = ChartDataService;
     exports.ClickOutsideDirective = ClickOutsideDirective;
+    exports.ClipboardComponent = ClipboardComponent;
     exports.CommentsDashletComponent = CommentsDashletComponent;
     exports.CommentsModule = CommentsModule;
     exports.ComponentRegisterService = ComponentRegisterService;