Chunk splittable facets #10557

Facets are now split into several independent lists, so each list of facets may be split into a different chunk during production builds. Thus reducing the Initial Total metric. This also is strongly typed, so non-existing facets lead to compile time error. Thanks to this, we found cases where facets incorrectly disappeared during a refactoring of facet names. That means that facet lists must be called in the component constructor (injection context). In the rare cases where a facet list is used later than the constructor, then it should be declared as a field and initialized in the constructor.
Ecodev · Oct 8, 2024 · a59edbb · a59edbb
1 parent cd39a7a
commit a59edbb
Show file tree

Hide file tree

Showing 11 changed files with 641 additions and 614 deletions.
diff --git a/client/app/admin/accounts/accounts/accounts.component.ts b/client/app/admin/accounts/accounts/accounts.component.ts
@@ -12,7 +12,7 @@ import {
 } from '@ecodev/natural';
 import {CommonModule, DatePipe} from '@angular/common';
 import {AccountType, CurrentUserForProfile} from '../../../shared/generated-types';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {accounts} from '../../../shared/natural-search/natural-search-facets.service';
 import {AccountService} from '../services/account.service';
 import {PermissionsService} from '../../../shared/services/permissions.service';
 import {TransactionLineService} from '../../transactions/services/transactionLine.service';
@@ -114,13 +114,12 @@ export class AccountsComponent extends NaturalAbstractNavigableList<AccountServi
     };
 
     public constructor() {
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
         const accountService = inject(AccountService);
 
         super(accountService);
         this.accountService = accountService;
 
-        this.naturalSearchFacets = naturalSearchFacetsService.get('accounts');
+        this.naturalSearchFacets = accounts();
     }
 
     public addLink(): any[] {

diff --git a/client/app/admin/bookables/bookables/bookables.component.ts b/client/app/admin/bookables/bookables/bookables.component.ts
@@ -1,5 +1,5 @@
-import {Component, EventEmitter, OnInit, Output, inject} from '@angular/core';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {Component, EventEmitter, inject, OnInit, Output} from '@angular/core';
+import {bookables, equipment} from '../../../shared/natural-search/natural-search-facets.service';
 import {Bookables} from '../../../shared/generated-types';
 import {BookableService} from '../services/bookable.service';
 import {PermissionsService} from '../../../shared/services/permissions.service';
@@ -56,15 +56,12 @@ export class BookablesComponent extends ParentComponent<BookableService> impleme
 
     public constructor() {
         const bookableService = inject(BookableService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
         const dialog = inject(MatDialog);
         const snackbar = inject(MatSnackBar);
         const bookingService = inject(BookingService);
 
         super(bookableService, dialog, snackbar, bookingService);
-        this.naturalSearchFacets = naturalSearchFacetsService.get(
-            this.route.snapshot.data.isEquipment ? 'equipment' : 'bookables',
-        );
+        this.naturalSearchFacets = this.route.snapshot.data.isEquipment ? equipment() : bookables();
     }
 
     public select(element: Bookables['bookables']['items'][0]): void {

diff --git a/client/app/admin/bookables/bookables/usage-bookables.component.ts b/client/app/admin/bookables/bookables/usage-bookables.component.ts
@@ -1,5 +1,4 @@
-import {Component, EventEmitter, Input, OnInit, Output, inject} from '@angular/core';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {Component, EventEmitter, inject, Input, OnInit, Output} from '@angular/core';
 import {PermissionsService} from '../../../shared/services/permissions.service';
 import {UsageBookableService} from '../services/usage-bookable.service';
 import {
@@ -29,6 +28,7 @@ import {MatTableModule} from '@angular/material/table';
 import {MatDialog} from '@angular/material/dialog';
 import {MatSnackBar} from '@angular/material/snack-bar';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
+import {admin_approved, bookables, storage} from '../../../shared/natural-search/natural-search-facets.service';
 
 @Component({
     selector: 'app-usage-bookables',
@@ -73,17 +73,24 @@ export class UsageBookablesComponent extends ParentComponent<UsageBookableServic
 
     public constructor() {
         const usageBookableService = inject(UsageBookableService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
         const dialog = inject(MatDialog);
         const snackbar = inject(MatSnackBar);
         const bookingService = inject(BookingService);
 
         super(usageBookableService, dialog, snackbar, bookingService);
 
         if (this.route.snapshot.data.isAdmin) {
-            this.naturalSearchFacets = naturalSearchFacetsService.get(
-                this.route.snapshot.data.facetsKey ?? 'bookables',
-            );
+            let facets = bookables();
+            switch (this.route.snapshot.data.facetsKey) {
+                case 'storage':
+                    facets = storage();
+                    break;
+                case 'admin_approved':
+                    facets = admin_approved();
+                    break;
+            }
+
+            this.naturalSearchFacets = facets;
         }
     }
 

diff --git a/client/app/admin/bookings/bookings/bookings-with-owner.component.ts b/client/app/admin/bookings/bookings/bookings-with-owner.component.ts
@@ -1,5 +1,5 @@
 import {Component, inject} from '@angular/core';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {bookingsForBookable} from '../../../shared/natural-search/natural-search-facets.service';
 import {PermissionsService} from '../../../shared/services/permissions.service';
 import {BookingWithOwnerService} from '../services/booking-with-owner.service';
 import {AbstractBookings} from './abstract-bookings';
@@ -70,9 +70,8 @@ export class BookingsWithOwnerComponent extends AbstractBookings<BookingWithOwne
 
     public constructor() {
         const bookingWithOwnerService = inject(BookingWithOwnerService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(bookingWithOwnerService);
-        this.naturalSearchFacets = naturalSearchFacetsService.get('bookingsForBookable');
+        this.naturalSearchFacets = bookingsForBookable();
     }
 }
diff --git a/client/app/admin/bookings/bookings/bookings.component.ts b/client/app/admin/bookings/bookings/bookings.component.ts
@@ -1,6 +1,6 @@
 import {Component, inject} from '@angular/core';
 import {BookingService} from '../services/booking.service';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {bookings, bookingsAdvanced} from '../../../shared/natural-search/natural-search-facets.service';
 import {PermissionsService} from '../../../shared/services/permissions.service';
 import {AbstractBookings} from './abstract-bookings';
 import {RouterLink} from '@angular/router';
@@ -60,11 +60,8 @@ export class BookingsComponent extends AbstractBookings<BookingService> {
 
     public constructor() {
         const bookingService = inject(BookingService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(bookingService);
-        this.naturalSearchFacets = naturalSearchFacetsService.get(
-            this.route.snapshot.data.advancedFacets ? 'bookingsAdvanced' : 'bookings',
-        );
+        this.naturalSearchFacets = this.route.snapshot.data.advancedFacets ? bookingsAdvanced() : bookings();
     }
 }
diff --git a/client/app/admin/expenseClaim/expenseClaims/expenseClaims.component.ts b/client/app/admin/expenseClaim/expenseClaims/expenseClaims.component.ts
@@ -11,7 +11,7 @@ import {
     NaturalTableButtonComponent,
 } from '@ecodev/natural';
 import {CommonModule, DatePipe} from '@angular/common';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {expenseClaims} from '../../../shared/natural-search/natural-search-facets.service';
 import {ExpenseClaimService} from '../services/expenseClaim.service';
 import {PermissionsService} from '../../../shared/services/permissions.service';
 import {RouterLink} from '@angular/router';
@@ -67,10 +67,9 @@ export class ExpenseClaimsComponent extends NaturalAbstractList<ExpenseClaimServ
 
     public constructor() {
         const expenseClaimService = inject(ExpenseClaimService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(expenseClaimService);
 
-        this.naturalSearchFacets = naturalSearchFacetsService.get('expenseClaims');
+        this.naturalSearchFacets = expenseClaims();
     }
 }
diff --git a/client/app/admin/logs/logs/logs.component.ts b/client/app/admin/logs/logs/logs.component.ts
@@ -8,7 +8,7 @@ import {
 } from '@ecodev/natural';
 import {CurrentUserForProfile, LogSortingField, UserRole} from '../../../shared/generated-types';
 import {LogService} from '../services/log.service';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {logs} from '../../../shared/natural-search/natural-search-facets.service';
 import {MatPaginatorModule} from '@angular/material/paginator';
 import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
 import {MatTooltipModule} from '@angular/material/tooltip';
@@ -36,11 +36,10 @@ import {CommonModule} from '@angular/common';
 export class LogsComponent extends NaturalAbstractList<LogService> implements OnInit {
     public constructor() {
         const logService = inject(LogService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(logService);
 
-        this.naturalSearchFacets = naturalSearchFacetsService.get('logs');
+        this.naturalSearchFacets = logs();
         this.forcedVariables = {
             sorting: [{field: LogSortingField.creationDate, order: SortingOrder.DESC}],
         };

diff --git a/client/app/admin/transactions/transactionLines/transactionLines.component.ts b/client/app/admin/transactions/transactionLines/transactionLines.component.ts
@@ -11,7 +11,7 @@ import {
     NaturalTableButtonComponent,
 } from '@ecodev/natural';
 import {AsyncPipe, DatePipe} from '@angular/common';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {transactionLines} from '../../../shared/natural-search/natural-search-facets.service';
 import {TransactionLineService} from '../services/transactionLine.service';
 import {
     ExportTransactionLinesVariables,
@@ -84,12 +84,11 @@ export class TransactionLinesComponent extends NaturalAbstractList<TransactionLi
 
     public constructor() {
         const transactionLineService = inject(TransactionLineService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(transactionLineService);
         this.transactionLineService = transactionLineService;
 
-        this.naturalSearchFacets = naturalSearchFacetsService.get('transactionLines');
+        this.naturalSearchFacets = transactionLines();
     }
 
     public download(): void {

diff --git a/client/app/admin/users/users/users.component.ts b/client/app/admin/users/users/users.component.ts
@@ -14,7 +14,7 @@ import {
 } from '@ecodev/natural';
 import {CommonModule, DatePipe} from '@angular/common';
 import {BankingInfosVariables, EmailAndPhoneUsersVariables, Users, UserStatus} from '../../../shared/generated-types';
-import {NaturalSearchFacetsService} from '../../../shared/natural-search/natural-search-facets.service';
+import {users} from '../../../shared/natural-search/natural-search-facets.service';
 import {PermissionsService} from '../../../shared/services/permissions.service';
 import {UserService} from '../services/user.service';
 import {MatDialog, MatDialogConfig} from '@angular/material/dialog';
@@ -89,12 +89,11 @@ export class UsersComponent extends NaturalAbstractList<UserService> implements
 
     public constructor() {
         const userService = inject(UserService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(userService);
         this.userService = userService;
 
-        this.naturalSearchFacets = naturalSearchFacetsService.get('users');
+        this.naturalSearchFacets = users();
     }
 
     public flagWelcomeSessionDate(user: Users['users']['items'][0]): void {

diff --git a/client/app/safety/safety.component.ts b/client/app/safety/safety.component.ts
@@ -1,6 +1,6 @@
 import {Component, inject} from '@angular/core';
 import {SafetyBookingService} from './safety-booking.service';
-import {NaturalSearchFacetsService} from '../shared/natural-search/natural-search-facets.service';
+import {bookings} from '../shared/natural-search/natural-search-facets.service';
 import {PermissionsService} from '../shared/services/permissions.service';
 import {AbstractBookings} from '../admin/bookings/bookings/abstract-bookings';
 import {RouterLink} from '@angular/router';
@@ -59,9 +59,8 @@ export class SafetyComponent extends AbstractBookings<SafetyBookingService> {
 
     public constructor() {
         const safetyBookingService = inject(SafetyBookingService);
-        const naturalSearchFacetsService = inject(NaturalSearchFacetsService);
 
         super(safetyBookingService);
-        this.naturalSearchFacets = naturalSearchFacetsService.get('bookings');
+        this.naturalSearchFacets = bookings();
     }
 }