feat: allow to execute middlewares when using the dashboard

src/KafkaFlow.Admin.Dashboard/ApplicationBuilderExtensions.cs

@@ -1,5 +1,6 @@
 namespace KafkaFlow.Admin.Dashboard
 {
+    using System;
     using System.Reflection;
     using Microsoft.AspNetCore.Builder;
     using Microsoft.AspNetCore.Http;
@@ -28,26 +29,51 @@ public static IApplicationBuilder UseKafkaFlowDashboard(this IApplicationBuilder
         /// <returns></returns>
         public static IApplicationBuilder UseKafkaFlowDashboard(this IApplicationBuilder app, PathString pathMatch)
         {
+            return app.UseKafkaFlowDashboard(pathMatch, null);
+        }
+
+        /// <summary>
+        /// Enable the KafkaFlow dashboard
+        /// </summary>
+        /// <param name="app">Instance of <see cref="IApplicationBuilder"/></param>
+        /// <param name="pathMatch">The request path to match.</param>
+        /// <param name="actionBuilder">The handler to be executed after the dashboard url is mapped.</param>
+        /// <returns></returns>
+        public static IApplicationBuilder UseKafkaFlowDashboard(
+            this IApplicationBuilder app,
+            PathString pathMatch,
+            Action<IDashboardConfigurationBuilder> actionBuilder)
+        {
+            var builder = new DashboardConfigurationBuilder();
+            actionBuilder?.Invoke(builder);
+            var configuration = builder.Build();
+
             app.Map(
                 pathMatch,
-                builder =>
+                appBuilder =>
                 {
                     var provider = new ManifestEmbeddedFileProvider(
-                        Assembly.GetAssembly(typeof(ApplicationBuilderExtensions)),
+                        Assembly.GetAssembly(typeof(KafkaFlow.Admin.Dashboard.ApplicationBuilderExtensions)),
                         "ClientApp/dist");
 
-                    builder.UseStaticFiles(new StaticFileOptions { FileProvider = provider });
+                    appBuilder
+                        .UseStaticFiles(new StaticFileOptions { FileProvider = provider })
+                        .UseRouting();
 
-                    builder.Run(
-                        async context =>
-                        {
-                            if (context.Request.Path == "/" || context.Request.Path == string.Empty)
-                            {
-                                await context.Response.SendFileAsync(provider.GetFileInfo("index.html"));
-                            }
-                        });
-                });
+                    foreach (var middleware in configuration.Middlewares)
+                    {
+                        appBuilder.UseMiddleware(middleware);
+                    }
+
+                    appBuilder.UseEndpoints(routeBuilder =>
+                    {
+                        var endpoint = routeBuilder.Map(
+                            "/",
+                            async context => await context.Response.SendFileAsync(provider.GetFileInfo("index.html")));
 
+                        configuration.EndpointHandler?.Invoke(endpoint);
+                    });
+                });
             return app;
         }
     }

src/KafkaFlow.Admin.Dashboard/ClientApp/package.json

@@ -22,6 +22,7 @@
     "@angular/router": "~11.2.11",
     "@ng-bootstrap/ng-bootstrap": "^9.1.0",
     "bootstrap": "^4.6.0",
+    "ngx-cookie-service": "^11.0.2",
     "ngx-mask": "^11.1.5",
     "rxjs": "~6.6.0",
     "tslib": "^2.0.0",

src/KafkaFlow.Admin.Dashboard/ClientApp/src/app/api-interceptor.service.ts

@@ -0,0 +1,39 @@
+import {
+  HttpEvent,
+  HttpInterceptor,
+  HttpHandler,
+  HttpRequest,
+  HttpErrorResponse
+} from '@angular/common/http';
+import {Observable, throwError} from 'rxjs';
+import {retry, catchError} from 'rxjs/operators';
+import {CookieService} from 'ngx-cookie-service';
+import {Injectable} from '@angular/core';
+
+@Injectable()
+export class ApiInterceptor implements HttpInterceptor {
+  constructor( private cookieService: CookieService ) { }
+
+  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    request = request.clone({
+      setHeaders: this.cookieService.getAll()
+    });
+    return next.handle(request)
+      .pipe(
+        retry(1),
+        catchError((error: HttpErrorResponse) => {
+          let errorMessage = '';
+          if (error.error instanceof ErrorEvent) {
+            // client-side error
+            errorMessage = `Error: ${error.error.message}`;
+          } else {
+            // server-side error
+            errorMessage = `Error Code: ${error.status}\nMessage: ${error.message}`;
+          }
+          // window.alert(errorMessage);
+          console.error(errorMessage);
+          return throwError(errorMessage);
+        })
+      );
+  }
+}

src/KafkaFlow.Admin.Dashboard/ClientApp/src/app/app.module.ts

@@ -3,12 +3,13 @@ import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { FormsModule } from '@angular/forms';
 import { NgxMaskModule, IConfig } from 'ngx-mask';
+import { CookieService } from 'ngx-cookie-service';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 import { HomeComponent } from './home/home.component';
 import { ConsumerComponent } from './consumer/consumer.component';
-import { HttpErrorInterceptor } from './http-error.interceptor';
+import { ApiInterceptor } from './api-interceptor.service';
 import { GroupByPipe } from './group-by.pipe';
 import { SortPipe } from './sort.pipe';
 
@@ -58,16 +59,17 @@ const appRoutes: Routes = [
   ],
   exports: [RouterModule],
   providers: [
+    CookieService,
     ConsumersService,
     {
       provide: HTTP_INTERCEPTORS,
-      useClass: HttpErrorInterceptor,
+      useClass: ApiInterceptor,
       multi: true
     },
     TelemetryService,
     {
       provide: HTTP_INTERCEPTORS,
-      useClass: HttpErrorInterceptor,
+      useClass: ApiInterceptor,
       multi: true
     }],
   bootstrap: [AppComponent]

src/KafkaFlow.Admin.Dashboard/DashboardConfiguration.cs

@@ -0,0 +1,21 @@
+namespace KafkaFlow.Admin.Dashboard
+{
+    using System;
+    using System.Collections.Generic;
+    using Microsoft.AspNetCore.Builder;
+
+    internal class DashboardConfiguration
+    {
+        private readonly List<Type> middlewares;
+
+        public DashboardConfiguration(List<Type> middlewares, Action<IEndpointConventionBuilder> endpointHandler)
+        {
+            this.middlewares = middlewares;
+            this.EndpointHandler = endpointHandler;
+        }
+
+        public IReadOnlyCollection<Type> Middlewares => this.middlewares.AsReadOnly();
+
+        public Action<IEndpointConventionBuilder> EndpointHandler { get; }
+    }
+}

src/KafkaFlow.Admin.Dashboard/DashboardConfigurationBuilder.cs

@@ -0,0 +1,29 @@
+namespace KafkaFlow.Admin.Dashboard
+{
+    using System;
+    using System.Collections.Generic;
+    using Microsoft.AspNetCore.Builder;
+
+    internal class DashboardConfigurationBuilder : IDashboardConfigurationBuilder
+    {
+        private readonly List<Type> middlewares = new();
+        private Action<IEndpointConventionBuilder> endpointHandler = _ => { };
+
+        public IDashboardConfigurationBuilder UseMiddleware<T>()
+        {
+            this.middlewares.Add(typeof(T));
+            return this;
+        }
+
+        public IDashboardConfigurationBuilder ConfigureEndpoint(Action<IEndpointConventionBuilder> endpointHandler)
+        {
+            this.endpointHandler = endpointHandler;
+            return this;
+        }
+
+        public DashboardConfiguration Build()
+        {
+            return new(this.middlewares, this.endpointHandler);
+        }
+    }
+}

src/KafkaFlow.Admin.Dashboard/IDashboardConfigurationBuilder.cs

@@ -0,0 +1,24 @@
+namespace KafkaFlow.Admin.Dashboard
+{
+    using System;
+    using Microsoft.AspNetCore.Builder;
+
+    /// <summary>
+    /// Used to build the dashboard configuration
+    /// </summary>
+    public interface IDashboardConfigurationBuilder
+    {
+        /// <summary>
+        /// Adds a middleware type to the dashboard's request pipeline.
+        /// </summary>
+        /// <returns>The <see cref="IDashboardConfigurationBuilder"/> instance.</returns>
+        IDashboardConfigurationBuilder UseMiddleware<T>();
+
+        /// <summary>
+        /// Use this method to configure the dashboard endpoint pipeline.
+        /// </summary>
+        /// <param name="endpointHandler">A handler to configure the endpoint</param>
+        /// <returns>The <see cref="IDashboardConfigurationBuilder"/> instance.</returns>
+        IDashboardConfigurationBuilder ConfigureEndpoint(Action<IEndpointConventionBuilder> endpointHandler);
+    }
+}