material package refactoring

angular.json

@@ -27,7 +27,9 @@
               "projects/ucap-webmessenger-app/src/favicon.ico",
               "projects/ucap-webmessenger-app/src/assets"
             ],
-            "styles": ["projects/ucap-webmessenger-app/src/styles.scss"],
+            "styles": [
+              "projects/ucap-webmessenger-app/src/styles.scss"
+            ],
             "scripts": [],
             "customWebpackConfig": {
               "path": "./config/angular.webpack.config.js"
@@ -98,7 +100,6 @@
                 }
               ]
             },
-
             "renderer-development": {
               "fileReplacements": [
                 {
@@ -300,7 +301,9 @@
               "projects/ucap-webmessenger-app/src/favicon.ico",
               "projects/ucap-webmessenger-app/src/assets"
             ],
-            "styles": ["projects/ucap-webmessenger-app/src/styles.scss"],
+            "styles": [
+              "projects/ucap-webmessenger-app/src/styles.scss"
+            ],
             "scripts": [],
             "customWebpackConfig": {
               "path": "./config/angular.webpack.config.js"
@@ -315,7 +318,9 @@
               "projects/ucap-webmessenger-app/tsconfig.spec.json",
               "projects/ucap-webmessenger-app/e2e/tsconfig.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         },
         "e2e": {
@@ -332,7 +337,6 @@
         }
       }
     },
-
     "ucap-webmessenger-core": {
       "projectType": "library",
       "root": "projects/ucap-webmessenger-core",
@@ -361,7 +365,9 @@
               "projects/ucap-webmessenger-core/tsconfig.lib.json",
               "projects/ucap-webmessenger-core/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -394,12 +400,13 @@
               "projects/ucap-webmessenger-enviroments/tsconfig.lib.json",
               "projects/ucap-webmessenger-enviroments/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
     },
-
     "ucap-webmessenger-api-common": {
       "projectType": "library",
       "root": "projects/ucap-webmessenger-api-common",
@@ -428,7 +435,9 @@
               "projects/ucap-webmessenger-api-common/tsconfig.lib.json",
               "projects/ucap-webmessenger-api-common/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -461,7 +470,9 @@
               "projects/ucap-webmessenger-api-public/tsconfig.lib.json",
               "projects/ucap-webmessenger-api-public/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -494,7 +505,9 @@
               "projects/ucap-webmessenger-api-external/tsconfig.lib.json",
               "projects/ucap-webmessenger-api-external/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -527,12 +540,13 @@
               "projects/ucap-webmessenger-api-message/tsconfig.lib.json",
               "projects/ucap-webmessenger-api-message/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
     },
-
     "ucap-webmessenger-api": {
       "projectType": "library",
       "root": "projects/ucap-webmessenger-api",
@@ -561,7 +575,9 @@
               "projects/ucap-webmessenger-api/tsconfig.lib.json",
               "projects/ucap-webmessenger-api/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -594,7 +610,9 @@
               "projects/ucap-webmessenger-pi/tsconfig.lib.json",
               "projects/ucap-webmessenger-pi/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -632,7 +650,9 @@
               "projects/ucap-webmessenger-ui/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -670,7 +690,9 @@
               "projects/ucap-webmessenger-ui-account/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-account/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -708,7 +730,9 @@
               "projects/ucap-webmessenger-ui-chat/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-chat/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -746,7 +770,9 @@
               "projects/ucap-webmessenger-ui-room/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-room/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -784,7 +810,9 @@
               "projects/ucap-webmessenger-ui-messenger/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-messenger/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -822,7 +850,9 @@
               "projects/ucap-webmessenger-ui-organization/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-organization/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -860,7 +890,9 @@
               "projects/ucap-webmessenger-ui-profile/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-profile/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -893,12 +925,13 @@
               "projects/ucap-webmessenger-ui-message/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-message/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
     },
-
     "ucap-webmessenger-ui-settings": {
       "projectType": "library",
       "root": "projects/ucap-webmessenger-ui-settings",
@@ -927,7 +960,9 @@
               "projects/ucap-webmessenger-ui-settings/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-settings/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -960,7 +995,9 @@
               "projects/ucap-webmessenger-protocol/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -993,7 +1030,9 @@
               "projects/ucap-webmessenger-protocol-sync/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-sync/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1026,7 +1065,9 @@
               "projects/ucap-webmessenger-protocol-buddy/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-buddy/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1059,7 +1100,9 @@
               "projects/ucap-webmessenger-protocol-group/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-group/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1092,7 +1135,9 @@
               "projects/ucap-webmessenger-protocol-info/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-info/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1125,7 +1170,9 @@
               "projects/ucap-webmessenger-protocol-option/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-option/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1158,7 +1205,9 @@
               "projects/ucap-webmessenger-protocol-query/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-query/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1191,7 +1240,9 @@
               "projects/ucap-webmessenger-protocol-service/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-service/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1224,7 +1275,9 @@
               "projects/ucap-webmessenger-protocol-authentication/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-authentication/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1257,7 +1310,9 @@
               "projects/ucap-webmessenger-protocol-status/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-status/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1290,7 +1345,9 @@
               "projects/ucap-webmessenger-protocol-room/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-room/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1323,7 +1380,9 @@
               "projects/ucap-webmessenger-protocol-event/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-event/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1356,7 +1415,9 @@
               "projects/ucap-webmessenger-protocol-ucti/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-ucti/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1389,7 +1450,9 @@
               "projects/ucap-webmessenger-protocol-fmc/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-fmc/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1422,7 +1485,9 @@
               "projects/ucap-webmessenger-protocol-umg/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-umg/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1455,7 +1520,9 @@
               "projects/ucap-webmessenger-protocol-file/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-file/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1488,7 +1555,9 @@
               "projects/ucap-webmessenger-protocol-ping/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-ping/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1521,7 +1590,9 @@
               "projects/ucap-webmessenger-web-storage/tsconfig.lib.json",
               "projects/ucap-webmessenger-web-storage/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1554,7 +1625,9 @@
               "projects/ucap-webmessenger-web-socket/tsconfig.lib.json",
               "projects/ucap-webmessenger-web-socket/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1587,7 +1660,9 @@
               "projects/ucap-webmessenger-util/tsconfig.lib.json",
               "projects/ucap-webmessenger-util/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1620,7 +1695,9 @@
               "projects/ucap-webmessenger-protocol-inner/tsconfig.lib.json",
               "projects/ucap-webmessenger-protocol-inner/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1653,7 +1730,9 @@
               "projects/ucap-webmessenger-ui-group/tsconfig.lib.json",
               "projects/ucap-webmessenger-ui-group/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1686,7 +1765,9 @@
               "projects/ucap-webmessenger-util-translate/tsconfig.lib.json",
               "projects/ucap-webmessenger-util-translate/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1719,7 +1800,9 @@
               "projects/ucap-webmessenger-native/tsconfig.lib.json",
               "projects/ucap-webmessenger-native/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1752,7 +1835,9 @@
               "projects/ucap-webmessenger-native-electron/tsconfig.lib.json",
               "projects/ucap-webmessenger-native-electron/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1785,7 +1870,9 @@
               "projects/ucap-webmessenger-native-browser/tsconfig.lib.json",
               "projects/ucap-webmessenger-native-browser/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1818,7 +1905,9 @@
               "projects/ucap-webmessenger-daesang/tsconfig.lib.json",
               "projects/ucap-webmessenger-daesang/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
@@ -1851,11 +1940,16 @@
               "projects/ucap-webmessenger-api-prompt/tsconfig.lib.json",
               "projects/ucap-webmessenger-api-prompt/tsconfig.spec.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
     }
   },
-  "defaultProject": "ucap-webmessenger-app"
+  "defaultProject": "ucap-webmessenger-app",
+  "cli": {
+    "analytics": false
+  }
 }

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ucap-webmessenger",
-  "version": "0.0.21",
+  "version": "1.0.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

projects/ucap-webmessenger-app/src/app/app-provider.module.ts

@@ -2,6 +2,11 @@ import { NgModule, APP_INITIALIZER, Type } from '@angular/core';
 
 import { HttpClient } from '@angular/common/http';
 
+import {
+  MatPaginatorModule,
+  MatPaginatorIntl
+} from '@angular/material/paginator';
+
 import { UCAP_NATIVE_SERVICE, NativeService } from '@ucap-webmessenger/native';
 
 import { RESOLVERS } from './resolvers';
@@ -11,7 +16,7 @@ import { AppService } from './services/app.service';
 import { environment } from '../environments/environment';
 import { BrowserNativeService } from '@ucap-webmessenger/native-browser';
 import { ElectronNativeService } from '@ucap-webmessenger/native-electron';
-import { MatPaginatorIntl, MatPaginatorModule } from '@angular/material';
+
 import { PaginatorIntlService } from '@ucap-webmessenger/ui';
 import { TranslateService } from '@ngx-translate/core';
 

projects/ucap-webmessenger-app/src/app/layouts/common/dialogs/file-viewer.dialog.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit, OnDestroy, Inject } from '@angular/core';
 
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { NGXLogger } from 'ngx-logger';
 import { FileEventJson } from '@ucap-webmessenger/protocol-event';
 import { DeviceType } from '@ucap-webmessenger/core';

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-nav.component.ts

@@ -7,7 +7,7 @@ import { Store, select } from '@ngrx/store';
 import * as AppStore from '@app/store';
 import * as MessageStore from '@app/store/messenger/message';
 import * as SettingsStore from '@app/store/messenger/settings';
-import { MatTabChangeEvent } from '@angular/material';
+import { MatTabChangeEvent } from '@angular/material/tabs';
 import { MainMenu } from '@app/types';
 
 @Component({

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/chat.component.ts

@@ -1,4 +1,3 @@
-import { exit } from './../../../../store/messenger/room/actions';
 import {
   Component,
   OnInit,
@@ -32,9 +31,8 @@ import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import { SessionStorageService } from '@ucap-webmessenger/web-storage';
 import { KEY_VER_INFO } from '@app/types';
 import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
-import { MatMenuTrigger } from '@angular/material';
+import { MatMenuTrigger } from '@angular/material/menu';
 import { FormGroup, FormBuilder } from '@angular/forms';
-import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
 import { PerfectScrollbarDirective } from 'ngx-perfect-scrollbar';
 import { TranslateService } from '@ngx-translate/core';
 import { VirtualScrollerComponent } from 'ngx-virtual-scroller';

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts

@@ -1,4 +1,4 @@
-import { MatMenuTrigger } from '@angular/material';
+import { MatMenuTrigger } from '@angular/material/menu';
 import {
   Component,
   OnInit,

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.ts

@@ -35,11 +35,7 @@ import {
 import { MessageStatusCode } from '@ucap-webmessenger/api';
 import { ContentType } from '@ucap-webmessenger/api-message';
 import { FormGroup, FormBuilder } from '@angular/forms';
-import {
+import { MatTabGroup } from '@angular/material/tabs';
-  MatTabGroup,
-  MatSelectChange,
-  MatRadioChange
-} from '@angular/material';
 import {
   MessageDetailDialogComponent,
   MessageDetailDialogResult,
@@ -62,6 +58,8 @@ import {
 import { UserInfo } from '@ucap-webmessenger/protocol-sync';
 import { EmployeeType } from '@ucap-webmessenger/protocol-room';
 import { map } from 'rxjs/operators';
+import { MatSelectChange } from '@angular/material/select';
+import { MatRadioChange } from '@angular/material/radio';
 
 export interface MessageTypeData {
   displayName: string;

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.ts

@@ -26,12 +26,8 @@ import {
   QueryProtocolService,
   DeptSearchType,
   UserInfoSS,
-  DeptUserResponse,
   UserInfoF,
   UserInfoDN,
-  SSVC_TYPE_QUERY_DEPT_USER_DATA,
-  SSVC_TYPE_QUERY_DEPT_USER_RES,
-  DeptUserData,
   AuthResponse
 } from '@ucap-webmessenger/protocol-query';
 import { UserInfo, GroupDetailData } from '@ucap-webmessenger/protocol-sync';
@@ -53,13 +49,12 @@ import {
   KEY_AUTH_INFO,
   MainMenu
 } from '@app/types';
-import { take, map, tap, delay, catchError } from 'rxjs/operators';
+import { take, tap } from 'rxjs/operators';
 import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
 import { Company } from '@ucap-webmessenger/api-external';
 import { PerfectScrollbarDirective } from 'ngx-perfect-scrollbar';
-import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import { MatMenuTrigger } from '@angular/material/menu';
-import { MatMenuTrigger } from '@angular/material';
 import {
   MessageWriteDialogComponent,
   MessageWriteDialogResult,

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts

@@ -79,11 +79,8 @@ import {
 } from '@ucap-webmessenger/ui-chat';
 import { KEY_VER_INFO } from '@app/types';
 import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
-import {
+import { MatMenuTrigger } from '@angular/material/menu';
-  MatMenuTrigger,
+import { MatSnackBarRef, SimpleSnackBar } from '@angular/material/snack-bar';
-  MatSnackBarRef,
-  SimpleSnackBar
-} from '@angular/material';
 import { FileUploadItem, FileDownloadItem } from '@ucap-webmessenger/api';
 import {
   CommonApiService,

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, ViewChild, OnDestroy, Inject } from '@angular/core';
-import { MatPaginator, MatTableDataSource, MatSort } from '@angular/material';
+import { MatPaginator } from '@angular/material/paginator';
 import {
   FileInfo,
   FileDownloadInfo,
@@ -40,6 +40,8 @@ import {
 import { RoomInfo } from '@ucap-webmessenger/protocol-room';
 import { TranslateService } from '@ngx-translate/core';
 import { AppFileService } from '@app/services/file.service';
+import { MatTableDataSource } from '@angular/material/table';
+import { MatSort } from '@angular/material/sort';
 
 export interface FileInfoTotal {
   info: FileInfo;

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.ts

@@ -19,7 +19,7 @@ import {
   RetrieveNoticeRequest
 } from '@ucap-webmessenger/api-message';
 import { NGXLogger } from 'ngx-logger';
-import { MatPaginator } from '@angular/material';
+import { MatPaginator } from '@angular/material/paginator';
 import {
   NoticeDetailDialogComponent,
   NoticeDetailDialogData

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.ts

@@ -40,7 +40,8 @@ import {
   KEY_VER_INFO
 } from '@app/types';
 import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
-import { MatMenuTrigger, MatDialog } from '@angular/material';
+import { MatDialog } from '@angular/material/dialog';
+import { MatMenuTrigger } from '@angular/material/menu';
 import { TranslateService } from '@ngx-translate/core';
 
 @Component({

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/account/change-password.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject, OnDestroy } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
 import { DialogService } from '@ucap-webmessenger/ui';
 

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/account/notice.dialog.component.ts

@@ -5,7 +5,7 @@ import {
   ViewChild,
   ElementRef
 } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
 export interface NoticeDialogData {
   title: string;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/clipboard.dialog.component.ts

@@ -5,7 +5,8 @@ import {
   AfterViewInit,
   ViewChild
 } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA, MatCheckbox } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MatCheckbox } from '@angular/material/checkbox';
 
 export interface ClipboardDialogData {
   content: {

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.ts

@@ -14,11 +14,7 @@ import {
   ValidatorFn,
   AbstractControl
 } from '@angular/forms';
-import {
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
-  MatDialogRef,
-  MAT_DIALOG_DATA,
-  MatTabChangeEvent
-} from '@angular/material';
 import { NGXLogger } from 'ngx-logger';
 import {
   Observable,
@@ -75,6 +71,7 @@ import { TranslateService, TranslateParser } from '@ngx-translate/core';
 import { environment } from '../../../../../environments/environment';
 import { StringUtil } from '@ucap-webmessenger/core';
 import { AppService } from '@app/services/app.service';
+import { MatTabChangeEvent } from '@angular/material/tabs';
 
 export interface CreateChatDialogData {
   type?: string;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/edit-chat-room.dialog.component.ts

@@ -1,7 +1,7 @@
 import { RoomInfo } from '@ucap-webmessenger/protocol-room';
 import { Component, OnInit, Inject, OnDestroy } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { TranslateService } from '@ngx-translate/core';
 import { take } from 'rxjs/operators';
 import { Subscription } from 'rxjs';

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/mass-detail.component.ts

@@ -5,7 +5,7 @@ import {
   ElementRef,
   AfterViewInit
 } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { UCAP_NATIVE_SERVICE, NativeService } from '@ucap-webmessenger/native';
 
 export interface MassDetailDialogData {

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/group/edit-group.dialog.component.ts

@@ -6,7 +6,7 @@ import {
   ValidatorFn,
   AbstractControl
 } from '@angular/forms';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { GroupDetailData } from '@ucap-webmessenger/protocol-sync';
 import { StringUtil } from '@ucap-webmessenger/core';
 import { TranslateService, TranslateParser } from '@ngx-translate/core';

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/group/select-group.dialog.component.ts

@@ -1,10 +1,10 @@
 import { Component, OnInit, Inject, ViewChild } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import {
-  MatDialogRef,
-  MAT_DIALOG_DATA,
   MatSelectionList,
   MatSelectionListChange
-} from '@angular/material';
+} from '@angular/material/list';
+
 import { Observable, combineLatest, Subscription } from 'rxjs';
 import { Store, select } from '@ngrx/store';
 import { map, take } from 'rxjs/operators';

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.ts

@@ -1,11 +1,5 @@
 import { Component, OnInit, Inject, ViewChild } from '@angular/core';
-import {
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
-  MatDialogRef,
-  MAT_DIALOG_DATA,
-  MatSelectionList,
-  MatDrawer,
-  MatListOption
-} from '@angular/material';
 import { map, catchError, take } from 'rxjs/operators';
 
 import {
@@ -44,6 +38,8 @@ import {
 } from './message-write.dialog.component';
 import { EnvironmentsInfo } from '@app/types';
 import { TranslateService } from '@ngx-translate/core';
+import { MatDrawer } from '@angular/material/sidenav';
+import { MatSelectionList, MatListOption } from '@angular/material/list';
 
 export interface MessageDetailDialogData {
   detail: DetailResponse;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-write.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject, ViewChild } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
 import {
   DialogService,

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject, OnDestroy } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { NoticeList } from '@ucap-webmessenger/api-message';
 
 export interface NoticeDetailDialogData {

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/organization/selected-user-list.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { UserInfo } from '@ucap-webmessenger/protocol-sync';
 import {
   UserInfoSS,

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject, ViewChild, OnDestroy } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { KEY_LOGIN_RES_INFO, KEY_VER_INFO, KEY_AUTH_INFO } from '@app/types';
 import { SessionStorageService } from '@ucap-webmessenger/web-storage';
 

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject, OnDestroy, ViewChild } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA, PageEvent } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { KEY_VER_INFO } from '@app/types';
 import { SessionStorageService } from '@ucap-webmessenger/web-storage';
 
@@ -34,6 +34,7 @@ import {
   ProfileDialogData,
   ProfileDialogResult
 } from '../profile/profile.dialog.component';
+import { PageEvent } from '@angular/material/paginator';
 
 export interface IntegratedSearchDialogData {
   keyword: string;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/settings/messenger-settings.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject, Renderer2 } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { KEY_LOGIN_RES_INFO, KEY_VER_INFO } from '@app/types';
 import {
   SessionStorageService,

projects/ucap-webmessenger-app/src/app/layouts/messenger/messenger.layout.module.ts

@@ -9,17 +9,6 @@ import { ScrollingModule } from '@angular/cdk/scrolling';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { OverlayModule } from '@angular/cdk/overlay';
 
-import {
-  MatCheckboxModule,
-  MatTableModule,
-  MatPaginatorModule,
-  MatRippleModule,
-  MatSortModule,
-  MatTooltipModule,
-  MatSidenavModule,
-  MatProgressSpinnerModule
-} from '@angular/material';
-
 import { MatSelectModule } from '@angular/material/select';
 import { MatRadioModule } from '@angular/material/radio';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
@@ -37,6 +26,14 @@ import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { MatListModule } from '@angular/material/list';
 import { MatChipsModule } from '@angular/material/chips';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatTableModule } from '@angular/material/table';
+import { MatSortModule } from '@angular/material/sort';
+import { MatPaginatorModule } from '@angular/material/paginator';
+import { MatRippleModule } from '@angular/material/core';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatSidenavModule } from '@angular/material/sidenav';
 
 import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
 import { VirtualScrollerModule } from 'ngx-virtual-scroller';

projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.ts

@@ -63,7 +63,7 @@ import {
 } from '@app/layouts/messenger/dialogs/profile/profile.dialog.component';
 import { DialogService } from '@ucap-webmessenger/ui';
 import { DOCUMENT } from '@angular/common';
-import { MatMenu, MatRadioChange, MatMenuTrigger } from '@angular/material';
+import { MatMenu, MatMenuTrigger } from '@angular/material/menu';
 import { StatusCode, StatusType, WindowUtil } from '@ucap-webmessenger/core';
 import {
   StatusInfo,
@@ -75,6 +75,7 @@ import {
   IntegratedSearchDialogResult,
   IntegratedSearchDialogData
 } from '@app/layouts/messenger/dialogs/search/integrated-search.dialog.component';
+import { MatRadioChange } from '@angular/material/radio';
 
 const zoomFactors = [60, 70, 85, 100, 120, 145, 170, 200];
 

projects/ucap-webmessenger-app/src/app/layouts/native/native.layout.module.ts

@@ -10,6 +10,8 @@ import { MatMenuModule } from '@angular/material/menu';
 import { MatRadioModule } from '@angular/material/radio';
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatBadgeModule } from '@angular/material/badge';
 
 import { TranslateModule } from '@ngx-translate/core';
 
@@ -17,7 +19,6 @@ import { UCapUiModule } from '@ucap-webmessenger/ui';
 import { UCapUiProfileModule } from '@ucap-webmessenger/ui-profile';
 
 import { COMPONENTS } from './components';
-import { MatTooltipModule, MatBadgeModule } from '@angular/material';
 
 @NgModule({
   imports: [

projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.ts

@@ -34,7 +34,7 @@ import {
   ProfileDialogData,
   ProfileDialogResult
 } from '@app/layouts/messenger/dialogs/profile/profile.dialog.component';
-import { MatDrawer } from '@angular/material';
+
 import { NGXLogger } from 'ngx-logger';
 import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
 import { OpenProfileOptions } from '@ucap-webmessenger/protocol-buddy';
@@ -50,6 +50,7 @@ import { AppUserInfo, KEY_APP_USER_INFO } from '@app/types/app-user-info.type';
 import { environment } from '../../../../environments/environment';
 import { TranslateService } from '@ngx-translate/core';
 import { LeftSideComponent } from '@app/layouts/messenger/components/left-side.component';
+import { MatDrawer } from '@angular/material/sidenav';
 
 @Component({
   selector: 'app-page-messenger-main',

projects/ucap-webmessenger-daesang/src/lib/ucap-daesang.module.ts

@@ -6,7 +6,6 @@ import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule } from '@angular/forms';
 import { FlexLayoutModule } from '@angular/flex-layout';
 
-import { MatRippleModule, MatCheckboxModule } from '@angular/material';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
@@ -20,6 +19,8 @@ import { DaesangCipherService } from './services/daesang-cipher.service';
 import { DaesangProtocolService } from './services/daesang-protocol.service';
 import { DaesangApiService } from './services/daesang-api.service';
 import { UserListItemComponent } from './components/user-list-item.component';
+import { MatRippleModule } from '@angular/material/core';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 
 const COMPONENTS = [UserListItemComponent];
 

projects/ucap-webmessenger-native-electron/src/lib/translate/electron-loader.ts

@@ -3,11 +3,15 @@ import { Observable } from 'rxjs';
 import { NativeService } from '@ucap-webmessenger/native';
 
 export class TranslateLoaderService implements TranslateLoader {
+  textDecoder: TextDecoder;
+
   constructor(
     private nativeService: NativeService,
     private prefix: string = '/assets/i18n/',
     private suffix: string = '.json'
-  ) {}
+  ) {
+    this.textDecoder = new TextDecoder('utf-8');
+  }
 
   /**
    * Gets the translations from the server
@@ -17,7 +21,9 @@ export class TranslateLoaderService implements TranslateLoader {
       this.nativeService
         .readFile(`${this.prefix}${lang}${this.suffix}`)
         .then(buffer => {
-          subscriber.next(JSON.parse(buffer.toString('utf-8')));
+          const s = this.textDecoder.decode(buffer);
+          const t = JSON.parse(s);
+          subscriber.next(t);
         })
         .catch(reason => {
           subscriber.error(reason);

projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts

@@ -4,7 +4,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 import { FlexLayoutModule } from '@angular/flex-layout';
 
-import { MatTooltipModule } from '@angular/material';
+import { MatTooltipModule } from '@angular/material/tooltip';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatIconModule } from '@angular/material/icon';
 import { MatInputModule } from '@angular/material/input';

projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.ts

@@ -15,7 +15,7 @@ import {
 import { ucapAnimations } from '@ucap-webmessenger/ui';
 
 import { GroupDetailData, UserInfo } from '@ucap-webmessenger/protocol-sync';
-import { MatTreeFlattener, MatTree } from '@angular/material';
+import { MatTreeFlattener, MatTree } from '@angular/material/tree';
 import { ExpansionPanelItemDirective } from '../directives/expansion-panel-item.directive';
 import {
   UserInfoSS,

projects/ucap-webmessenger-ui-group/src/lib/ucap-ui-group.module.ts

@@ -6,7 +6,8 @@ import { FlexLayoutModule } from '@angular/flex-layout';
 
 import { ScrollingModule } from '@angular/cdk/scrolling';
 
-import { MatRippleModule, MatCheckboxModule } from '@angular/material';
+import { MatRippleModule } from '@angular/material/core';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatButtonModule } from '@angular/material/button';
 import { MatExpansionModule } from '@angular/material/expansion';
 import { MatIconModule } from '@angular/material/icon';

projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Inject } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
 import { NGXLogger } from 'ngx-logger';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';

projects/ucap-webmessenger-ui-message/src/lib/ucap-ui-message.module.ts

@@ -6,7 +6,7 @@ import { FlexLayoutModule } from '@angular/flex-layout';
 
 import { ScrollingModule } from '@angular/cdk/scrolling';
 
-import { MatRippleModule } from '@angular/material';
+import { MatRippleModule } from '@angular/material/core';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCardModule } from '@angular/material/card';
 import { MatChipsModule } from '@angular/material/chips';

projects/ucap-webmessenger-ui-organization/src/lib/components/tree.component.ts

@@ -9,7 +9,7 @@ import {
   AfterViewInit,
   OnDestroy
 } from '@angular/core';
-import { MatTreeFlattener, MatTree } from '@angular/material';
+import { MatTreeFlattener, MatTree } from '@angular/material/tree';
 import { NGXLogger } from 'ngx-logger';
 
 import { DeptInfo, DeptType } from '@ucap-webmessenger/protocol-query';

projects/ucap-webmessenger-ui-organization/src/lib/ucap-ui-organization.module.ts

@@ -6,7 +6,7 @@ import { FlexLayoutModule } from '@angular/flex-layout';
 
 import { ScrollingModule } from '@angular/cdk/scrolling';
 
-import { MatRippleModule } from '@angular/material';
+import { MatRippleModule } from '@angular/material/core';
 
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';

projects/ucap-webmessenger-ui-profile/src/lib/components/my-profile-widget.component.ts

@@ -2,7 +2,6 @@ import { Component, OnInit, Input, ViewChild } from '@angular/core';
 import { NGXLogger } from 'ngx-logger';
 import { StatusBulkInfo, StatusInfo } from '@ucap-webmessenger/protocol-status';
 import { StatusCode, PresenceType } from '@ucap-webmessenger/core';
-import { MatMenu, MatMenuTrigger } from '@angular/material';
 
 @Component({
   selector: 'ucap-profile-my-profile-widget',

projects/ucap-webmessenger-ui-profile/src/lib/ucap-ui-profile.module.ts

@@ -6,7 +6,6 @@ import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule } from '@angular/forms';
 import { FlexLayoutModule } from '@angular/flex-layout';
 
-import { MatRippleModule, MatCheckboxModule } from '@angular/material';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
@@ -20,6 +19,8 @@ import { UserListItemComponent } from './components/user-list-item.component';
 import { ProfileComponent } from './components/profile.component';
 import { MyProfileWidgetComponent } from './components/my-profile-widget.component';
 import { TranslateModule } from '@ngx-translate/core';
+import { MatRippleModule } from '@angular/material/core';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 
 const COMPONENTS = [
   ListItemComponent,

projects/ucap-webmessenger-ui-room/src/lib/ucap-ui-room.module.ts

@@ -7,12 +7,11 @@ import { FlexLayoutModule } from '@angular/flex-layout';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatIconModule } from '@angular/material/icon';
 import { MatInputModule } from '@angular/material/input';
+import { MatRippleModule } from '@angular/material/core';
+import { MatBadgeModule } from '@angular/material/badge';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+
 import { ListItemComponent } from './components/list-item.component';
-import {
-  MatBadgeModule,
-  MatCheckboxModule,
-  MatRippleModule
-} from '@angular/material';
 
 import { UCapUiModule } from '@ucap-webmessenger/ui';
 import { TranslateModule } from '@ngx-translate/core';

projects/ucap-webmessenger-ui-settings/src/lib/components/chat.component.ts

@@ -10,7 +10,7 @@ import {
   Inject
 } from '@angular/core';
 import { NGXLogger } from 'ngx-logger';
-import { MatSelectChange } from '@angular/material';
+import { MatSelectChange } from '@angular/material/select';
 
 import { EnviromentsService } from '@ucap-webmessenger/enviroments';
 

projects/ucap-webmessenger-ui-settings/src/lib/components/general.component.ts

@@ -12,17 +12,13 @@ import {
 import moment from 'moment';
 import 'moment-timezone';
 
-import {
+import { MatTabChangeEvent, MatTabGroup } from '@angular/material/tabs';
-  MatTabChangeEvent,
-  MatTabGroup,
-  MatCheckboxChange,
-  MatSelectChange
-} from '@angular/material';
 import { GeneralSetting } from '../models/settings';
 import { NGXLogger } from 'ngx-logger';
 import { TranslateService } from '@ngx-translate/core';
-import { take } from 'rxjs/operators';
 import { Subscription, merge } from 'rxjs';
+import { MatCheckboxChange } from '@angular/material/checkbox';
+import { MatSelectChange } from '@angular/material/select';
 
 export interface TimezoneData {
   displayName: string;

projects/ucap-webmessenger-ui-settings/src/lib/components/notification.component.ts

@@ -8,15 +8,14 @@ import {
   OnDestroy
 } from '@angular/core';
 import { NotificationSetting } from '../models/settings';
-import {
+
-  MatRadioChange,
-  MatSelectChange,
-  MatCheckboxChange
-} from '@angular/material';
 import { NGXLogger } from 'ngx-logger';
 import { NotificationMethod } from '@ucap-webmessenger/core';
 import { TranslateService } from '@ngx-translate/core';
 import { Subscription, merge } from 'rxjs';
+import { MatRadioChange } from '@angular/material/radio';
+import { MatSelectChange } from '@angular/material/select';
+import { MatCheckboxChange } from '@angular/material/checkbox';
 
 @Component({
   selector: 'ucap-settings-notification',

projects/ucap-webmessenger-ui/src/lib/components/file-viewer/sound-viewer.component.ts

@@ -9,7 +9,7 @@ import {
 } from '@angular/core';
 import { ucapAnimations } from '../../animations';
 import { FileEventJson } from '@ucap-webmessenger/protocol-event';
-import { MatSlider, MatSliderChange } from '@angular/material';
+import { MatSlider, MatSliderChange } from '@angular/material/slider';
 import { FileDownloadItem } from '@ucap-webmessenger/api';
 
 @Component({

projects/ucap-webmessenger-ui/src/lib/components/file-viewer/video-viewer.component.ts

@@ -8,11 +8,12 @@ import {
   ElementRef,
   ChangeDetectorRef
 } from '@angular/core';
-import { ucapAnimations } from '../../animations';
+import { MatSlider, MatSliderChange } from '@angular/material/slider';
-import { FileEventJson } from '@ucap-webmessenger/protocol-event';
-import { MatSlider, MatSliderChange } from '@angular/material';
-import { FileDownloadItem } from '@ucap-webmessenger/api';
 import { NGXLogger } from 'ngx-logger';
+import { FileEventJson } from '@ucap-webmessenger/protocol-event';
+import { FileDownloadItem } from '@ucap-webmessenger/api';
+
+import { ucapAnimations } from '../../animations';
 
 @Component({
   selector: 'ucap-video-viewer',

projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.ts

@@ -10,7 +10,7 @@ import {
 } from '@angular/core';
 import { ucapAnimations } from '../animations';
 import { UserInfoSS } from '@ucap-webmessenger/protocol-query';
-import { MatPaginator, PageEvent } from '@angular/material';
+import { MatPaginator, PageEvent } from '@angular/material/paginator';
 import {
   StatusBulkInfo,
   WorkStatusType

projects/ucap-webmessenger-ui/src/lib/components/pick-date.component.ts

@@ -8,9 +8,11 @@ import {
   Optional
 } from '@angular/core';
 import { ucapAnimations } from '../animations';
-import { MatCalendar, DateAdapter } from '@angular/material';
+
 import { Subject } from 'rxjs';
 import { TranslateService } from '@ngx-translate/core';
+import { MatCalendar } from '@angular/material/datepicker';
+import { DateAdapter } from '@angular/material/core';
 
 @Component({
   selector: 'ucap-pick-date',

projects/ucap-webmessenger-ui/src/lib/components/split-button.component.ts

@@ -9,7 +9,7 @@ import {
   ElementRef,
   Renderer2
 } from '@angular/core';
-import { MatMenuPanel, MatMenuTrigger, MatButton } from '@angular/material';
+import { MatMenuPanel, MatMenuTrigger } from '@angular/material/menu';
 import { Subscription } from 'rxjs';
 import { NGXLogger } from 'ngx-logger';
 

projects/ucap-webmessenger-ui/src/lib/components/translation-section.component.ts

@@ -1,18 +1,9 @@
 import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
-import {
-  StickerInfo,
-  StickerFilesInfo,
-  StickerUtil,
-  StickerMap
-} from '@ucap-webmessenger/core';
 import { FormGroup, FormBuilder } from '@angular/forms';
-import { MatSlideToggleChange, MatSelectChange } from '@angular/material';
+import { EventType } from '@ucap-webmessenger/protocol-event';
-import {
-  TranslationEventJson,
-  MassTranslationEventJson,
-  EventType
-} from '@ucap-webmessenger/protocol-event';
 import { TranslationSaveResponse } from '@ucap-webmessenger/api-common';
+import { MatSelectChange } from '@angular/material/select';
+import { MatSlideToggleChange } from '@angular/material/slide-toggle';
 
 @Component({
   selector: 'ucap-translation-section',

projects/ucap-webmessenger-ui/src/lib/data-source/virtual-scroll-tree-flat.data-source.ts

@@ -8,7 +8,7 @@ import {
   Subscription
 } from 'rxjs';
 import { map, share } from 'rxjs/operators';
-import { MatTreeFlattener } from '@angular/material';
+import { MatTreeFlattener } from '@angular/material/tree';
 import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
 
 export class VirtualScrollTreeFlatDataSource<T, F> extends DataSource<F> {

projects/ucap-webmessenger-ui/src/lib/dialogs/alert.dialog.component.ts

@@ -5,7 +5,7 @@ import {
   ViewChild,
   ElementRef
 } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
 export interface AlertDialogData {
   title: string;

projects/ucap-webmessenger-ui/src/lib/dialogs/confirm.dialog.component.ts

@@ -5,7 +5,7 @@ import {
   ViewChild,
   ElementRef
 } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
 export interface ConfirmDialogData {
   title: string;

projects/ucap-webmessenger-ui/src/lib/services/bottom-sheet.service.ts

@@ -1,7 +1,10 @@
 import { Injectable } from '@angular/core';
 import { ComponentType } from '@angular/cdk/portal';
 
-import { MatBottomSheet, MatBottomSheetConfig } from '@angular/material';
+import {
+  MatBottomSheet,
+  MatBottomSheetConfig
+} from '@angular/material/bottom-sheet';
 
 import { of } from 'rxjs';
 import { take, map, catchError } from 'rxjs/operators';

projects/ucap-webmessenger-ui/src/lib/services/dialog.service.ts

@@ -1,6 +1,6 @@
 import { TemplateRef, Injectable } from '@angular/core';
 import { ComponentType } from '@angular/cdk/portal';
-import { MatDialog, MatDialogConfig } from '@angular/material';
+import { MatDialog, MatDialogConfig } from '@angular/material/dialog';
 
 import { of } from 'rxjs';
 import { take, map, catchError } from 'rxjs/operators';

projects/ucap-webmessenger-ui/src/lib/services/paginator-intl.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 
-import { MatPaginatorIntl } from '@angular/material';
+import { MatPaginatorIntl } from '@angular/material/paginator';
 import { TranslateService } from '@ngx-translate/core';
 
 const KEY_ITEMS_PER_PAGE = 'common.paginator.itemsPerPage';

projects/ucap-webmessenger-ui/src/lib/services/snack-bar.service.ts

@@ -5,7 +5,7 @@ import {
   MatSnackBarConfig,
   MatSnackBarRef,
   SimpleSnackBar
-} from '@angular/material';
+} from '@angular/material/snack-bar';
 import { ComponentType } from '@angular/cdk/portal';
 
 @Injectable({

projects/ucap-webmessenger-ui/src/lib/snackbars/alert.snackbar.component.ts

@@ -6,11 +6,9 @@ import {
   ElementRef
 } from '@angular/core';
 import {
-  MatDialogRef,
-  MAT_DIALOG_DATA,
   MAT_SNACK_BAR_DATA,
   MatSnackBarRef
-} from '@angular/material';
+} from '@angular/material/snack-bar';
 
 export interface AlertSnackbarData {
   html: string;

projects/ucap-webmessenger-ui/src/lib/ucap-ui.module.ts

@@ -19,13 +19,11 @@ import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatButtonToggleModule } from '@angular/material/button-toggle';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatDatepickerModule } from '@angular/material/datepicker';
-import {
+import { MatTabsModule } from '@angular/material/tabs';
-  MatTabsModule,
+import { MatSelectModule } from '@angular/material/select';
-  MatSelectModule,
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-  MatSlideToggleModule,
+import { MatTableModule } from '@angular/material/table';
-  MatTableModule,
+import { MatPaginatorModule } from '@angular/material/paginator';
-  MatPaginatorModule
-} from '@angular/material';
 
 import { DragDropModule } from '@angular/cdk/drag-drop';