Chore: Http interceptors refactor (#11923)

---------

Co-authored-by: shamoon <4887959+shamoon@users.noreply.github.com>

src-ui/src/app/interceptors/csrf.interceptor.ts

@@ -1,36 +1,32 @@
 import {
   HttpEvent,
-  HttpHandler,
-  HttpInterceptor,
+  HttpHandlerFn,
+  HttpInterceptorFn,
   HttpRequest,
 } from '@angular/common/http'
-import { inject, Injectable } from '@angular/core'
+import { inject } from '@angular/core'
 import { Meta } from '@angular/platform-browser'
 import { CookieService } from 'ngx-cookie-service'
 import { Observable } from 'rxjs'
 
-@Injectable()
-export class CsrfInterceptor implements HttpInterceptor {
-  private cookieService: CookieService = inject(CookieService)
-  private meta: Meta = inject(Meta)
+export const withCsrfInterceptor: HttpInterceptorFn = (
+  request: HttpRequest<unknown>,
+  next: HttpHandlerFn
+): Observable<HttpEvent<unknown>> => {
+  const cookieService: CookieService = inject(CookieService)
+  const meta: Meta = inject(Meta)
 
-  intercept(
-    request: HttpRequest<unknown>,
-    next: HttpHandler
-  ): Observable<HttpEvent<unknown>> {
-    let prefix = ''
-    if (this.meta.getTag('name=cookie_prefix')) {
-      prefix = this.meta.getTag('name=cookie_prefix').content
-    }
-    let csrfToken = this.cookieService.get(`${prefix}csrftoken`)
-    if (csrfToken) {
-      request = request.clone({
-        setHeaders: {
-          'X-CSRFToken': csrfToken,
-        },
-      })
-    }
-
-    return next.handle(request)
+  let prefix = ''
+  if (meta.getTag('name=cookie_prefix')) {
+    prefix = meta.getTag('name=cookie_prefix').content
   }
+  let csrfToken = cookieService.get(`${prefix}csrftoken`)
+  if (csrfToken) {
+    request = request.clone({
+      setHeaders: {
+        'X-CSRFToken': csrfToken,
+      },
+    })
+  }
+  return next(request)
 }