NAS-128352: Search elements for System Settings

package.json

@@ -176,7 +176,7 @@
     "@types/glob": "~8.1.0",
     "@types/inquirer": "^8.0.0",
     "@types/js-yaml": "~4.0.8",
-    "@types/lodash": "4.14.195",
+    "@types/lodash": "4.17.0",
     "@types/node": "~10.12.7",
     "@types/pixi.js": "~4.7.1",
     "@typescript-eslint/eslint-plugin": "~6.18.1",

src/app/core/testing/classes/mock-websocket.service.ts

@@ -73,11 +73,14 @@ export class MockWebSocketService extends WebSocketService {
 
   mockCall<K extends ApiCallMethod>(method: K, response: CallResponseOrFactory<K>): void {
     const mockedImplementation = (_: K, params: ApiCallParams<K>): Observable<unknown> => {
+      let preparedResponse = response;
       if (response instanceof Function) {
-        return of(response(params));
+        preparedResponse = response(params);
       }
 
-      return of(response);
+      Object.freeze(preparedResponse);
+
+      return of(preparedResponse);
     };
 
     when(this.call).calledWith(method).mockImplementation(mockedImplementation);
@@ -107,10 +110,13 @@ export class MockWebSocketService extends WebSocketService {
         job = response;
       }
 
-      return {
+      job = {
         ...job,
         id: this.jobIdCounter,
-      } as Job<ApiJobResponse<M>>;
+      };
+
+      Object.freeze(job);
+      return job as Job<ApiJobResponse<M>>;
     };
     when(this.startJob).calledWith(method).mockReturnValue(of(this.jobIdCounter));
     when(this.startJob).calledWith(method, anyArgument).mockReturnValue(of(this.jobIdCounter));

src/app/helptext/services/components/service-nfs.ts

@@ -35,9 +35,9 @@ export const helptextServiceNfs = {
  href="https://linux.die.net/man/8/rpc.lockd"\
  target="_blank">rpc.lockd(8)</a>.'),
 
-  nfs_srv_16_tooltip: T('Set when a user is a member of more than 16 groups.\
- This assumes group membership is configured correctly\
- on the NFS server.'),
+  userd_manage_gids: T('Enable server-side management of group memberships. \
+ This option allows the server to determine group IDs based on server-side lookups rather than relying solely on the information provided by the NFS client. \
+ This can support more than 16 groups and provide more accurate group memberships.'),
 
   nfs_srv_mountd_log_tooltip: T('Set to log <a\
  href="https://man7.org/linux/man-pages/man8/mountd.8.html"\

src/app/helptext/vm/devices/device-add-edit.ts

@@ -46,11 +46,11 @@ export const helptextDevice = {
  assign a port when the VM is started, or set to a\
  fixed, preferred port number.'),
 
-  wait_placeholder: T('Delay VM Boot Until VNC Connects'),
-  wait_tooltip: T('Wait to start VM until VNC client connects.'),
+  wait_placeholder: T('Delay VM Boot Until SPICE Connects'),
+  wait_tooltip: T('Wait to start VM until SPICE client connects.'),
 
-  resolution_tooltip: T('Select a screen resolution to use for VNC sessions.'),
-  bind_tooltip: T('Select an IP address to use for VNC sessions.'),
-  password_tooltip: T('Enter a VNC password to automatically pass to the VNC session.'),
-  web_tooltip: T('Set to enable connecting to the VNC web interface.'),
+  resolution_tooltip: T('Select a screen resolution to use for SPICE sessions.'),
+  bind_tooltip: T('Select an IP address to use for SPICE sessions.'),
+  password_tooltip: T('Enter a SPICE password to automatically pass to the SPICE session.'),
+  web_tooltip: T('Set to enable connecting to the SPICE web interface.'),
 };

src/app/helptext/vm/vm-wizard/vm-wizard.ts

@@ -4,7 +4,7 @@ import { helptextGlobal } from 'app/helptext/global-helptext';
 export const helptextVmWizard = {
   os_tooltip: T('Choose the VM operating system type.'),
   name_tooltip: T('Enter an alphanumeric name for the virtual machine.'),
-  password_tooltip: T('Enter a password for the VNC display.'),
+  password_tooltip: T('Enter a password for the SPICE display.'),
   description_tooltip: T('Description (optional).'),
   time_tooltip: T('VM system time. Default is <i>Local</i>.'),
   bootloader_tooltip: T('Select <i>UEFI</i> for newer operating systems or\
@@ -15,8 +15,8 @@ export const helptextVmWizard = {
   autostart_tooltip: T('Set to start this VM when the system boots.'),
   enable_display_tooltip: T('Enable a Display (Virtual Network Computing) remote\
  connection. Requires <i>UEFI</i> booting.'),
-  display_bind_tooltip: T('Select an IP address to use for remote VNC sessions.\
- Note: this setting only applies if you are using a VNC client other than the TrueNAS WebUI.'),
+  display_bind_tooltip: T('Select an IP address to use for remote SPICE sessions.\
+ Note: this setting only applies if you are using a SPICE client other than the TrueNAS WebUI.'),
   vcpus_warning: T('The product of vCPUs, cores and threads must not exceed {maxVcpus} on this system.'),
   vcpus_tooltip: T('Number of virtual CPUs to allocate to the virtual\
  machine. The VM operating system\

src/app/interfaces/api/api-call-directory.interface.ts

@@ -426,7 +426,7 @@ export interface ApiCallDirectory {
   'cronjob.update': { params: [id: number, update: CronjobUpdate]; response: Cronjob };
 
   // Device
-  'device.get_info': { params: [DeviceType]; response: Device[] };
+  'device.get_info': { params: [{ type: DeviceType }]; response: Device[] };
 
   // Directory Services
   'directoryservices.get_state': { params: void; response: DirectoryServicesState };

src/app/interfaces/api/api-event-directory.interface.ts

@@ -1,6 +1,6 @@
 import { FailoverStatus } from 'app/enums/failover-status.enum';
 import { Alert } from 'app/interfaces/alert.interface';
-import { ChartRelease, ChartReleaseStats } from 'app/interfaces/chart-release.interface';
+import { ChartRelease, ChartStatisticsUpdate } from 'app/interfaces/chart-release.interface';
 import { PullContainerImageResponse, PullContainerImageParams, ContainerImage } from 'app/interfaces/container-image.interface';
 import { DirectoryServicesState } from 'app/interfaces/directory-services-state.interface';
 import { FailoverDisabledReasonEvent } from 'app/interfaces/failover-disabled-reasons.interface';
@@ -21,7 +21,7 @@ import { ZfsSnapshot } from 'app/interfaces/zfs-snapshot.interface';
 export interface ApiEventDirectory {
   'alert.list': { response: Alert };
   'chart.release.query': { response: ChartRelease };
-  'chart.release.statistics': { response: { id: string; stats: ChartReleaseStats } };
+  'chart.release.statistics': { response: ChartStatisticsUpdate[] };
   'core.get_jobs': { response: Job };
   'directoryservices.status': { response: DirectoryServicesState };
   'failover.status': { response: { status: FailoverStatus } };

src/app/interfaces/chart-release.interface.ts

@@ -72,7 +72,11 @@ export interface ChartRelease {
   chart_schema: ChartSchema;
   history: Record<string, ChartReleaseVersion>;
   resources?: ChartResources;
-  stats?: ChartReleaseStats;
+}
+
+export interface ChartStatisticsUpdate {
+  id: string;
+  stats: ChartReleaseStats;
 }
 
 export interface ChartReleaseStats {

src/app/interfaces/cloud-backup.interface.ts

@@ -45,7 +45,7 @@ export type CloudBackupRestoreParams = [
   snapshot_id: string,
   subfolder: string,
   destination_path: string,
-  {
+  settings: {
     exclude: string[];
     include?: string[];
   },

src/app/modules/dialog/components/multi-error-dialog/multi-error-dialog.component.html

@@ -1,4 +1,4 @@
-<h1 mat-dialog-title>Multiple Errors</h1>
+<h1 mat-dialog-title>{{ 'Multiple Errors' | translate }}</h1>
 <div
   class="multi-error-dialog"
   mat-dialog-content
@@ -15,7 +15,7 @@ <h1 mat-dialog-title>Multiple Errors</h1>
     ></ix-error-template>
     <mat-divider></mat-divider>
   </ng-container>
-  
+
 </div>
 <div mat-dialog-actions>
   <button

src/app/modules/layout/components/topbar/jobs-indicator/jobs-indicator.component.html

@@ -9,6 +9,7 @@
   [matBadge]="jobBadgeCount"
   [matBadgeHidden]="jobBadgeCount === 0"
   [matTooltip]="tooltips.task_manager | translate"
+  [ixUiSearch]="searchableElements.elements.jobs"
   (click)="onIndicatorPressed()"
 >
   <ix-icon name="assignment"></ix-icon>

src/app/modules/layout/components/topbar/jobs-indicator/jobs-indicator.component.ts

@@ -7,6 +7,7 @@ import { helptextTopbar } from 'app/helptext/topbar';
 import { JobsPanelComponent } from 'app/modules/jobs/components/jobs-panel/jobs-panel.component';
 import { jobPanelClosed } from 'app/modules/jobs/store/job.actions';
 import { selectIsJobPanelOpen, selectRunningJobsCount } from 'app/modules/jobs/store/job.selectors';
+import { jobsElements } from 'app/modules/layout/components/topbar/jobs-indicator/jobs-indicator.elements';
 import { topbarDialogPosition } from 'app/modules/layout/components/topbar/topbar-dialog-position.constant';
 import { AppState } from 'app/store';
 import { jobIndicatorPressed } from 'app/store/topbar/topbar.actions';
@@ -22,6 +23,7 @@ export class JobsIndicatorComponent implements OnInit {
 
   jobBadgeCount$ = this.store$.select(selectRunningJobsCount);
   isJobPanelOpen$ = this.store$.select(selectIsJobPanelOpen);
+  protected readonly searchableElements = jobsElements;
 
   constructor(
     private matDialog: MatDialog,

src/app/modules/layout/components/topbar/jobs-indicator/jobs-indicator.elements.ts

@@ -0,0 +1,11 @@
+import { marker as T } from '@biesbjerg/ngx-translate-extract-marker';
+import { UiSearchableElement } from 'app/modules/global-search/interfaces/ui-searchable-element.interface';
+
+export const jobsElements = {
+  hierarchy: [T('Toolbar')],
+  elements: {
+    jobs: {
+      hierarchy: [T('Jobs History')],
+    },
+  },
+} satisfies UiSearchableElement;

src/app/modules/layout/components/topbar/power-menu/power-menu.component.html

@@ -5,11 +5,18 @@
   ixTest="power-menu"
   [matTooltip]="tooltips.power | translate"
   [matMenuTriggerFor]="powerMenu"
+  [ixUiSearch]="searchableElements.elements.powerMenu"
 >
   <ix-icon name="power_settings_new"></ix-icon>
 </button>
 <mat-menu #powerMenu="matMenu">
-  <button name="power-log-out" mat-menu-item ixTest="log-out" (click)="onSignOut()">
+  <button
+    name="power-log-out"
+    mat-menu-item
+    ixTest="log-out"
+    [ixUiSearch]="searchableElements.elements.logOut"
+    (click)="onSignOut()"
+  >
     <ix-icon name="exit_to_app"></ix-icon>
     {{ 'Log Out' | translate }}
   </button>
@@ -19,6 +26,7 @@
     name="power-restart"
     mat-menu-item
     ixTest="restart"
+    [ixUiSearch]="searchableElements.elements.restart"
     (click)="onReboot()"
   >
     <ix-icon name="replay"></ix-icon>
@@ -30,6 +38,7 @@
     name="power-shut-down"
     mat-menu-item
     ixTest="shut-down"
+    [ixUiSearch]="searchableElements.elements.shutDown"
     (click)="onShutdown()"
   >
     <ix-icon name="power_settings_new"></ix-icon>

src/app/modules/layout/components/topbar/power-menu/power-menu.component.ts

@@ -6,6 +6,7 @@ import { filter } from 'rxjs/operators';
 import { Role } from 'app/enums/role.enum';
 import { helptextTopbar } from 'app/helptext/topbar';
 import { DialogService } from 'app/modules/dialog/dialog.service';
+import { powerMenuElements } from 'app/modules/layout/components/topbar/power-menu/power-menu.elements';
 import { AuthService } from 'app/services/auth/auth.service';
 import { WebSocketConnectionService } from 'app/services/websocket-connection.service';
 
@@ -16,9 +17,9 @@ import { WebSocketConnectionService } from 'app/services/websocket-connection.se
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class PowerMenuComponent {
-  readonly tooltips = helptextTopbar.mat_tooltips;
-
+  protected readonly tooltips = helptextTopbar.mat_tooltips;
   protected readonly requiredRoles = [Role.FullAdmin];
+  protected searchableElements = powerMenuElements;
 
   constructor(
     private authService: AuthService,

src/app/modules/layout/components/topbar/power-menu/power-menu.elements.ts

@@ -0,0 +1,22 @@
+import { marker as T } from '@biesbjerg/ngx-translate-extract-marker';
+import { UiSearchableElement } from 'app/modules/global-search/interfaces/ui-searchable-element.interface';
+
+export const powerMenuElements = {
+  hierarchy: [T('Toolbar'), T('Power Menu')],
+  synonyms: [T('Toolbar')],
+  triggerAnchor: 'power-menu',
+  elements: {
+    powerMenu: {
+      anchor: 'power-menu',
+    },
+    logOut: {
+      hierarchy: [T('LogOut')],
+    },
+    restart: {
+      hierarchy: [T('Restart')],
+    },
+    shutDown: {
+      hierarchy: [T('Shut Down')],
+    },
+  },
+} satisfies UiSearchableElement;

src/app/modules/layout/components/topbar/topbar.component.html

@@ -33,6 +33,7 @@
         class="topbar-button-right"
         ixTest="leave-feedback"
         [matTooltip]="'Send Feedback' | translate"
+        [ixUiSearch]="searchableElements.elements.sendFeedback"
         (click)="onFeedbackIndicatorPressed()"
       >
         <ix-icon name="mdi-emoticon"></ix-icon>
@@ -70,6 +71,7 @@
         [matBadge]="alertBadgeCount"
         [matBadgeHidden]="alertBadgeCount === 0"
         [matTooltip]="tooltips.alerts | translate"
+        [ixUiSearch]="searchableElements.elements.alerts"
         (click)="onAlertIndicatorPressed()"
       >
         <ix-icon name="notifications"></ix-icon>

src/app/modules/layout/components/topbar/topbar.component.ts

@@ -14,6 +14,7 @@ import { UpdateDialogComponent } from 'app/modules/dialog/components/update-dial
 import { FeedbackDialogComponent } from 'app/modules/feedback/components/feedback-dialog/feedback-dialog.component';
 import { selectUpdateJob } from 'app/modules/jobs/store/job.selectors';
 import { topbarDialogPosition } from 'app/modules/layout/components/topbar/topbar-dialog-position.constant';
+import { toolBarElements } from 'app/modules/layout/components/topbar/topbar.elements';
 import { SystemGeneralService } from 'app/services/system-general.service';
 import { ThemeService } from 'app/services/theme/theme.service';
 import { selectIsHaLicensed } from 'app/store/ha-info/ha-info.selectors';
@@ -35,6 +36,7 @@ export class TopbarComponent implements OnInit {
   systemWillRestart = false;
   updateNotificationSent = false;
   tooltips = helptextTopbar.mat_tooltips;
+  protected searchableElements = toolBarElements;
 
   alertBadgeCount$ = this.store$.select(selectImportantUnreadAlertsCount);
 

src/app/modules/layout/components/topbar/topbar.elements.ts

@@ -0,0 +1,14 @@
+import { marker as T } from '@biesbjerg/ngx-translate-extract-marker';
+import { UiSearchableElement } from 'app/modules/global-search/interfaces/ui-searchable-element.interface';
+
+export const toolBarElements = {
+  hierarchy: [T('Toolbar')],
+  elements: {
+    sendFeedback: {
+      hierarchy: [T('Send Feedback')],
+    },
+    alerts: {
+      hierarchy: [T('Alerts')],
+    },
+  },
+} satisfies UiSearchableElement;

src/app/modules/layout/components/topbar/user-menu/user-menu.component.html

@@ -5,6 +5,7 @@
     class="topbar-button-right"
     ixTest="user-menu"
     [matTooltip]="tooltips.settings | translate"
+    [ixUiSearch]="searchableElements.elements.userMenu"
     [matMenuTriggerFor]="userMenu"
   >
     <span
@@ -25,6 +26,7 @@
       name="settings-change-password"
       mat-menu-item
       ixTest="change-password"
+      [ixUiSearch]="searchableElements.elements.changePassword"
       (click)="openChangePasswordDialog()"
     >
       <ix-icon name="dialpad"></ix-icon>
@@ -52,12 +54,19 @@
       href="https://www.truenas.com/docs/"
       target="_blank"
       ixTest="guide"
+      [ixUiSearch]="searchableElements.elements.guide"
     >
       <ix-icon name="library_books"></ix-icon>
       {{ 'Guide' | translate }}
     </a>
 
-    <button name="settings-about" mat-menu-item ixTest="about" (click)="onShowAbout()">
+    <button
+      name="settings-about"
+      mat-menu-item
+      ixTest="about"
+      [ixUiSearch]="searchableElements.elements.about"
+      (click)="onShowAbout()"
+    >
       <ix-icon name="info_outline"></ix-icon>
       {{ 'About' | translate }}
     </button>

src/app/modules/layout/components/topbar/user-menu/user-menu.component.ts

@@ -10,6 +10,7 @@ import { AboutDialogComponent } from 'app/modules/layout/components/topbar/about
 import {
   ChangePasswordDialogComponent,
 } from 'app/modules/layout/components/topbar/change-password-dialog/change-password-dialog.component';
+import { userMenuElements } from 'app/modules/layout/components/topbar/user-menu/user-menu.elements';
 import { AuthService } from 'app/services/auth/auth.service';
 
 @Component({
@@ -21,6 +22,7 @@ import { AuthService } from 'app/services/auth/auth.service';
 export class UserMenuComponent {
   readonly tooltips = helptextTopbar.mat_tooltips;
   loggedInUser$ = this.authService.user$.pipe(filter(Boolean));
+  protected searchableElements = userMenuElements;
 
   constructor(
     private matDialog: MatDialog,

src/app/modules/layout/components/topbar/user-menu/user-menu.elements.ts

@@ -0,0 +1,22 @@
+import { marker as T } from '@biesbjerg/ngx-translate-extract-marker';
+import { UiSearchableElement } from 'app/modules/global-search/interfaces/ui-searchable-element.interface';
+
+export const userMenuElements = {
+  hierarchy: [T('Toolbar'), T('Settings Menu')],
+  synonyms: [T('Toolbar')],
+  triggerAnchor: 'user-menu',
+  elements: {
+    userMenu: {
+      anchor: 'user-menu',
+    },
+    changePassword: {
+      hierarchy: [T('Change Password')],
+    },
+    guide: {
+      hierarchy: [T('Guide')],
+    },
+    about: {
+      hierarchy: [T('About')],
+    },
+  },
+} satisfies UiSearchableElement;