Remove config.json, install @ngx-env/builder to load OIDC configuration from env variables/files

frontend/src/app/config.service.spec.ts

@@ -1,23 +1,17 @@
 import { TestBed } from '@angular/core/testing';
-import { HttpClient } from '@angular/common/http';
 import { ConfigService } from './config.service';
-import { of, throwError } from 'rxjs';
 import { vi } from 'vitest';
 
 describe('ConfigService', () => {
   let service: ConfigService;
-  let mockHttpClient: any;
 
   beforeEach(() => {
-    mockHttpClient = {
-      get: () => of({ oidcIssuer: 'http://custom-issuer', clientId: 'custom-client' })
-    };
+    // Reset env variables before each test
+    vi.stubEnv('OIDC_ISSUER_URI', '');
+    vi.stubEnv('OIDC_CLIENT_ID', '');
 
     TestBed.configureTestingModule({
-      providers: [
-        ConfigService,
-        { provide: HttpClient, useValue: mockHttpClient }
-      ]
+      providers: [ConfigService]
     });
 
     service = TestBed.inject(ConfigService);
@@ -27,22 +21,20 @@ describe('ConfigService', () => {
     expect(service).toBeTruthy();
   });
 
-  it('should load config successfully', async () => {
-    await service.loadConfig();
-    expect(service.oidcIssuer).toBe('http://custom-issuer');
-    expect(service.clientId).toBe('custom-client');
-  });
-
-  it('should use default values on load error', async () => {
-    mockHttpClient.get = () => throwError(() => new Error('Load failed'));
-    
-    // Silence warning log
-    const warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
-
-    await service.loadConfig();
+  it('should return default values when env variables are not set', () => {
     expect(service.oidcIssuer).toBe('http://localhost:8090/realms/voidAuth');
     expect(service.clientId).toBe('lmnp-client');
+  });
 
-    warnSpy.mockRestore();
+  it('should return env values when env variables are set', () => {
+    vi.stubEnv('OIDC_ISSUER_URI', 'http://env-issuer');
+    vi.stubEnv('OIDC_CLIENT_ID', 'env-client');
+
+    expect(service.oidcIssuer).toBe('http://env-issuer');
+    expect(service.clientId).toBe('env-client');
+  });
+
+  it('should resolve loadConfig successfully', async () => {
+    await expect(service.loadConfig()).resolves.toBeUndefined();
   });
 });

frontend/src/app/config.service.ts

@@ -1,31 +1,18 @@
-import { Injectable, inject } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
-import { lastValueFrom } from 'rxjs';
+import { Injectable } from '@angular/core';
 
 @Injectable({
   providedIn: 'root'
 })
 export class ConfigService {
-  private config: Record<string, string> | null = null;
-  private readonly http = inject(HttpClient);
-
   async loadConfig(): Promise<void> {
-    try {
-      this.config = await lastValueFrom(this.http.get('/config.json')) as Record<string, string>;
-    } catch (e) {
-      console.warn('Could not load /config.json, using default dev values', e);
-      this.config = {
-        oidcIssuer: 'http://localhost:8090/realms/voidAuth',
-        clientId: 'lmnp-client'
-      };
-    }
+    return Promise.resolve();
   }
 
   get oidcIssuer(): string {
-    return this.config ? this.config['oidcIssuer'] : 'http://localhost:8090/realms/voidAuth';
+    return import.meta.env['OIDC_ISSUER_URI'] || 'http://localhost:8090/realms/voidAuth';
   }
 
   get clientId(): string {
-    return this.config ? this.config['clientId'] : 'lmnp-client';
+    return import.meta.env['OIDC_CLIENT_ID'] || 'lmnp-client';
   }
 }

frontend/src/env.d.ts

@@ -0,0 +1,22 @@
+// Define the type of the environment variables.
+declare interface Env {
+  readonly NODE_ENV: string;
+  readonly OIDC_ISSUER_URI?: string;
+  readonly OIDC_CLIENT_ID?: string;
+  [key: string]: string | undefined;
+}
+
+// Choose how to access the environment variables.
+// Remove the unused options.
+
+// 1. Use import.meta.env.YOUR_ENV_VAR in your code. (conventional)
+declare interface ImportMeta {
+  readonly env: Env;
+}
+
+// 2. Use _NGX_ENV_.YOUR_ENV_VAR in your code. (customizable)
+// You can modify the name of the variable in angular.json.
+// ngxEnv: {
+//  define: '_NGX_ENV_',
+// }
+declare const _NGX_ENV_: Env;

frontend/src/styles.css

@@ -1 +1,4 @@
 /* You can add global styles to this file, and also import other style files */
+body {
+    margin: 0;
+}