diff --git a/src/app/adf-api-docs/df-api-docs/df-api-docs.component.ts b/src/app/adf-api-docs/df-api-docs/df-api-docs.component.ts
index 2f90129f..98330625 100644
--- a/src/app/adf-api-docs/df-api-docs/df-api-docs.component.ts
+++ b/src/app/adf-api-docs/df-api-docs/df-api-docs.component.ts
@@ -12,13 +12,17 @@ import { TranslocoModule } from '@ngneat/transloco';
 import { saveRawAsFile } from 'src/app/shared/utilities/file';
 import { UntilDestroy } from '@ngneat/until-destroy';
 import { DfUserDataService } from 'src/app/shared/services/df-user-data.service';
-import { SESSION_TOKEN_HEADER } from 'src/app/shared/constants/http-headers';
+import {
+  SESSION_TOKEN_HEADER,
+  API_KEY_HEADER,
+} from 'src/app/shared/constants/http-headers';
 import {
   mapCamelToSnake,
   mapSnakeToCamel,
 } from 'src/app/shared/utilities/case';
 import { DfThemeService } from 'src/app/shared/services/df-theme.service';
 import { AsyncPipe } from '@angular/common';
+import { environment } from '../../../../environments/environment';
 
 @UntilDestroy({ checkProperties: true })
 @Component({
@@ -64,6 +68,7 @@ export class DfApiDocsComponent implements OnInit, AfterContentInit {
       domNode: this.apiDocElement?.nativeElement,
       requestInterceptor: (req: SwaggerUI.Request) => {
         req['headers'][SESSION_TOKEN_HEADER] = this.userDataService.token;
+        req['headers'][API_KEY_HEADER] = environment.dfApiKey;
         // Parse the request URL
         const url = new URL(req['url']);
         const params = new URLSearchParams(url.search);
diff --git a/src/app/debug/debug.component.ts b/src/app/debug/debug.component.ts
index 9d91fb15..03507979 100644
--- a/src/app/debug/debug.component.ts
+++ b/src/app/debug/debug.component.ts
@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 
 @Component({
-  selector: 'app-debug',
+  selector: 'df-app-debug',
   template: `
     <div *ngIf="debugInfo.length > 0">
       <h3>Debug Information:</h3>
diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts
index 253fb5c3..beb4f0de 100644
--- a/src/app/home/home.component.ts
+++ b/src/app/home/home.component.ts
@@ -2,9 +2,9 @@ import { Component } from '@angular/core';
 import { TranslocoModule } from '@ngneat/transloco';
 
 @Component({
-  selector: 'app-home',
+  selector: 'df-app-home',
   template: '<h1>{{ "home.welcome" | transloco }}</h1>',
   standalone: true,
-  imports: [TranslocoModule]
+  imports: [TranslocoModule],
 })
-export class HomeComponent {}
\ No newline at end of file
+export class HomeComponent {}
diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index f3048c7a..3556bfa7 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -3,12 +3,22 @@ <h2>{{ 'login.title' | transloco }}</h2>
   <form (ngSubmit)="onSubmit()">
     <div>
       <label for="username">{{ 'login.username' | transloco }}:</label>
-      <input type="text" id="username" name="username" [(ngModel)]="username" required>
+      <input
+        type="text"
+        id="username"
+        name="username"
+        [(ngModel)]="username"
+        required />
     </div>
     <div>
       <label for="password">{{ 'login.password' | transloco }}:</label>
-      <input type="password" id="password" name="password" [(ngModel)]="password" required>
+      <input
+        type="password"
+        id="password"
+        name="password"
+        [(ngModel)]="password"
+        required />
     </div>
     <button type="submit">{{ 'login.submit' | transloco }}</button>
   </form>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/login/login.component.scss b/src/app/login/login.component.scss
index 9e3b3e02..1ca339a8 100644
--- a/src/app/login/login.component.scss
+++ b/src/app/login/login.component.scss
@@ -26,4 +26,4 @@ button {
   color: white;
   border: none;
   cursor: pointer;
-}
\ No newline at end of file
+}
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index c4d0233e..54dc9730 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -5,7 +5,7 @@ import { UserService } from '../shared/services/user.service';
 import { NotificationService } from '../shared/services/notification.service';
 
 @Component({
-  selector: 'app-login',
+  selector: 'df-app-login',
   templateUrl: './login.component.html',
   styleUrls: ['./login.component.scss'],
 })
diff --git a/src/app/saml-callback/saml-callback.component.ts b/src/app/saml-callback/saml-callback.component.ts
index cf2b241e..77f9ef38 100644
--- a/src/app/saml-callback/saml-callback.component.ts
+++ b/src/app/saml-callback/saml-callback.component.ts
@@ -28,7 +28,7 @@ export class SamlCallbackComponent implements OnInit {
 
   private handleSamlLogin(jwt: string) {
     this.authService.loginWithJwt(jwt).subscribe(
-      (result) => {
+      result => {
         if (result && result.session_token) {
           this.loggingService.log('SAML login successful');
           this.router.navigate(['/home']);
@@ -43,4 +43,4 @@ export class SamlCallbackComponent implements OnInit {
       }
     );
   }
-}
\ No newline at end of file
+}
diff --git a/src/app/shared/guards/auth.guard.ts b/src/app/shared/guards/auth.guard.ts
index e5e3996c..55bf2e72 100644
--- a/src/app/shared/guards/auth.guard.ts
+++ b/src/app/shared/guards/auth.guard.ts
@@ -1,14 +1,25 @@
 import { Injectable } from '@angular/core';
-import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';
+import {
+  CanActivate,
+  ActivatedRouteSnapshot,
+  RouterStateSnapshot,
+  Router,
+} from '@angular/router';
 import { AuthService } from '../services/auth.service';
 
 @Injectable({
-  providedIn: 'root'
+  providedIn: 'root',
 })
 export class AuthGuard implements CanActivate {
-  constructor(private authService: AuthService, private router: Router) {}
+  constructor(
+    private authService: AuthService,
+    private router: Router
+  ) {}
 
-  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+  canActivate(
+    route: ActivatedRouteSnapshot,
+    state: RouterStateSnapshot
+  ): boolean {
     if (this.authService.isAuthenticated()) {
       return true;
     }
diff --git a/src/app/shared/modules/side-nav.module.ts b/src/app/shared/modules/side-nav.module.ts
index 88fd43da..bf47b589 100644
--- a/src/app/shared/modules/side-nav.module.ts
+++ b/src/app/shared/modules/side-nav.module.ts
@@ -5,6 +5,6 @@ import { RouterModule } from '@angular/router';
 
 @NgModule({
   imports: [CommonModule, RouterModule, DfSideNavComponent],
-  exports: [DfSideNavComponent, RouterModule]
+  exports: [DfSideNavComponent, RouterModule],
 })
-export class SideNavModule { }
\ No newline at end of file
+export class SideNavModule {}
diff --git a/src/app/shared/services/auth.service.ts b/src/app/shared/services/auth.service.ts
index ebf3e2cf..c0154475 100644
--- a/src/app/shared/services/auth.service.ts
+++ b/src/app/shared/services/auth.service.ts
@@ -5,7 +5,7 @@ import { DfAuthService } from '../../adf-user-management/services/df-auth.servic
 import { DfUserDataService } from './df-user-data.service';
 
 @Injectable({
-  providedIn: 'root'
+  providedIn: 'root',
 })
 export class AuthService {
   constructor(
@@ -14,9 +14,9 @@ export class AuthService {
   ) {}
 
   loginWithJwt(jwt: string): Observable<any> {
-    return this.dfAuthService.loginWithToken(jwt).pipe(
-      tap(user => this.dfUserDataService.userData = user)
-    );
+    return this.dfAuthService
+      .loginWithToken(jwt)
+      .pipe(tap(user => (this.dfUserDataService.userData = user)));
   }
 
   setCurrentUser(user: any) {
diff --git a/src/app/shared/services/notification.service.ts b/src/app/shared/services/notification.service.ts
index 845a1bc0..982a0af6 100644
--- a/src/app/shared/services/notification.service.ts
+++ b/src/app/shared/services/notification.service.ts
@@ -4,7 +4,7 @@ import { Injectable } from '@angular/core';
   providedIn: 'root',
 })
 export class NotificationService {
-  constructor() {}
+  // constructor() {}
 
   success(title: string, message: string) {
     console.log('Success:', title, message);
diff --git a/src/app/transloco-loader.ts b/src/app/transloco-loader.ts
index 315ea051..9a535585 100644
--- a/src/app/transloco-loader.ts
+++ b/src/app/transloco-loader.ts
@@ -9,4 +9,4 @@ export class TranslocoHttpLoader implements TranslocoLoader {
   getTranslation(lang: string) {
     return this.http.get<Translation>(`/assets/i18n/${lang}.json`);
   }
-}
\ No newline at end of file
+}