optimise breakpoint observer

projects/aca-content/src/lib/components/favorite-libraries/favorite-libraries.component.ts

@@ -22,7 +22,6 @@
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
 import { SiteEntry, FavoritePaging, Pagination } from '@alfresco/js-api';
 import { AppHookService, ContentApiService, PageComponent } from '@alfresco/aca-shared';
@@ -41,13 +40,11 @@ export class FavoriteLibrariesComponent extends PageComponent implements OnInit
   });
   isLoading = false;
   list: FavoritePaging;
-  isSmallScreen = false;
   columns: DocumentListPresetRef[] = [];
 
   constructor(
     private appHookService: AppHookService,
     private contentApiService: ContentApiService,
-    private breakpointObserver: BreakpointObserver,
     private preferences: UserPreferencesService,
     private changeDetectorRef: ChangeDetectorRef
   ) {
@@ -64,11 +61,7 @@ export class FavoriteLibrariesComponent extends PageComponent implements OnInit
       this.appHookService.libraryUpdated.subscribe(() => this.reloadList()),
       this.appHookService.libraryJoined.subscribe(() => this.reloadList()),
       this.appHookService.libraryLeft.subscribe(() => this.reloadList()),
-      this.appHookService.favoriteLibraryToggle.subscribe(() => this.reloadList()),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
+      this.appHookService.favoriteLibraryToggle.subscribe(() => this.reloadList())
     ]);
     this.columns = this.extensions.documentListPresets.favoriteLibraries || [];
   }

projects/aca-content/src/lib/components/favorites/favorites.component.ts

@@ -25,7 +25,6 @@
 import { ContentApiService, PageComponent } from '@alfresco/aca-shared';
 import { UploadService } from '@alfresco/adf-content-services';
 import { MinimalNodeEntity, MinimalNodeEntryEntity, PathElementEntity, PathInfo } from '@alfresco/js-api';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { debounceTime, map } from 'rxjs/operators';
@@ -35,16 +34,9 @@ import { DocumentListPresetRef } from '@alfresco/adf-extensions';
   templateUrl: './favorites.component.html'
 })
 export class FavoritesComponent extends PageComponent implements OnInit {
-  isSmallScreen = false;
-
   columns: DocumentListPresetRef[] = [];
 
-  constructor(
-    private router: Router,
-    private contentApi: ContentApiService,
-    private uploadService: UploadService,
-    private breakpointObserver: BreakpointObserver
-  ) {
+  constructor(private router: Router, private contentApi: ContentApiService, private uploadService: UploadService) {
     super();
   }
 
@@ -52,12 +44,8 @@ export class FavoritesComponent extends PageComponent implements OnInit {
     super.ngOnInit();
 
     this.subscriptions = this.subscriptions.concat([
-      this.uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe((_) => this.reload()),
-      this.uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe((_) => this.reload()),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
+      this.uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe(() => this.reload()),
+      this.uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe(() => this.reload())
     ]);
 
     this.columns = this.extensions.documentListPresets.favorites;

projects/aca-content/src/lib/components/files/files.component.ts

@@ -29,7 +29,6 @@ import { MinimalNodeEntity, MinimalNodeEntryEntity, PathElement, PathElementEnti
 import { NodeActionsService } from '../../services/node-actions.service';
 import { ContentApiService, PageComponent } from '@alfresco/aca-shared';
 import { SetCurrentFolderAction, isAdmin, UploadFileVersionAction, showLoaderSelector } from '@alfresco/aca-shared/store';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { debounceTime, takeUntil } from 'rxjs/operators';
 import { FilterSearch, ShareDataRow, UploadService, FileUploadEvent } from '@alfresco/adf-content-services';
 import { DocumentListPresetRef } from '@alfresco/adf-extensions';
@@ -40,7 +39,6 @@ import { Observable } from 'rxjs';
 })
 export class FilesComponent extends PageComponent implements OnInit, OnDestroy {
   isValidPath = true;
-  isSmallScreen = false;
   isAdmin = false;
   selectedNode: MinimalNodeEntity;
   queryParams = null;
@@ -55,8 +53,7 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy {
     private route: ActivatedRoute,
     private contentApi: ContentApiService,
     private nodeActionsService: NodeActionsService,
-    private uploadService: UploadService,
-    private breakpointObserver: BreakpointObserver
+    private uploadService: UploadService
   ) {
     super();
   }
@@ -96,11 +93,7 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy {
     this.subscriptions = this.subscriptions.concat([
       nodeActionsService.contentCopied.subscribe((nodes) => this.onContentCopied(nodes)),
       uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe((file) => this.onFileUploadedEvent(file)),
-      uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe((file) => this.onFileUploadedEvent(file)),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
+      uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe((file) => this.onFileUploadedEvent(file))
     ]);
 
     this.store

projects/aca-content/src/lib/components/libraries/libraries.component.ts

@@ -24,7 +24,6 @@
 
 import { NavigateLibraryAction } from '@alfresco/aca-shared/store';
 import { SiteEntry } from '@alfresco/js-api';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { Component, OnInit } from '@angular/core';
 import { AppHookService, PageComponent } from '@alfresco/aca-shared';
 import { DocumentListPresetRef } from '@alfresco/adf-extensions';
@@ -33,11 +32,9 @@ import { DocumentListPresetRef } from '@alfresco/adf-extensions';
   templateUrl: './libraries.component.html'
 })
 export class LibrariesComponent extends PageComponent implements OnInit {
-  isSmallScreen = false;
-
   columns: DocumentListPresetRef[] = [];
 
-  constructor(private appHookService: AppHookService, private breakpointObserver: BreakpointObserver) {
+  constructor(private appHookService: AppHookService) {
     super();
   }
 
@@ -47,11 +44,7 @@ export class LibrariesComponent extends PageComponent implements OnInit {
     this.subscriptions.push(
       this.appHookService.libraryDeleted.subscribe(() => this.reload()),
       this.appHookService.libraryUpdated.subscribe(() => this.reload()),
-      this.appHookService.libraryLeft.subscribe(() => this.reload()),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
+      this.appHookService.libraryLeft.subscribe(() => this.reload())
     );
 
     this.columns = this.extensions.documentListPresets.libraries || [];

projects/aca-content/src/lib/components/recent-files/recent-files.component.ts

@@ -23,7 +23,6 @@
  */
 
 import { Component, OnInit } from '@angular/core';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { MinimalNodeEntity } from '@alfresco/js-api';
 import { UploadService } from '@alfresco/adf-content-services';
 import { debounceTime } from 'rxjs/operators';
@@ -35,11 +34,9 @@ import { DocumentListPresetRef } from '@alfresco/adf-extensions';
   templateUrl: './recent-files.component.html'
 })
 export class RecentFilesComponent extends PageComponent implements OnInit {
-  isSmallScreen = false;
-
   columns: DocumentListPresetRef[] = [];
 
-  constructor(private uploadService: UploadService, private breakpointObserver: BreakpointObserver, private router: Router) {
+  constructor(private uploadService: UploadService, private router: Router) {
     super();
   }
 
@@ -48,11 +45,7 @@ export class RecentFilesComponent extends PageComponent implements OnInit {
 
     this.subscriptions = this.subscriptions.concat([
       this.uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe(() => this.onFileUploadedEvent()),
-      this.uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe(() => this.onFileUploadedEvent()),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
+      this.uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe(() => this.onFileUploadedEvent())
     ]);
 
     this.columns = this.extensions.documentListPresets.recent || [];

projects/aca-content/src/lib/components/search/search-libraries-results/search-libraries-results.component.ts

@@ -24,7 +24,6 @@
 
 import { NavigateLibraryAction } from '@alfresco/aca-shared/store';
 import { NodePaging, Pagination, SiteEntry } from '@alfresco/js-api';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';
 import { SearchLibrariesQueryBuilderService } from './search-libraries-query-builder.service';
@@ -37,7 +36,6 @@ import { DocumentListPresetRef } from '@alfresco/adf-extensions';
   styleUrls: ['./search-libraries-results.component.scss']
 })
 export class SearchLibrariesResultsComponent extends PageComponent implements OnInit {
-  isSmallScreen = false;
   searchedWord: string;
   queryParamName = 'q';
   data: NodePaging;
@@ -46,7 +44,6 @@ export class SearchLibrariesResultsComponent extends PageComponent implements On
   columns: DocumentListPresetRef[] = [];
 
   constructor(
-    private breakpointObserver: BreakpointObserver,
     private librariesQueryBuilder: SearchLibrariesQueryBuilderService,
     private route: ActivatedRoute,
     private appHookService: AppHookService,
@@ -91,10 +88,6 @@ export class SearchLibrariesResultsComponent extends PageComponent implements On
             this.appHookService.library400Error.next();
           }
         } catch (e) {}
-      }),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
       })
     );
 

projects/aca-content/src/lib/components/search/search-results/search-results.component.ts

@@ -40,7 +40,6 @@ import { combineLatest, Observable } from 'rxjs';
 import { PageComponent } from '@alfresco/aca-shared';
 import { SearchSortingDefinition } from '@alfresco/adf-content-services/lib/search/models/search-sorting-definition.interface';
 import { takeUntil } from 'rxjs/operators';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 
 @Component({
   selector: 'aca-search-results',
@@ -57,14 +56,12 @@ export class SearchResultsComponent extends PageComponent implements OnInit {
   data: ResultSetPaging;
   sorting = ['name', 'asc'];
   isLoading = false;
-  isSmallScreen = false;
 
   constructor(
     private queryBuilder: SearchQueryBuilderService,
     private route: ActivatedRoute,
     private translationService: TranslationService,
-    private router: Router,
-    private breakpointObserver: BreakpointObserver
+    private router: Router
   ) {
     super();
 
@@ -85,13 +82,6 @@ export class SearchResultsComponent extends PageComponent implements OnInit {
           this.queryBuilder.userQuery = decodeURIComponent(query);
         }
       });
-
-    this.breakpointObserver
-      .observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape])
-      .pipe(takeUntil(this.onDestroy$))
-      .subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      });
   }
 
   ngOnInit() {

projects/aca-content/src/lib/components/shared-files/shared-files.component.ts

@@ -23,7 +23,6 @@
  */
 
 import { Component, OnInit } from '@angular/core';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { debounceTime } from 'rxjs/operators';
 import { UploadService } from '@alfresco/adf-content-services';
 import { Router } from '@angular/router';
@@ -34,16 +33,9 @@ import { DocumentListPresetRef } from '@alfresco/adf-extensions';
   templateUrl: './shared-files.component.html'
 })
 export class SharedFilesComponent extends PageComponent implements OnInit {
-  isSmallScreen = false;
-
   columns: DocumentListPresetRef[] = [];
 
-  constructor(
-    private appHookService: AppHookService,
-    private uploadService: UploadService,
-    private breakpointObserver: BreakpointObserver,
-    private router: Router
-  ) {
+  constructor(private appHookService: AppHookService, private uploadService: UploadService, private router: Router) {
     super();
   }
 
@@ -52,13 +44,8 @@ export class SharedFilesComponent extends PageComponent implements OnInit {
 
     this.subscriptions = this.subscriptions.concat([
       this.appHookService.linksUnshared.pipe(debounceTime(300)).subscribe(() => this.reload()),
-
-      this.uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe((_) => this.reload()),
-      this.uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe((_) => this.reload()),
-
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
+      this.uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe(() => this.reload()),
+      this.uploadService.fileUploadDeleted.pipe(debounceTime(300)).subscribe(() => this.reload())
     ]);
 
     this.columns = this.extensions.documentListPresets.shared || [];

projects/aca-content/src/lib/components/trashcan/trashcan.component.ts

@@ -23,35 +23,19 @@
  */
 
 import { getUserProfile } from '@alfresco/aca-shared/store';
-import { DocumentListPresetRef, ProfileState } from '@alfresco/adf-extensions';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
+import { DocumentListPresetRef } from '@alfresco/adf-extensions';
 import { Component, OnInit } from '@angular/core';
-import { Observable } from 'rxjs';
 import { PageComponent } from '@alfresco/aca-shared';
 
 @Component({
   templateUrl: './trashcan.component.html'
 })
 export class TrashcanComponent extends PageComponent implements OnInit {
-  isSmallScreen = false;
-  user$: Observable<ProfileState>;
-
+  user$ = this.store.select(getUserProfile);
   columns: DocumentListPresetRef[] = [];
 
-  constructor(private breakpointObserver: BreakpointObserver) {
-    super();
-    this.user$ = this.store.select(getUserProfile);
-  }
-
   ngOnInit() {
     super.ngOnInit();
-
-    this.subscriptions.push(
-      this.breakpointObserver.observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape]).subscribe((result) => {
-        this.isSmallScreen = result.matches;
-      })
-    );
-
     this.columns = this.extensions.documentListPresets.trashcan || [];
   }
 }

projects/aca-shared/src/lib/components/document-base-page/document-base-page.component.ts

@@ -46,6 +46,7 @@ import {
 import { AppExtensionService } from '../../services/app.extension.service';
 import { isLibrary, isLocked } from '../../utils/node.utils';
 import { AcaFileAutoDownloadService } from '../../services/aca-file-auto-download.service';
+import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 
 /* eslint-disable @angular-eslint/directive-class-suffix */
 @Directive()
@@ -69,10 +70,12 @@ export abstract class PageComponent implements OnInit, OnDestroy, OnChanges {
   showHeader = ShowHeaderMode.Data;
   filterSorting = 'name-asc';
   createActions: Array<ContentActionRef> = [];
+  isSmallScreen = false;
 
   protected extensions = inject(AppExtensionService);
   protected content = inject(DocumentBasePageService);
   protected store = inject<Store<AppStore>>(Store<AppStore>);
+  protected breakpointObserver = inject(BreakpointObserver);
   private fileAutoDownloadService = inject(AcaFileAutoDownloadService, { optional: true });
 
   protected subscriptions: Subscription[] = [];
@@ -118,6 +121,13 @@ export abstract class PageComponent implements OnInit, OnDestroy, OnChanges {
       .subscribe((node) => {
         this.canUpload = node && this.content.canUploadContent(node);
       });
+
+    this.breakpointObserver
+      .observe([Breakpoints.HandsetPortrait, Breakpoints.HandsetLandscape])
+      .pipe(takeUntil(this.onDestroy$))
+      .subscribe((result) => {
+        this.isSmallScreen = result.matches;
+      });
   }
 
   ngOnChanges(changes: SimpleChanges) {