Fix/chore: refactor some signal-backed conversion technical debt (#13902)

src-ui/src/app/services/settings.service.spec.ts

@@ -210,6 +210,48 @@ describe('SettingsService', () => {
     expect(settingsService.get(SETTINGS_KEYS.THEME_COLOR)).toEqual('#000000')
   })
 
+  it('provides stable signals that update when settings change', () => {
+    const req = httpTestingController.expectOne(
+      `${environment.apiBaseUrl}ui_settings/`
+    )
+    req.flush(ui_settings)
+
+    const notesEnabled = settingsService.getSignal<boolean>(
+      SETTINGS_KEYS.NOTES_ENABLED
+    )
+
+    expect(notesEnabled()).toBeTruthy()
+    expect(
+      settingsService.getSignal<boolean>(SETTINGS_KEYS.NOTES_ENABLED)
+    ).toBe(notesEnabled)
+
+    settingsService.set(SETTINGS_KEYS.NOTES_ENABLED, false)
+
+    expect(notesEnabled()).toBeFalsy()
+  })
+
+  it('updates setting signals when settings are reinitialized', () => {
+    let req = httpTestingController.expectOne(
+      `${environment.apiBaseUrl}ui_settings/`
+    )
+    req.flush(ui_settings)
+    const appTitle = settingsService.getSignal<string>(SETTINGS_KEYS.APP_TITLE)
+
+    settingsService.initializeSettings().subscribe()
+    req = httpTestingController.expectOne(
+      `${environment.apiBaseUrl}ui_settings/`
+    )
+    req.flush({
+      ...ui_settings,
+      settings: {
+        ...ui_settings.settings,
+        app_title: 'Updated title',
+      },
+    })
+
+    expect(appTitle()).toBe('Updated title')
+  })
+
   it('sets django cookie for languages', () => {
     httpTestingController
       .expectOne(`${environment.apiBaseUrl}ui_settings/`)

src-ui/src/app/services/settings.service.ts

@@ -2,6 +2,8 @@ import { HttpClient } from '@angular/common/http'
 import {
   DOCUMENT,
   EventEmitter,
+  Signal,
+  computed,
   inject,
   Injectable,
   LOCALE_ID,
@@ -297,6 +299,7 @@ export class SettingsService {
 
   private settings: Record<string, any> = {}
   private readonly settingsVersion = signal(0)
+  private readonly settingSignals = new Map<string, Signal<unknown>>()
   readonly currentUser = signal<User>(undefined)
 
   public settingsSaved: EventEmitter<any> = new EventEmitter()
@@ -326,10 +329,6 @@ export class SettingsService {
     return !UNSAFE_OBJECT_KEYS.has(key)
   }
 
-  public trackChanges(): void {
-    this.settingsVersion()
-  }
-
   private assignSafeSettings(source: Record<string, any>) {
     if (!source || typeof source !== 'object' || Array.isArray(source)) {
       return
@@ -339,6 +338,7 @@ export class SettingsService {
       if (!this.isSafeObjectKey(key)) continue
       this.settings[key] = source[key]
     }
+    this.settingsVersion.update((version) => version + 1)
   }
 
   // this is called by the app initializer in app.module
@@ -594,6 +594,18 @@ export class SettingsService {
     }
   }
 
+  getSignal<T = any>(key: string): Signal<T> {
+    let settingSignal = this.settingSignals.get(key)
+    if (!settingSignal) {
+      settingSignal = computed(() => {
+        this.settingsVersion()
+        return this.get(key)
+      })
+      this.settingSignals.set(key, settingSignal)
+    }
+    return settingSignal as Signal<T>
+  }
+
   set(key: string, value: any) {
     // parse key:key:key into nested object
     let settingObj = this.settings