From 34138ad5fab16791129e55f370d4e0c02467b32a Mon Sep 17 00:00:00 2001
From: Sercan Yemen <117369+srcn@users.noreply.github.com>
Date: Sun, 26 May 2024 12:27:43 +0300
Subject: [PATCH] (docs) Updated docs to use 'inject()' function in code
 examples

---
 .../components/alert/alert.component.html     |  5 +---
 .../highlight/highlight.component.html        | 11 ++-------
 .../loading-bar/loading-bar.component.html    | 24 +++++--------------
 .../mock-api/mock-api.component.html          |  8 +++++--
 .../services/config/config.component.html     |  8 +++++--
 .../media-watcher.component.html              |  8 +++++--
 6 files changed, 27 insertions(+), 37 deletions(-)

diff --git a/src/app/modules/admin/ui/fuse-components/components/alert/alert.component.html b/src/app/modules/admin/ui/fuse-components/components/alert/alert.component.html
index ceb8d2ec..ffa3d636 100644
--- a/src/app/modules/admin/ui/fuse-components/components/alert/alert.component.html
+++ b/src/app/modules/admin/ui/fuse-components/components/alert/alert.component.html
@@ -1168,10 +1168,7 @@
                     <textarea fuse-highlight
                               [lang]="'typescript'">
 
-                        /**
-                         * Constructor
-                         */
-                        constructor( private _fuseAlertService: FuseAlertService ) {}
+                        private _fuseAlertService = inject(FuseAlertService);
 
                         /**
                          * Dismiss the alert via the service
diff --git a/src/app/modules/admin/ui/fuse-components/components/highlight/highlight.component.html b/src/app/modules/admin/ui/fuse-components/components/highlight/highlight.component.html
index 6b15782c..012c1221 100644
--- a/src/app/modules/admin/ui/fuse-components/components/highlight/highlight.component.html
+++ b/src/app/modules/admin/ui/fuse-components/components/highlight/highlight.component.html
@@ -125,17 +125,10 @@
         <!-- @formatter:off -->
         <textarea fuse-highlight
                   lang="typescript">
-            import { FuseHighlightService } from '@fuse/components/highlight';
+            private _fuseHighlightService = inject(FuseHighlightService);
 
             code = '<div> Some code to highlight </div>'
-
-            /**
-             * Constructor
-             */
-            constructor(private _fuseHighlightService: FuseHighlightService)
-            {
-                const highlightedCode = this._fuseHighlightService.highlight(code, 'html');
-            }
+            highlightedCode = this._fuseHighlightService.highlight(code, 'html');
         </textarea>
         <!-- @formatter:on -->
 
diff --git a/src/app/modules/admin/ui/fuse-components/components/loading-bar/loading-bar.component.html b/src/app/modules/admin/ui/fuse-components/components/loading-bar/loading-bar.component.html
index d0e5879f..ac3e59cc 100644
--- a/src/app/modules/admin/ui/fuse-components/components/loading-bar/loading-bar.component.html
+++ b/src/app/modules/admin/ui/fuse-components/components/loading-bar/loading-bar.component.html
@@ -205,10 +205,7 @@
                     <textarea
                         fuse-highlight
                         [lang]="'ts'">
-                        /**
-                         * Constructor
-                         */
-                        constructor( private _fuseLoadingService: FuseLoadingService ) { }
+                        private _fuseLoadingService = inject(FuseLoadingService);
 
                         ...
 
@@ -310,16 +307,10 @@
                     <textarea
                         fuse-highlight
                         [lang]="'ts'">
-                        apiCallStatus: string = '-';
+                        private _httpClient = inject(HttpClient);
+                        private _fuseLoadingService = inject(FuseLoadingService);
 
-                        /**
-                         * Constructor
-                         */
-                        constructor(
-                            private _httpClient: HttpClient,
-                            private _fuseLoadingService: FuseLoadingService
-                        )
-                        { }
+                        apiCallStatus: string = '-';
 
                         ...
 
@@ -439,12 +430,9 @@
                     <textarea
                         fuse-highlight
                         [lang]="'ts'">
-                        mode: 'determinate' | 'indeterminate' = 'indeterminate';
+                        private _fuseLoadingService = inject(FuseLoadingService);
 
-                        /**
-                         * Constructor
-                         */
-                        constructor( private _fuseLoadingService: FuseLoadingService ) { }
+                        mode: 'determinate' | 'indeterminate' = 'indeterminate';
 
                         ...
 
diff --git a/src/app/modules/admin/ui/fuse-components/libraries/mock-api/mock-api.component.html b/src/app/modules/admin/ui/fuse-components/libraries/mock-api/mock-api.component.html
index 06b50ff0..72ca0044 100644
--- a/src/app/modules/admin/ui/fuse-components/libraries/mock-api/mock-api.component.html
+++ b/src/app/modules/admin/ui/fuse-components/libraries/mock-api/mock-api.component.html
@@ -249,10 +249,12 @@
             })
             export class NavigationMockApi
             {
+                private _fuseMockApiService = inject(FuseMockApiService);
+
                 /**
                  * Constructor
                  */
-                constructor(private _fuseMockApiService: FuseMockApiService)
+                constructor()
                 {
                     // Register Mock API handlers
                     this.registerHandlers();
@@ -301,13 +303,15 @@
             })
             export class NavigationMockApi
             {
+                private _fuseMockApiService = inject(FuseMockApiService);
+
                 private readonly _compactNavigation: any[];
                 private readonly _defaultNavigation: any[];
 
                 /**
                  * Constructor
                  */
-                constructor(private _fuseMockApiService: FuseMockApiService)
+                constructor()
                 {
                     // Set the data
                     this._compactNavigation = compactNavigation;
diff --git a/src/app/modules/admin/ui/fuse-components/services/config/config.component.html b/src/app/modules/admin/ui/fuse-components/services/config/config.component.html
index 2a3a459b..08b924dd 100644
--- a/src/app/modules/admin/ui/fuse-components/services/config/config.component.html
+++ b/src/app/modules/admin/ui/fuse-components/services/config/config.component.html
@@ -111,10 +111,12 @@
         <textarea fuse-highlight lang="typescript">
             import { FuseConfigService } from '@fuse/services/config';
 
+            private _fuseConfigService = inject(FuseConfigService);
+
             /**
              * Constructor
              */
-            constructor(private _fuseConfigService: FuseConfigService)
+            constructor()
             {
                 this._fuseConfigService.config = {layout: 'classy'};
             }
@@ -128,12 +130,14 @@
             import { FuseConfigService } from '@fuse/services/config';
             import { AppConfig } from 'app/core/config/app.config';
 
+            private _fuseConfigService = inject(FuseConfigService);
+
             config: AppConfig;
 
             /**
              * Constructor
              */
-            constructor(private _fuseConfigService: FuseConfigService)
+            constructor()
             {
                 this._fuseConfigService.config$
                     .pipe(takeUntil(this._unsubscribeAll))
diff --git a/src/app/modules/admin/ui/fuse-components/services/media-watcher/media-watcher.component.html b/src/app/modules/admin/ui/fuse-components/services/media-watcher/media-watcher.component.html
index ee653d89..401fd9af 100644
--- a/src/app/modules/admin/ui/fuse-components/services/media-watcher/media-watcher.component.html
+++ b/src/app/modules/admin/ui/fuse-components/services/media-watcher/media-watcher.component.html
@@ -58,10 +58,12 @@
         <textarea fuse-highlight lang="typescript">
             import { FuseMediaWatcherService } from '@fuse/services/config';
 
+            private _fuseMediaWatcherService = inject(FuseMediaWatcherService);
+
             /**
              * Constructor
              */
-            constructor(private _fuseMediaWatcherService: FuseMediaWatcherService)
+            constructor()
             {
                 // Subscribe to media changes
                 this._fuseMediaWatcherService.onMediaChange$
@@ -81,10 +83,12 @@
         <textarea fuse-highlight lang="typescript">
             import { FuseMediaWatcherService } from '@fuse/services/config';
 
+            private _fuseMediaWatcherService = inject(FuseMediaWatcherService);
+
             /**
              * Constructor
              */
-            constructor(private _fuseMediaWatcherService: FuseMediaWatcherService)
+            constructor()
             {
                 // Subscribe to media changes
                 this._fuseMediaWatcherService.onMediaQueryChange$('(min-width: 1440px)')