refs #1690 Add ConfigService integration to EnvVars and Roles components and fixed tests.

ogWebconsole/src/app/components/admin/env-vars/env-vars.component.spec.ts

@@ -13,12 +13,17 @@ import { TranslateModule } from '@ngx-translate/core';
 import { ToastrModule, ToastrService } from 'ngx-toastr';
 import { DataService } from '../users/users/data.service';
 import { MatTableModule } from '@angular/material/table';
+import { ConfigService } from '../../../services/config.service';
 
 describe('EnvVarsComponent', () => {
   let component: EnvVarsComponent;
   let fixture: ComponentFixture<EnvVarsComponent>;
 
   beforeEach(async () => {
+    const mockConfigService = {
+      apiUrl: 'http://mock-api-url'
+    };
+
     await TestBed.configureTestingModule({
       declarations: [EnvVarsComponent],
       imports: [
@@ -47,6 +52,10 @@ describe('EnvVarsComponent', () => {
         {
           provide: MAT_DIALOG_DATA,
           useValue: {}
+        },
+        {
+          provide: ConfigService,
+          useValue: mockConfigService
         }
       ]
     }).compileComponents();

ogWebconsole/src/app/components/admin/env-vars/env-vars.component.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
 import { HttpClient } from "@angular/common/http";
 import { ToastrService } from "ngx-toastr";
+import { ConfigService } from "../../../services/config.service";
 
 @Component({
   selector: 'app-env-vars',
@@ -11,13 +12,15 @@ export class EnvVarsComponent {
   baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
   envVars: { name: string; value: string }[] = [];
   displayedColumns: string[] = ['name', 'value'];
-
+  private apiUrl: string;
-  private apiUrl = `${this.baseUrl}/env-vars`;
 
   constructor(
     private http: HttpClient,
     private toastService: ToastrService,
-  ) {}
+    private configService: ConfigService
+  ) {
+    this.apiUrl = `${this.configService.apiUrl}/env-vars`;
+  }
 
   ngOnInit(): void {
     this.loadEnvVars();

ogWebconsole/src/app/components/admin/roles/roles/roles.component.spec.ts

@@ -4,7 +4,7 @@ import { MatDialog } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
 import { DataService } from './data.service';
-import { of } from 'rxjs';
+import { ConfigService } from '../../../../services/config.service';
 import { MatDivider } from '@angular/material/divider';
 import { MatFormField } from '@angular/material/form-field';
 import { MatLabel } from '@angular/material/form-field';
@@ -20,12 +20,14 @@ describe('RolesComponent', () => {
   let mockHttpClient: jasmine.SpyObj<HttpClient>;
   let mockToastrService: jasmine.SpyObj<ToastrService>;
   let mockDataService: jasmine.SpyObj<DataService>;
+  let mockConfigService: jasmine.SpyObj<ConfigService>;
 
   beforeEach(async () => {
     const matDialogSpy = jasmine.createSpyObj('MatDialog', ['open']);
     const httpClientSpy = jasmine.createSpyObj('HttpClient', ['get', 'post', 'put', 'delete']);
     const toastrServiceSpy = jasmine.createSpyObj('ToastrService', ['success', 'error']);
     const dataServiceSpy = jasmine.createSpyObj('DataService', ['getRoles']);
+    const configServiceSpy = jasmine.createSpyObj('ConfigService', [], { apiUrl: 'http://mock-api-url' });
 
     await TestBed.configureTestingModule({
       declarations: [RolesComponent, LoadingComponent],
@@ -35,7 +37,8 @@ describe('RolesComponent', () => {
         { provide: MatDialog, useValue: matDialogSpy },
         { provide: HttpClient, useValue: httpClientSpy },
         { provide: ToastrService, useValue: toastrServiceSpy },
-        { provide: DataService, useValue: dataServiceSpy }
+        { provide: DataService, useValue: dataServiceSpy },
+        { provide: ConfigService, useValue: configServiceSpy }
       ]
     }).compileComponents();
   });
@@ -47,6 +50,7 @@ describe('RolesComponent', () => {
     mockHttpClient = TestBed.inject(HttpClient) as jasmine.SpyObj<HttpClient>;
     mockToastrService = TestBed.inject(ToastrService) as jasmine.SpyObj<ToastrService>;
     mockDataService = TestBed.inject(DataService) as jasmine.SpyObj<DataService>;
+    mockConfigService = TestBed.inject(ConfigService) as jasmine.SpyObj<ConfigService>;
   });
 
   it('should create', () => {

ogWebconsole/src/app/components/admin/roles/roles/roles.component.ts

@@ -7,6 +7,7 @@ import { DataService } from "./data.service";
 import { PageEvent } from "@angular/material/paginator";
 import { DeleteModalComponent } from '../../../../shared/delete_modal/delete-modal/delete-modal.component';
 import { AddRoleModalComponent } from './add-role-modal/add-role-modal.component';
+import { ConfigService } from '../../../../services/config.service';
 
 @Component({
   selector: 'app-roles',
@@ -14,7 +15,7 @@ import { AddRoleModalComponent } from './add-role-modal/add-role-modal.component
   styleUrls: ['./roles.component.css']
 })
 export class RolesComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string = this.configService.apiUrl;
   dataSource = new MatTableDataSource<any>();
   filters: { [key: string]: string } = {};
   loading: boolean = false;
@@ -48,7 +49,8 @@ export class RolesComponent implements OnInit {
     public dialog: MatDialog,
     private http: HttpClient,
     private dataService: DataService,
-    private toastService: ToastrService
+    private toastService: ToastrService,
+    private configService: ConfigService
   ) {}
 
   ngOnInit() {

ogWebconsole/src/app/components/repositories/convert-image/convert-image.component.spec.ts

@@ -1,5 +1,11 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { ToastrModule } from 'ngx-toastr';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { FormsModule } from '@angular/forms'; 
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
 import { ConvertImageComponent } from './convert-image.component';
 
 describe('ConvertImageComponent', () => {
@@ -8,7 +14,20 @@ describe('ConvertImageComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [ConvertImageComponent]
+      declarations: [ConvertImageComponent],
+      imports: [
+        HttpClientTestingModule,
+        MatDialogModule,
+        ToastrModule.forRoot(),
+        MatFormFieldModule,
+        MatInputModule,
+        FormsModule,
+        BrowserAnimationsModule 
+      ],
+      providers: [
+        { provide: MatDialogRef, useValue: {} },
+        { provide: MAT_DIALOG_DATA, useValue: {} }
+      ]
     })
     .compileComponents();
 

ogWebconsole/src/app/components/repositories/import-image/import-image.component.spec.ts

@@ -1,9 +1,8 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { ImportImageComponent } from './import-image.component';
-import {FormBuilder, ReactiveFormsModule} from "@angular/forms";
+import { FormBuilder, FormsModule, ReactiveFormsModule } from "@angular/forms";
 import { ToastrModule, ToastrService } from "ngx-toastr";
-import {DataService} from "../../calendar/data.service";
 import { provideHttpClient } from "@angular/common/http";
 import { provideHttpClientTesting } from "@angular/common/http/testing";
 import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from "@angular/material/dialog";
@@ -22,6 +21,7 @@ describe('ImportImageComponent', () => {
     await TestBed.configureTestingModule({
       declarations: [ImportImageComponent],
       imports: [
+        FormsModule,
         ReactiveFormsModule,
         MatDialogModule,
         MatFormFieldModule,