docs: inject services with recommended API and use takeUntilDestroyed

- Updated service injection to use readonly fields.
- Replaced manual subscription tracking with `takeUntilDestroyed`, removing the need for `OnDestroy` cleanup.

Author: MeAkib

docs/src/app/shared/theme-picker/theme-picker.ts

@@ -9,7 +9,7 @@
 import {
   ChangeDetectionStrategy,
   Component,
-  OnDestroy,
+  DestroyRef,
   OnInit,
   ViewEncapsulation,
   inject,
@@ -21,7 +21,7 @@ import {MatIcon} from '@angular/material/icon';
 import {MatMenu, MatMenuItem, MatMenuTrigger} from '@angular/material/menu';
 import {MatTooltip} from '@angular/material/tooltip';
 import {ActivatedRoute, ParamMap} from '@angular/router';
-import {Subscription} from 'rxjs';
+import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 import {map} from 'rxjs/operators';
 import {LiveAnnouncer} from '@angular/cdk/a11y';
 
@@ -33,13 +33,13 @@ import {LiveAnnouncer} from '@angular/cdk/a11y';
   encapsulation: ViewEncapsulation.None,
   imports: [MatIconButton, MatTooltip, MatMenu, MatMenuItem, MatMenuTrigger, MatIcon],
 })
-export class ThemePicker implements OnInit, OnDestroy {
-  styleManager = inject(StyleManager);
-  private _themeStorage = inject(ThemeStorage);
-  private _activatedRoute = inject(ActivatedRoute);
-  private _liveAnnouncer = inject(LiveAnnouncer);
+export class ThemePicker implements OnInit {
+  readonly styleManager = inject(StyleManager);
+  private readonly _themeStorage = inject(ThemeStorage);
+  private readonly _activatedRoute = inject(ActivatedRoute);
+  private readonly _liveAnnouncer = inject(LiveAnnouncer);
+  private readonly _destroyRef = inject(DestroyRef);
 
-  private _queryParamSubscription = Subscription.EMPTY;
   currentTheme: DocsSiteTheme | undefined;
 
   // The below colors need to align with the themes defined in theme-picker.scss
@@ -85,19 +85,18 @@ export class ThemePicker implements OnInit, OnDestroy {
   }
 
   ngOnInit() {
-    this._queryParamSubscription = this._activatedRoute.queryParamMap
-      .pipe(map((params: ParamMap) => params.get('theme')))
+    this._activatedRoute.queryParamMap
+      .pipe(
+        map((params: ParamMap) => params.get('theme')),
+        takeUntilDestroyed(this._destroyRef),
+      )
       .subscribe((themeName: string | null) => {
         if (themeName) {
           this.selectTheme(themeName);
         }
       });
   }
 
-  ngOnDestroy() {
-    this._queryParamSubscription.unsubscribe();
-  }
-
   selectTheme(themeName: string) {
     const theme =
       this.themes.find(currentTheme => currentTheme.name === themeName) ||