refs #1690 Add mercureUrl to config and refactor services to use ConfigService for API URLs

ogWebconsole/.env

@@ -1,2 +1,2 @@
-NG_APP_BASE_API_URL=https://127.0.0.1:8443
-NG_APP_OGCORE_MERCURE_BASE_URL=http://localhost:3000/.well-known/mercure
+# NG_APP_BASE_API_URL=https://127.0.0.1:8443
+# NG_APP_OGCORE_MERCURE_BASE_URL=http://localhost:3000/.well-known/mercure

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

@@ -13,7 +13,7 @@ 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';
+import { ConfigService } from '@services/config.service';
 
 describe('EnvVarsComponent', () => {
   let component: EnvVarsComponent;

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

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
 import { HttpClient } from "@angular/common/http";
 import { ToastrService } from "ngx-toastr";
-import { ConfigService } from "../../../services/config.service";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-env-vars',
@@ -9,7 +9,6 @@ import { ConfigService } from "../../../services/config.service";
   styleUrl: './env-vars.component.css'
 })
 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;

ogWebconsole/src/app/components/admin/roles/roles/add-role-modal/add-role-modal.component.ts

@@ -4,6 +4,7 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {DataService} from "../data.service";
 import {ToastrService} from "ngx-toastr";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-add-role-modal',
@@ -11,9 +12,9 @@ import {ToastrService} from "ngx-toastr";
   styleUrls: ['./add-role-modal.component.css']
 })
 export class AddRoleModalComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
   roleForm: FormGroup<any>;
   roleId: string | null = null;
+  baseUrl: string;
 
   constructor(
     public dialogRef: MatDialogRef<AddRoleModalComponent>,
@@ -21,8 +22,10 @@ export class AddRoleModalComponent {
     private http: HttpClient,
     private fb: FormBuilder,
     private dataService: DataService,
-    private toastService: ToastrService
+    private toastService: ToastrService,
+    private configService: ConfigService
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.roleForm = this.fb.group({
       name: ['', Validators.required],
       superAdmin: [false],

ogWebconsole/src/app/components/admin/roles/roles/data.service.ts

@@ -2,15 +2,19 @@ import { Injectable } from '@angular/core';
 import {HttpClient, HttpParams} from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/user-groups?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/user-groups?page=1&itemsPerPage=1000`;
+  }
 
   getUserGroups(filters: { [key: string]: string }): Observable<{ totalItems: any; data: any }> {
     const params = new HttpParams({ fromObject: filters });

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 { ConfigService } from '../../../../services/config.service';
+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';

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

@@ -7,7 +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';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-roles',

ogWebconsole/src/app/components/admin/users/users/add-user-modal/add-user-modal.component.ts

@@ -4,6 +4,7 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { ToastrService } from "ngx-toastr";
 import { HttpClient } from "@angular/common/http";
 import { DataService } from "../data.service";
+import { ConfigService } from '@services/config.service';
 
 interface UserGroup {
   '@id': string;
@@ -17,7 +18,7 @@ interface UserGroup {
   styleUrls: ['./add-user-modal.component.css']
 })
 export class AddUserModalComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   @Output() userAdded = new EventEmitter<void>();
   @Output() userEdited = new EventEmitter<void>();
   userForm: FormGroup<any>;
@@ -38,8 +39,10 @@ export class AddUserModalComponent implements OnInit {
     private http: HttpClient,
     private fb: FormBuilder,
     private dataService: DataService,
-    private toastService: ToastrService
+    private toastService: ToastrService,
+    private configService: ConfigService
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.userForm = this.fb.group({
       username: ['', Validators.required],
       password: ['', Validators.required],

ogWebconsole/src/app/components/admin/users/users/data.service.ts

@@ -3,15 +3,19 @@ import { Injectable } from '@angular/core';
 import {HttpClient, HttpParams} from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/users?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/users?page=1&itemsPerPage=1000`;
+  }
 
   getUsers(filters: { [key: string]: string }): Observable<{ totalItems: any; data: any }> {
     const params = new HttpParams({ fromObject: filters });

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

@@ -5,7 +5,7 @@ import { AddUserModalComponent } from './add-user-modal/add-user-modal.component
 import { DeleteModalComponent } from '../../../../shared/delete_modal/delete-modal/delete-modal.component';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
-import { DataService } from "./data.service";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-users',
@@ -13,7 +13,8 @@ import { DataService } from "./data.service";
   styleUrls: ['./users.component.css']
 })
 export class UsersComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   filters: { [key: string]: string } = {};
   loading: boolean = false;
@@ -50,14 +51,15 @@ export class UsersComponent implements OnInit {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/users`;
-
   constructor(
     public dialog: MatDialog,
+    private configService: ConfigService,
     private http: HttpClient,
-    private dataService: DataService,
     private toastService: ToastrService
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/users`;
+  }
 
   ngOnInit() {
     this.search();

ogWebconsole/src/app/components/calendar/calendar.component.ts

@@ -9,6 +9,7 @@ import { PageEvent } from "@angular/material/paginator";
 import { CreateCalendarComponent } from "./create-calendar/create-calendar.component";
 import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-calendar',
@@ -16,7 +17,8 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrl: './calendar.component.css'
 })
 export class CalendarComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   images: { downloadUrl: string; name: string; uuid: string }[] = [];
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
@@ -52,15 +54,18 @@ export class CalendarComponent implements OnInit {
     }
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
-  private apiUrl = `${this.baseUrl}/remote-calendars`;
 
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private dataService: DataService,
     private toastService: ToastrService,
+    private configService: ConfigService,
     private joyrideService: JoyrideService
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/remote-calendars`;
+  }
 
   ngOnInit(): void {
     this.search();
@@ -165,7 +170,7 @@ export class CalendarComponent implements OnInit {
     this.joyrideService.startTour({
       steps: ['titleStep', 'addButtonStep', 'searchStep', 'tableStep', 'actionsStep'],
       showPrevButton: true,
-      themeColor: '#3f51b5' 
+      themeColor: '#3f51b5'
     });
   }
 }

ogWebconsole/src/app/components/calendar/create-calendar-rule/create-calendar-rule.component.ts

@@ -1,7 +1,8 @@
-import {Component, Inject} from '@angular/core';
-import {ToastrService} from "ngx-toastr";
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+import { Component, Inject } from '@angular/core';
+import { ToastrService } from "ngx-toastr";
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-calendar-rule',
@@ -9,7 +10,7 @@ import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
   styleUrl: './create-calendar-rule.component.css'
 })
 export class CreateCalendarRuleComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   name: string = '';
   remoteCalendarRules: any[] = [];
   weekDays: string[] = ['Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado', 'Domingo'];
@@ -29,20 +30,23 @@ export class CreateCalendarRuleComponent {
   constructor(
     private toastService: ToastrService,
     private http: HttpClient,
+    private configService: ConfigService,
     public dialogRef: MatDialogRef<CreateCalendarRuleComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any,
-) { }
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.calendarId = this.data.calendar
     if (this.data) {
       this.isEditMode = true;
-      this.availableFromDate = this.data.rule? this.data.rule.availableFromDate : null;
-      this.availableToDate = this.data.rule? this.data.rule.availableToDate : null;
-      this.isRemoteAvailable = this.data.rule? this.data.rule.isRemoteAvailable : false;
-      this.availableReason = this.data.rule? this.data.rule.availableReason : null;
-      this.busyFromHour = this.data.rule? this.data.rule.busyFromHour : null;
-      this.busyToHour = this.data.rule? this.data.rule.busyToHour : null;
+      this.availableFromDate = this.data.rule ? this.data.rule.availableFromDate : null;
+      this.availableToDate = this.data.rule ? this.data.rule.availableToDate : null;
+      this.isRemoteAvailable = this.data.rule ? this.data.rule.isRemoteAvailable : false;
+      this.availableReason = this.data.rule ? this.data.rule.availableReason : null;
+      this.busyFromHour = this.data.rule ? this.data.rule.busyFromHour : null;
+      this.busyToHour = this.data.rule ? this.data.rule.busyToHour : null;
       if (this.data.rule && this.data.rule.busyWeekDays) {
         this.busyWeekDays = this.data.rule.busyWeekDays.reduce((acc: {
           [x: string]: boolean;

ogWebconsole/src/app/components/calendar/create-calendar/create-calendar.component.ts

@@ -1,10 +1,11 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {ToastrService} from "ngx-toastr";
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from "@angular/material/dialog";
-import {CreateCalendarRuleComponent} from "../create-calendar-rule/create-calendar-rule.component";
-import {DataService} from "../data.service";
-import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { Component, Inject, OnInit } from '@angular/core';
+import { ToastrService } from "ngx-toastr";
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from "@angular/material/dialog";
+import { CreateCalendarRuleComponent } from "../create-calendar-rule/create-calendar-rule.component";
+import { DataService } from "../data.service";
+import { DeleteModalComponent } from "../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-calendar',
@@ -12,7 +13,7 @@ import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/de
   styleUrl: './create-calendar.component.css'
 })
 export class CreateCalendarComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   name: string = '';
   remoteCalendarRules: any[] = [];
   isEditMode: boolean = false;
@@ -22,11 +23,14 @@ export class CreateCalendarComponent implements OnInit {
   constructor(
     private toastService: ToastrService,
     private http: HttpClient,
+    private configService: ConfigService,
     public dialogRef: MatDialogRef<CreateCalendarComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any,
     public dialog: MatDialog,
     private dataService: DataService,
-  ) { }
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     if (this.data) {

ogWebconsole/src/app/components/calendar/data.service.ts

@@ -1,16 +1,20 @@
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/remote-calendars?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/remote-calendars?page=1&itemsPerPage=1000`;
+  }
 
   getRemoteCalendars(filters: { [key: string]: string }): Observable<any[]> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.ts

@@ -8,6 +8,7 @@ import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/
 import { MatTableDataSource } from "@angular/material/table";
 import { DatePipe } from "@angular/common";
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-commands-groups',
@@ -15,7 +16,8 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrls: ['./commands-groups.component.css']
 })
 export class CommandsGroupsComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   filters: { [key: string]: string | boolean } = {};
   length: number = 0;
@@ -47,10 +49,12 @@ export class CommandsGroupsComponent implements OnInit {
     }
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
-  private apiUrl = `${this.baseUrl}/command-groups`;
 
-  constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService, 
-    private joyrideService: JoyrideService) {}
+  constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService,
+    private configService: ConfigService, private joyrideService: JoyrideService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/command-groups`;
+  }
 
   ngOnInit(): void {
     this.search();
@@ -120,17 +124,17 @@ export class CommandsGroupsComponent implements OnInit {
   iniciarTour(): void {
     this.joyrideService.startTour({
       steps: [
-      'titleStep',
-      'addCommandGroupStep',
-      'searchStep',
-      'tableStep',
-      'viewCommandsStep',
-      'actionsStep',
-      'paginationStep'
+        'titleStep',
+        'addCommandGroupStep',
+        'searchStep',
+        'tableStep',
+        'viewCommandsStep',
+        'actionsStep',
+        'paginationStep'
       ],
       showPrevButton: true,
       themeColor: '#3f51b5'
     });
   }
-  
+
 }

ogWebconsole/src/app/components/commands/commands-groups/create-command-group/create-command-group.component.ts

@@ -3,6 +3,7 @@ import { HttpClient } from '@angular/common/http';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { ToastrService } from 'ngx-toastr';
 import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-command-group',
@@ -10,21 +11,25 @@ import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
   styleUrls: ['./create-command-group.component.css']
 })
 export class CreateCommandGroupComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   availableCommands: any[] = [];
   selectedCommands: any[] = [];
   groupName: string = '';
   enabled: boolean = true;
   editing: boolean = false;
   loading: boolean = false;
-  private apiUrl = `${this.baseUrl}/commands`;
+  private apiUrl: string;
 
   constructor(
     private http: HttpClient,
     private dialogRef: MatDialogRef<CreateCommandGroupComponent>,
     private toastService: ToastrService,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: any
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/commands`;
+  }
 
   ngOnInit(): void {
     this.loadAvailableCommands();

ogWebconsole/src/app/components/commands/commands-groups/detail-command-group/detail-command-group.component.ts

@@ -3,6 +3,7 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-detail-command-group',
@@ -10,7 +11,7 @@ import { ToastrService } from 'ngx-toastr';
   styleUrls: ['./detail-command-group.component.css']
 })
 export class DetailCommandGroupComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   form!: FormGroup;
   clients: any[] = [];
   showClientSelect = false;
@@ -21,9 +22,12 @@ export class DetailCommandGroupComponent implements OnInit {
     @Inject(MAT_DIALOG_DATA) public data: any,
     private dialogRef: MatDialogRef<DetailCommandGroupComponent>,
     private fb: FormBuilder,
+    private configService: ConfigService,
     private http: HttpClient,
     private toastService: ToastrService
-  ) { }
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.form = this.fb.group({

ogWebconsole/src/app/components/commands/commands-task/commands-task.component.ts

@@ -6,6 +6,7 @@ import { CreateTaskComponent } from './create-task/create-task.component';
 import { DetailTaskComponent } from './detail-task/detail-task.component';
 import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component';
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-commands-task',
@@ -13,7 +14,7 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrls: ['./commands-task.component.css']
 })
 export class CommandsTaskComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   tasks: any[] = [];
   filters: { [key: string]: string | boolean } = {};
   length: number = 0;
@@ -22,10 +23,14 @@ export class CommandsTaskComponent implements OnInit {
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
   displayedColumns: string[] = ['taskid', 'notes', 'name', 'scheduledDate', 'enabled', 'actions'];
   loading: boolean = false;
-  private apiUrl = `${this.baseUrl}/command-tasks`;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService, 
-    private joyrideService: JoyrideService) {}
+  constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService,
+    private configService: ConfigService,
+    private joyrideService: JoyrideService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/command-tasks`;
+  }
 
   ngOnInit(): void {
     this.loadTasks();
@@ -110,5 +115,5 @@ export class CommandsTaskComponent implements OnInit {
       themeColor: '#3f51b5'
     });
   }
-  
+
 }

ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.ts

@@ -3,6 +3,7 @@ import { HttpClient } from '@angular/common/http';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { ToastrService } from 'ngx-toastr';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-task',
@@ -10,12 +11,12 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
   styleUrls: ['./create-task.component.css']
 })
 export class CreateTaskComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   taskForm: FormGroup;
   availableCommandGroups: any[] = [];
   selectedGroupCommands: any[] = [];
   availableIndividualCommands: any[] = [];
-  apiUrl = `${this.baseUrl}/command-tasks`;
+  apiUrl: string;
   editing: boolean = false;
   availableOrganizationalUnits: any[] = [];
   selectedUnitChildren: any[] = [];
@@ -25,10 +26,13 @@ export class CreateTaskComponent implements OnInit {
   constructor(
     private fb: FormBuilder,
     private http: HttpClient,
+    private configService: ConfigService,
     private toastr: ToastrService,
     public dialogRef: MatDialogRef<CreateTaskComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/command-tasks`;
     this.taskForm = this.fb.group({
       commandGroup: ['', Validators.required],
       extraCommands: [[]],

ogWebconsole/src/app/components/commands/commands-task/task-logs/task-logs.component.ts

@@ -1,4 +1,4 @@
-import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable, forkJoin } from 'rxjs';
 import { FormControl } from '@angular/forms';
@@ -7,9 +7,10 @@ import { DatePipe } from '@angular/common';
 import { JoyrideService } from 'ngx-joyride';
 import { MatDialog } from "@angular/material/dialog";
 import { InputDialogComponent } from "./input-dialog/input-dialog.component";
-import { ProgressBarMode, MatProgressBarModule } from '@angular/material/progress-bar';
-import {DeleteModalComponent} from "../../../../shared/delete_modal/delete-modal/delete-modal.component";
-import {ToastrService} from "ngx-toastr";
+import { ProgressBarMode } from '@angular/material/progress-bar';
+import { DeleteModalComponent } from "../../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { ToastrService } from "ngx-toastr";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-task-logs',
@@ -17,8 +18,8 @@ import {ToastrService} from "ngx-toastr";
   styleUrls: ['./task-logs.component.css']
 })
 export class TaskLogsComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  mercureUrl: string = import.meta.env.NG_APP_OGCORE_MERCURE_BASE_URL;
+  baseUrl: string;
+  mercureUrl: string;
   traces: any[] = [];
   groupedTraces: any[] = [];
   commands: any[] = [];
@@ -89,11 +90,15 @@ export class TaskLogsComponent implements OnInit {
   commandControl = new FormControl();
 
   constructor(private http: HttpClient,
-              private joyrideService: JoyrideService,
-              private dialog: MatDialog,
-              private cdr: ChangeDetectorRef,
-              private toastService: ToastrService
-  ) { }
+    private joyrideService: JoyrideService,
+    private dialog: MatDialog,
+    private cdr: ChangeDetectorRef,
+    private configService: ConfigService,
+    private toastService: ToastrService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.mercureUrl = this.configService.mercureUrl;
+  }
 
   ngOnInit(): void {
     this.loadTraces();

ogWebconsole/src/app/components/commands/main-commands/commands.component.ts

@@ -7,7 +7,7 @@ import { CreateCommandComponent } from './create-command/create-command.componen
 import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component';
 import { MatTableDataSource } from '@angular/material/table';
 import { DatePipe } from '@angular/common';
-import { ExecuteCommandComponent } from './execute-command/execute-command.component';
+import { ConfigService } from '@services/config.service';
 import { JoyrideService } from 'ngx-joyride';
 
 @Component({
@@ -16,7 +16,8 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrls: ['./commands.component.css']
 })
 export class CommandsComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   filters: { [key: string]: string | boolean } = {};
   length: number = 0;
@@ -48,10 +49,12 @@ export class CommandsComponent implements OnInit {
     }
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
-  private apiUrl = `${this.baseUrl}/commands`;
 
   constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService,
-    private joyrideService: JoyrideService) {}
+    private joyrideService: JoyrideService, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/commands`;
+  }
 
   ngOnInit(): void {
     this.search();

ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.ts

@@ -3,7 +3,8 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
-import {DataService} from "../data.service";
+import { DataService } from "../data.service";
+import { ConfigService } from "@services/config.service";
 
 @Component({
   selector: 'app-create-command',
@@ -11,9 +12,8 @@ import {DataService} from "../data.service";
   styleUrls: ['./create-command.component.css']
 })
 export class CreateCommandComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   createCommandForm: FormGroup<any>;
-  private apiUrl = `${this.baseUrl}/commands`;
   commandId: string | null = null;
 
   constructor(
@@ -21,9 +21,11 @@ export class CreateCommandComponent {
     private http: HttpClient,
     public dialogRef: MatDialogRef<CreateCommandComponent>,
     private toastService: ToastrService,
+    private configService: ConfigService,
     private dataService: DataService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.createCommandForm = this.fb.group({
       name: ['', Validators.required],
       script: [''],

ogWebconsole/src/app/components/commands/main-commands/data.service.ts

@@ -1,6 +1,6 @@
-
+import { ConfigService } from '@services/config.service';
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
 
@@ -8,10 +8,16 @@ import { catchError, map } from 'rxjs/operators';
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/commands?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(
+    private http: HttpClient,
+    private configService: ConfigService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/commands?page=1&itemsPerPage=1000`;
+  }
 
   getCommands(filters: { [key: string]: string }): Observable<{ totalItems: any; data: any }> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.ts

@@ -4,6 +4,7 @@ import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dial
 import { CreateCommandComponent } from '../create-command/create-command.component';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-command-detail',
@@ -11,7 +12,7 @@ import { ToastrService } from 'ngx-toastr';
   styleUrls: ['./command-detail.component.css']
 })
 export class CommandDetailComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   form!: FormGroup;
   clients: any[] = [];
   showClientSelect = false;
@@ -20,12 +21,15 @@ export class CommandDetailComponent implements OnInit {
 
   constructor(
     private fb: FormBuilder,
+    private configService: ConfigService,
     private http: HttpClient,
     public dialogRef: MatDialogRef<CommandDetailComponent>,
     private dialog: MatDialog,
     private toastService: ToastrService,
     @Inject(MAT_DIALOG_DATA) public data: any
-  ) { }
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.form = this.fb.group({
@@ -52,7 +56,7 @@ export class CommandDetailComponent implements OnInit {
 
     dialogRef.afterClosed().subscribe(result => {
       if (result) {
-        this.toastService.success('Comando editado' );
+        this.toastService.success('Comando editado');
         this.data.command = result;
       }
     });

ogWebconsole/src/app/components/commands/main-commands/execute-command/execute-command.component.ts

@@ -1,9 +1,8 @@
-import {Component, Inject, Input, OnInit, SimpleChanges} from '@angular/core';
-import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from '@angular/material/dialog';
+import { Component, Input, OnInit } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { FormBuilder, FormGroup } from '@angular/forms';
-import {Router} from "@angular/router";
-import {ToastrService} from "ngx-toastr";
+import { Router } from "@angular/router";
+import { ToastrService } from "ngx-toastr";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-execute-command',
@@ -16,32 +15,32 @@ export class ExecuteCommandComponent implements OnInit {
   @Input() buttonText: string = 'Ejecutar Comandos';
   @Input() icon: string = 'terminal';
   @Input() disabled: boolean = false;
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   loading: boolean = true;
 
   arrayCommands: any[] = [
-    {name: 'Enceder', slug: 'power-on', disabled: false},
-    {name: 'Apagar', slug: 'power-off', disabled: false},
-    {name: 'Reiniciar', slug: 'reboot', disabled: false},
-    {name: 'Iniciar Sesión', slug: 'login', disabled: true},
-    {name: 'Crear imagen', slug: 'create-image', disabled: false},
-    {name: 'Clonar/desplegar imagen', slug: 'deploy-image', disabled: false},
-    {name: 'Eliminar Imagen Cache', slug: 'delete-image-cache', disabled: true},
-    {name: 'Particionar y Formatear', slug: 'partition', disabled: false},
-    {name: 'Inventario Software', slug: 'software-inventory', disabled: true},
-    {name: 'Inventario Hardware', slug: 'hardware-inventory', disabled: true},
-    {name: 'Ejecutar script', slug: 'run-script', disabled: true},
+    { name: 'Enceder', slug: 'power-on', disabled: false },
+    { name: 'Apagar', slug: 'power-off', disabled: false },
+    { name: 'Reiniciar', slug: 'reboot', disabled: false },
+    { name: 'Iniciar Sesión', slug: 'login', disabled: true },
+    { name: 'Crear imagen', slug: 'create-image', disabled: false },
+    { name: 'Clonar/desplegar imagen', slug: 'deploy-image', disabled: false },
+    { name: 'Eliminar Imagen Cache', slug: 'delete-image-cache', disabled: true },
+    { name: 'Particionar y Formatear', slug: 'partition', disabled: false },
+    { name: 'Inventario Software', slug: 'software-inventory', disabled: true },
+    { name: 'Inventario Hardware', slug: 'hardware-inventory', disabled: true },
+    { name: 'Ejecutar script', slug: 'run-script', disabled: true },
   ];
 
   client: any = {};
 
   constructor(
-    private dialog: MatDialog,
     private http: HttpClient,
-    private fb: FormBuilder,
     private router: Router,
+    private configService: ConfigService,
     private toastService: ToastrService
   ) {
+    this.baseUrl = this.configService.apiUrl;
   }
 
   ngOnInit(): void {

ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.ts

@@ -1,12 +1,12 @@
 import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import {DatePipe} from "@angular/common";
-import {MatTableDataSource} from "@angular/material/table";
-import {PartitionAssistantComponent} from "./partition-assistant/partition-assistant.component";
-import {MatDialog} from "@angular/material/dialog";
-import {Router} from "@angular/router";
-import {ToastrService} from "ngx-toastr";
+import { DatePipe } from "@angular/common";
+import { MatTableDataSource } from "@angular/material/table";
+import { MatDialog } from "@angular/material/dialog";
+import { Router } from "@angular/router";
+import { ToastrService } from "ngx-toastr";
 import { ManageClientComponent } from "../../shared/clients/manage-client/manage-client.component";
+import { ConfigService } from '@services/config.service';
 
 interface ClientInfo {
   property: string;
@@ -19,7 +19,7 @@ interface ClientInfo {
   styleUrl: './client-main-view.component.css'
 })
 export class ClientMainViewComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   @ViewChild('assistantContainer') assistantContainer!: ElementRef;
   clientUuid: string;
   clientData: any = {};
@@ -38,17 +38,17 @@ export class ClientMainViewComponent implements OnInit {
   showLegend: boolean = true;
 
   arrayCommands: any[] = [
-    {name: 'Enceder', slug: 'power-on'},
-    {name: 'Apagar', slug: 'power-off'},
-    {name: 'Reiniciar', slug: 'reboot'},
-    {name: 'Iniciar Sesión', slug: 'login'},
-    {name: 'Crear imagen', slug: 'create-image'},
-    {name: 'Clonar/desplegar imagen', slug: 'deploy-image'},
-    {name: 'Eliminar Imagen Cache', slug: 'delete-image-cache'},
-    {name: 'Particionar y Formatear', slug: 'partition'},
-    {name: 'Inventario Software', slug: 'software-inventory'},
-    {name: 'Inventario Hardware', slug: 'hardware-inventory'},
-    {name: 'Ejecutar script', slug: 'run-script'},
+    { name: 'Enceder', slug: 'power-on' },
+    { name: 'Apagar', slug: 'power-off' },
+    { name: 'Reiniciar', slug: 'reboot' },
+    { name: 'Iniciar Sesión', slug: 'login' },
+    { name: 'Crear imagen', slug: 'create-image' },
+    { name: 'Clonar/desplegar imagen', slug: 'deploy-image' },
+    { name: 'Eliminar Imagen Cache', slug: 'delete-image-cache' },
+    { name: 'Particionar y Formatear', slug: 'partition' },
+    { name: 'Inventario Software', slug: 'software-inventory' },
+    { name: 'Inventario Hardware', slug: 'hardware-inventory' },
+    { name: 'Ejecutar script', slug: 'run-script' },
   ];
 
   datePipe: DatePipe = new DatePipe('es-ES');
@@ -91,9 +91,11 @@ export class ClientMainViewComponent implements OnInit {
   constructor(
     private http: HttpClient,
     private dialog: MatDialog,
+    private configService: ConfigService,
     private router: Router,
     private toastService: ToastrService
-    ) {
+  ) {
+    this.baseUrl = this.configService.apiUrl;
     const url = window.location.href;
     const segments = url.split('/');
     this.clientUuid = segments[segments.length - 1];
@@ -198,7 +200,7 @@ export class ClientMainViewComponent implements OnInit {
 
   onEditClick(event: MouseEvent, uuid: string): void {
     event.stopPropagation();
-    const dialogRef = this.dialog.open(ManageClientComponent, { data: { uuid }, width: '900px' } );
+    const dialogRef = this.dialog.open(ManageClientComponent, { data: { uuid }, width: '900px' });
     dialogRef.afterClosed().subscribe();
   }
 

ogWebconsole/src/app/components/groups/components/client-main-view/create-image/create-image.component.ts

@@ -1,16 +1,18 @@
-import {Component, EventEmitter, Output} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
-import {ToastrService} from "ngx-toastr";
-import {ActivatedRoute, Router} from "@angular/router";
-import {MatTableDataSource} from "@angular/material/table";
-import {SelectionModel} from "@angular/cdk/collections";
+import { Component, EventEmitter, Output } from '@angular/core';
+import { HttpClient } from "@angular/common/http";
+import { ToastrService } from "ngx-toastr";
+import { ActivatedRoute, Router } from "@angular/router";
+import { MatTableDataSource } from "@angular/material/table";
+import { SelectionModel } from "@angular/cdk/collections";
+import { ConfigService } from '@services/config.service';
+
 @Component({
   selector: 'app-create-image',
   templateUrl: './create-image.component.html',
   styleUrl: './create-image.component.css'
 })
 export class CreateClientImageComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   @Output() dataChange = new EventEmitter<any>();
 
   errorMessage = '';
@@ -57,10 +59,12 @@ export class CreateClientImageComponent {
   constructor(
     private http: HttpClient,
     private toastService: ToastrService,
+    private configService: ConfigService,
     private route: ActivatedRoute,
     private router: Router,
-
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit() {
     this.clientId = this.route.snapshot.paramMap.get('id');
@@ -91,7 +95,7 @@ export class CreateClientImageComponent {
     const url = `${this.baseUrl}/images?created=false&page=1&itemsPerPage=1000`;
     this.http.get(url).subscribe(
       (response: any) => {
-          this.images = response['hydra:member'];
+        this.images = response['hydra:member'];
       },
       (error) => {
         console.error('Error al cargar las imágenes:', error);
@@ -112,16 +116,16 @@ export class CreateClientImageComponent {
 
     this.http.post(`${this.baseUrl}/images`, payload)
       .subscribe({
-          next: (response) => {
-            this.toastService.success('Petición de creación de imagen enviada');
-            this.loading = false;
-            this.router.navigate(['/commands-logs']);
-          },
-          error: (error) => {
-            this.toastService.error(error.error['hydra:description']);
-            this.loading = false;
-          }
+        next: (response) => {
+          this.toastService.success('Petición de creación de imagen enviada');
+          this.loading = false;
+          this.router.navigate(['/commands-logs']);
+        },
+        error: (error) => {
+          this.toastService.error(error.error['hydra:description']);
+          this.loading = false;
         }
+      }
       );
   }
 }

ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.ts

@@ -1,9 +1,10 @@
-import {Component, EventEmitter, Input, Output} from '@angular/core';
-import {MatTableDataSource} from "@angular/material/table";
-import {SelectionModel} from "@angular/cdk/collections";
-import {HttpClient} from "@angular/common/http";
-import {ToastrService} from "ngx-toastr";
-import {ActivatedRoute, Router} from "@angular/router";
+import { Component, EventEmitter, Output } from '@angular/core';
+import { MatTableDataSource } from "@angular/material/table";
+import { SelectionModel } from "@angular/cdk/collections";
+import { HttpClient } from "@angular/common/http";
+import { ToastrService } from "ngx-toastr";
+import { ActivatedRoute, Router } from "@angular/router";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-deploy-image',
@@ -11,7 +12,7 @@ import {ActivatedRoute, Router} from "@angular/router";
   styleUrl: './deploy-image.component.css'
 })
 export class DeployImageComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   @Output() dataChange = new EventEmitter<any>();
 
   errorMessage = '';
@@ -42,8 +43,8 @@ export class DeployImageComponent {
     { name: 'Seeder', value: 'seeder' },
   ];
   protected multicastModeOptions = [
-    { name: 'Half duplex', value: "half"},
-    { name: 'Full duplex', value: "full"},
+    { name: 'Half duplex', value: "half" },
+    { name: 'Full duplex', value: "full" },
   ];
 
   allMethods = [
@@ -96,9 +97,10 @@ export class DeployImageComponent {
   constructor(
     private http: HttpClient,
     private toastService: ToastrService,
-    private route: ActivatedRoute,
+    private configService: ConfigService,
     private router: Router,
   ) {
+    this.baseUrl = this.configService.apiUrl;
     const navigation = this.router.getCurrentNavigation();
     this.clientData = navigation?.extras?.state?.['clientData'];
     this.clientId = this.clientData?.[0]['@id'];
@@ -206,25 +208,25 @@ export class DeployImageComponent {
 
     this.http.post(`${this.baseUrl}/image-image-repositories/${this.selectedImage.uuid}/deploy-image`, payload)
       .subscribe({
-          next: (response) => {
-            this.toastService.success('Petición de despliegue enviada correctamente');
-            this.loading = false;
-            this.router.navigate(['/commands-logs']);
-          },
-          error: (error) => {
-            console.error('Error:', error);
-            this.toastService.error(error.error['hydra:description'], 'Se ha detectado un error en el despliegue de imágenes.', {
-              "closeButton": true,
-              "newestOnTop": false,
-              "progressBar": false,
-              "positionClass": "toast-bottom-right",
-              "timeOut": 0,
-              "extendedTimeOut": 0,
-              "tapToDismiss": false
-            });
-            this.loading = false;
-          }
+        next: (response) => {
+          this.toastService.success('Petición de despliegue enviada correctamente');
+          this.loading = false;
+          this.router.navigate(['/commands-logs']);
+        },
+        error: (error) => {
+          console.error('Error:', error);
+          this.toastService.error(error.error['hydra:description'], 'Se ha detectado un error en el despliegue de imágenes.', {
+            "closeButton": true,
+            "newestOnTop": false,
+            "progressBar": false,
+            "positionClass": "toast-bottom-right",
+            "timeOut": 0,
+            "extendedTimeOut": 0,
+            "tapToDismiss": false
+          });
+          this.loading = false;
         }
+      }
       );
   }
 }

ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.ts

@@ -6,6 +6,7 @@ import {ActivatedRoute, Router} from "@angular/router";
 import { PARTITION_TYPES } from '../../../../../shared/constants/partition-types';
 import { FILESYSTEM_TYPES } from '../../../../../shared/constants/filesystem-types';
 import {toUnredirectedSourceFile} from "@angular/compiler-cli/src/ngtsc/util/src/typescript";
+import { ConfigService } from '@services/config.service';
 
 interface Partition {
   uuid?: string;
@@ -27,7 +28,8 @@ interface Partition {
   styleUrls: ['./partition-assistant.component.css']
 })
 export class PartitionAssistantComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   @Output() dataChange = new EventEmitter<any>();
   partitionTypes = PARTITION_TYPES;
   filesystemTypes = FILESYSTEM_TYPES;
@@ -42,8 +44,6 @@ export class PartitionAssistantComponent {
   clientData: any = [];
   loading: boolean = false;
 
-  private apiUrl: string = this.baseUrl + '/partitions';
-
   view: [number, number] = [400, 300];
   showLegend = true;
   showLabels = true;
@@ -53,7 +53,10 @@ export class PartitionAssistantComponent {
     private toastService: ToastrService,
     private route: ActivatedRoute,
     private router: Router,
+    private configService: ConfigService,
   ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = this.baseUrl + '/partitions';
     const navigation = this.router.getCurrentNavigation();
     this.clientData = navigation?.extras?.state?.['clientData'];
     this.clientId = this.clientData[0]['@id'];

ogWebconsole/src/app/components/groups/groups.component.ts

@@ -23,6 +23,7 @@ import { SelectionModel } from "@angular/cdk/collections";
 import { ManageClientComponent } from "./shared/clients/manage-client/manage-client.component";
 import { debounceTime } from 'rxjs/operators';
 import { Subject } from 'rxjs';
+import { ConfigService } from '@services/config.service';
 
 enum NodeType {
   OrganizationalUnit = 'organizational-unit',
@@ -38,8 +39,8 @@ enum NodeType {
   styleUrls: ['./groups.component.css'],
 })
 export class GroupsComponent implements OnInit, OnDestroy {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  mercureUrl: string = import.meta.env.NG_APP_OGCORE_MERCURE_BASE_URL;
+  baseUrl: string;
+  mercureUrl: string;
   organizationalUnits: UnidadOrganizativa[] = [];
   selectedUnidad: UnidadOrganizativa | null = null;
   selectedDetail: UnidadOrganizativa | null = null;
@@ -103,8 +104,11 @@ export class GroupsComponent implements OnInit, OnDestroy {
     public dialog: MatDialog,
     private bottomSheet: MatBottomSheet,
     private joyrideService: JoyrideService,
-    private toastr: ToastrService
+    private toastr: ToastrService,
+    private configService: ConfigService
   ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.mercureUrl = this.configService.mercureUrl;
     this.treeFlattener = new MatTreeFlattener<TreeNode, FlatNode>(
       this.transformer,
       (node) => node.level,

ogWebconsole/src/app/components/groups/services/data.service.ts

@@ -3,18 +3,22 @@ import {HttpClient, HttpParams} from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
 import { UnidadOrganizativa } from '../model/model';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
 
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
+  private clientsUrl: string;
 
-  private apiUrl = `${this.baseUrl}/organizational-units?page=1&itemsPerPage=1000`;
-  private clientsUrl = `${this.baseUrl}/clients`;
-
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/organizational-units?page=1&itemsPerPage=1000`;
+    this.clientsUrl = `${this.baseUrl}/clients`;
+  }
 
   getOrganizationalUnits(search: string = ''): Observable<UnidadOrganizativa[]> {
     let url = `${this.apiUrl}&type=organizational-unit`;

ogWebconsole/src/app/components/groups/shared/classroom-view/classroom-view.component.ts

@@ -4,6 +4,7 @@ import { ClientViewComponent } from "../client-view/client-view.component";
 import { CdkDragMove } from '@angular/cdk/drag-drop';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
+import { ConfigService } from '@services/config.service';
 
 interface GroupedClients {
   organizationalUnitName: string;
@@ -16,12 +17,14 @@ interface GroupedClients {
   styleUrls: ['./classroom-view.component.css']
 })
 export class ClassroomViewComponent implements OnInit, OnChanges {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   @Input() clients: any[] = [];
   @Input() pcInTable: number = 5;
   groupedClients: GroupedClients[] = [];
 
-  constructor(public dialog: MatDialog, private http: HttpClient, private toastService: ToastrService) { }
+  constructor(public dialog: MatDialog, private http: HttpClient, private toastService: ToastrService, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.groupClientsByOrganizationalUnit();

ogWebconsole/src/app/components/groups/shared/clients/create-multiple-client/create-multiple-client.component.ts

@@ -1,18 +1,18 @@
-import {Component, Inject, OnInit, Optional} from '@angular/core';
-import {MatDialogRef} from "@angular/material/dialog";
-import {HttpClient} from "@angular/common/http";
-import {MatSnackBar} from "@angular/material/snack-bar";
-import {ToastrService} from "ngx-toastr";
-import {MAT_DIALOG_DATA} from "@angular/material/dialog";
+import { Component, Inject, OnInit, Optional } from '@angular/core';
+import { MatDialogRef } from "@angular/material/dialog";
+import { HttpClient } from "@angular/common/http";
+import { ToastrService } from "ngx-toastr";
+import { MAT_DIALOG_DATA } from "@angular/material/dialog";
 import { DataService } from '../../../services/data.service';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-multiple-client',
   templateUrl: './create-multiple-client.component.html',
   styleUrl: './create-multiple-client.component.css'
 })
-export class CreateMultipleClientComponent implements OnInit{
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+export class CreateMultipleClientComponent implements OnInit {
+  baseUrl: string = this.configService.apiUrl;
   parentUnits: any[] = [];
   parentUnitsWithPaths: { id: string, name: string, path: string }[] = [];
   uploadedClients: any[] = [];
@@ -26,16 +26,18 @@ export class CreateMultipleClientComponent implements OnInit{
     @Optional() private dialogRef: MatDialogRef<CreateMultipleClientComponent>,
     @Inject(MAT_DIALOG_DATA) private data: any,
     private http: HttpClient,
-    private snackBar: MatSnackBar,
+    private configService: ConfigService,
     private toastService: ToastrService,
     private dataService: DataService
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.loadParentUnits();
 
     if (this.data?.organizationalUnit) {
-      this.organizationalUnit = this.data.organizationalUnit['@id']; 
+      this.organizationalUnit = this.data.organizationalUnit['@id'];
     }
   }
 

ogWebconsole/src/app/components/groups/shared/clients/manage-client/manage-client.component.ts

@@ -2,9 +2,9 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Component, Inject, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import { MatSnackBar } from '@angular/material/snack-bar';
 import { ToastrService } from 'ngx-toastr';
 import { DataService } from '../../../services/data.service';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-manage-client',
@@ -12,7 +12,7 @@ import { DataService } from '../../../services/data.service';
   styleUrls: ['./manage-client.component.css']
 })
 export class ManageClientComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   clientForm!: FormGroup;
   parentUnits: any[] = [];
   parentUnitsWithPaths: { id: string, name: string, path: string }[] = [];
@@ -38,11 +38,12 @@ export class ManageClientComponent implements OnInit {
     private fb: FormBuilder,
     private dialogRef: MatDialogRef<ManageClientComponent>,
     private http: HttpClient,
-    private snackBar: MatSnackBar,
+    private configService: ConfigService,
     private toastService: ToastrService,
     private dataService: DataService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.isEditMode = !!data?.uuid;
     this.dialogTitle = this.isEditMode ? 'editClientDialogTitle' : 'addClientDialogTitle';
   }

ogWebconsole/src/app/components/groups/shared/execute-command-ou/execute-command-ou.component.ts

@@ -3,6 +3,7 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { ToastrService } from 'ngx-toastr';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-execute-command-ou',
@@ -14,15 +15,17 @@ export class ExecuteCommandOuComponent implements OnInit {
   clients: any[] = [];
   commands: any[] = [];
   commandGroups: any[] = [];
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
 
   constructor(
     private dialogRef: MatDialogRef<ExecuteCommandOuComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any,
     private http: HttpClient,
     private fb: FormBuilder,
+    private configService: ConfigService,
     private toastService: ToastrService,
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.form = this.fb.group({
       selectedCommand: [null],
       selectedCommandGroup: [null],

ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.ts

@@ -4,6 +4,7 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { DataService } from "../../../services/data.service";
 import { ToastrService } from "ngx-toastr";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-manage-organizational-unit',
@@ -11,7 +12,7 @@ import { ToastrService } from "ngx-toastr";
   styleUrls: ['./manage-organizational-unit.component.css']
 })
 export class ManageOrganizationalUnitComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   isLinear = true;
   generalFormGroup: FormGroup;
   additionalInfoFormGroup: FormGroup;
@@ -55,11 +56,12 @@ export class ManageOrganizationalUnitComponent implements OnInit {
     private dialogRef: MatDialogRef<ManageOrganizationalUnitComponent>,
     private http: HttpClient,
     private dataService: DataService,
+    private configService: ConfigService,
     private toastService: ToastrService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
     this.isEditMode = !!data?.uuid;
-
+    this.baseUrl = this.configService.apiUrl;
     this.generalFormGroup = this._formBuilder.group({
       name: [null, Validators.required],
       parent: [data?.parent ? data.parent['@id'] : null],

ogWebconsole/src/app/components/groups/shared/organizational-units/show-organizational-unit/show-organizational-unit.component.ts

@@ -1,7 +1,8 @@
 import { HttpClient } from '@angular/common/http';
-import {Component, Inject, OnInit} from '@angular/core';
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {DatePipe} from "@angular/common";
+import { Component, Inject, OnInit } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { DatePipe } from "@angular/common";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-show-organizational-unit',
@@ -9,7 +10,7 @@ import {DatePipe} from "@angular/common";
   styleUrl: './show-organizational-unit.component.css'
 })
 export class ShowOrganizationalUnitComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   displayedColumns: string[] = ['property', 'value'];
   currentCalendar: any;
   ou: any;
@@ -26,8 +27,10 @@ export class ShowOrganizationalUnitComponent implements OnInit {
   constructor(
     @Inject(MAT_DIALOG_DATA) public data: any,
     private dialogRef: MatDialogRef<ShowOrganizationalUnitComponent>,
+    private configService: ConfigService,
     private http: HttpClient
   ) {
+    this.baseUrl = this.configService.apiUrl;
   }
 
   ngOnInit(): void {

ogWebconsole/src/app/components/images/create-image/create-image.component.ts

@@ -1,9 +1,10 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';
-import {HttpClient} from '@angular/common/http';
-import {ToastrService} from 'ngx-toastr';
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
-import {DataService} from "../data.service";
+import { Component, Inject, OnInit } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
+import { HttpClient } from '@angular/common/http';
+import { ToastrService } from 'ngx-toastr';
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { DataService } from "../data.service";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-image',
@@ -11,7 +12,7 @@ import {DataService} from "../data.service";
   styleUrls: ['./create-image.component.css']
 })
 export class CreateImageComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   imageForm: FormGroup<any>;
   imageId: string | null = null;
   softwareProfiles: any[] = [];
@@ -26,9 +27,11 @@ export class CreateImageComponent implements OnInit {
     private http: HttpClient,
     public dialogRef: MatDialogRef<CreateImageComponent>,
     private toastService: ToastrService,
+    private configService: ConfigService,
     private dataService: DataService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.imageForm = this.fb.group({
       name: ['', Validators.required],
       description: [''],

ogWebconsole/src/app/components/images/data.service.ts

@@ -1,17 +1,20 @@
-
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/images?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/images?page=1&itemsPerPage=1000`;
+  }
 
   getImages(filters: { [key: string]: string }): Observable<{ totalItems: any; data: any }> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/images/export-image/export-image.component.ts

@@ -1,8 +1,9 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {Router} from "@angular/router";
+import { Component, Inject, OnInit } from '@angular/core';
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { Router } from "@angular/router";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-export-image',
@@ -10,7 +11,7 @@ import {Router} from "@angular/router";
   styleUrl: './export-image.component.css'
 })
 export class ExportImageComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   loading: boolean = true;
   repositories: any[] = [];
   selectedRepositories: any[] = [];
@@ -19,10 +20,11 @@ export class ExportImageComponent implements OnInit {
     private http: HttpClient,
     public dialogRef: MatDialogRef<ExportImageComponent>,
     private toastService: ToastrService,
+    private configService: ConfigService,
     private router: Router,
     @Inject(MAT_DIALOG_DATA) public data: { image: any, imageImageRepository: any }
   ) {
-
+    this.baseUrl = this.configService.apiUrl;
   }
 
   ngOnInit(): void {

ogWebconsole/src/app/components/images/images.component.ts

@@ -1,11 +1,10 @@
-import {Component, Input, OnInit} from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
 import { MatTableDataSource } from '@angular/material/table';
-import { ToastrService } from 'ngx-toastr';
 import { DatePipe } from '@angular/common';
 import { CreateImageComponent } from './create-image/create-image.component';
-import {Observable} from "rxjs";
+import { ConfigService } from '@services/config.service';
 import { JoyrideService } from 'ngx-joyride';
 
 @Component({
@@ -14,7 +13,8 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrls: ['./images.component.css']
 })
 export class ImagesComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
@@ -57,16 +57,18 @@ export class ImagesComponent implements OnInit {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/images`;
   @Input() repositoryUuid: any
   private repositoryId: any;
 
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
-    private toastService: ToastrService,
+    private configService: ConfigService,
     private joyrideService: JoyrideService,
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/images`;
+  }
 
   ngOnInit(): void {
     if (this.repositoryUuid) {
@@ -100,7 +102,7 @@ export class ImagesComponent implements OnInit {
 
   search(): void {
     this.loading = true;
-    this.http.get<any>(`${this.apiUrl}?page=${this.page +1 }&itemsPerPage=${this.itemsPerPage}&repositoryId=${this.repositoryId}`, { params: this.filters }).subscribe(
+    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}&repositoryId=${this.repositoryId}`, { params: this.filters }).subscribe(
       data => {
         this.dataSource.data = data['hydra:member'];
         this.length = data['hydra:totalItems'];

ogWebconsole/src/app/components/login/login.component.ts

@@ -4,6 +4,7 @@ import { Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
 import { ToastrService } from "ngx-toastr";
 import { jwtDecode } from "jwt-decode";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-login',
@@ -19,14 +20,16 @@ export class LoginComponent {
   isLoading: boolean = false;
   decodedToken: any;
 
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
 
   constructor(
     private http: HttpClient,
     private router: Router,
+    private configService: ConfigService,
     private toastService: ToastrService,
     private translateService: TranslateService
   ) {
+    this.baseUrl = this.configService.apiUrl;
     const savedLanguage = localStorage.getItem('language') || 'es';
     this.translateService.use(savedLanguage);
   }

ogWebconsole/src/app/components/menus/create-menu/create-menu.component.ts

@@ -1,18 +1,19 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {DataService} from "../data.service";
+import { Component, Inject, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { DataService } from "../data.service";
 import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-menu',
   templateUrl: './create-menu.component.html',
   styleUrl: './create-menu.component.css'
 })
-export class CreateMenuComponent implements OnInit{
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+export class CreateMenuComponent implements OnInit {
+  baseUrl: string;
   menuForm: FormGroup<any>;
   menuId: string | null = null;
   softwareProfiles: any[] = [];
@@ -24,9 +25,11 @@ export class CreateMenuComponent implements OnInit{
     public dialogRef: MatDialogRef<CreateMenuComponent>,
     private toastService: ToastrService,
     private dataService: DataService,
+    private configService: ConfigService,
     private sanitizer: DomSanitizer,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.menuForm = this.fb.group({
       name: ['', Validators.required],
       publicUrl: ['', Validators.required],

ogWebconsole/src/app/components/menus/data.service.ts

@@ -1,6 +1,6 @@
-
+import { ConfigService } from '@services/config.service';
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
 
@@ -8,10 +8,13 @@ import { catchError, map } from 'rxjs/operators';
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/menus?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/menus?page=1&itemsPerPage=1000`;
+  }
 
   getMenus(filters: { [key: string]: string }): Observable<{ totalItems: any; data: any }> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/menus/menus.component.ts

@@ -1,13 +1,14 @@
-import {Component, OnInit} from '@angular/core';
-import {MatTableDataSource} from "@angular/material/table";
-import {DatePipe} from "@angular/common";
-import {MatDialog} from "@angular/material/dialog";
-import {HttpClient} from "@angular/common/http";
-import {ToastrService} from "ngx-toastr";
-import {JoyrideService} from "ngx-joyride";
-import {Router} from "@angular/router";
-import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component";
-import {CreateMenuComponent} from "./create-menu/create-menu.component";
+import { Component, OnInit } from '@angular/core';
+import { MatTableDataSource } from "@angular/material/table";
+import { DatePipe } from "@angular/common";
+import { MatDialog } from "@angular/material/dialog";
+import { HttpClient } from "@angular/common/http";
+import { ToastrService } from "ngx-toastr";
+import { JoyrideService } from "ngx-joyride";
+import { Router } from "@angular/router";
+import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
+import { CreateMenuComponent } from "./create-menu/create-menu.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-menus',
@@ -15,7 +16,8 @@ import {CreateMenuComponent} from "./create-menu/create-menu.component";
   styleUrl: './menus.component.css'
 })
 export class MenusComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
@@ -57,15 +59,17 @@ export class MenusComponent implements OnInit {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/menus`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private toastService: ToastrService,
     private joyrideService: JoyrideService,
-    private router: Router
-  ) {}
+    private router: Router,
+    private configService: ConfigService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/menus`;
+  }
 
   ngOnInit(): void {
     this.search();
@@ -83,7 +87,7 @@ export class MenusComponent implements OnInit {
 
   search(): void {
     this.loading = true;
-    this.http.get<any>(`${this.apiUrl}?page=${this.page +1 }&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
+    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
       data => {
         this.dataSource.data = data['hydra:member'];
         this.length = data['hydra:totalItems'];

ogWebconsole/src/app/components/ogboot/ogboot-status/ogboot-status.component.ts

@@ -1,7 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { JoyrideService } from 'ngx-joyride';
-import {ToastrService} from "ngx-toastr";
+import { ToastrService } from "ngx-toastr";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-ogboot-status',
@@ -9,7 +10,7 @@ import {ToastrService} from "ngx-toastr";
   styleUrls: ['./ogboot-status.component.css']
 })
 export class OgbootStatusComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   diskUsage: any = {};
   servicesStatus: any = {};
   installedOglives: any[] = [];
@@ -29,8 +30,11 @@ export class OgbootStatusComponent implements OnInit {
   constructor(
     private http: HttpClient,
     private joyrideService: JoyrideService,
+    private configService: ConfigService,
     private toastService: ToastrService,
-    ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.loadStatus();

ogWebconsole/src/app/components/ogboot/pxe-boot-files/data.service.ts

@@ -8,7 +8,7 @@ import { DataService as TemplateDataService } from './../pxe/data.service';
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string = this.configService.apiUrl;
   private apiUrl = `${this.baseUrl}/pxe-boot-files?page=1&itemsPerPage=1000`;
 
   constructor(

ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts

@@ -2,8 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
-import { PageEvent } from '@angular/material/paginator';
-import {Observable} from "rxjs";
+import { ConfigService } from '@services/config.service';
 import { JoyrideService } from 'ngx-joyride';
 
 @Component({
@@ -12,7 +11,7 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrls: ['./pxe-boot-files.component.css']
 })
 export class PxeBootFilesComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
 
   availableOrganizationalUnits: any[] = [];
   selectedUnitChildren: any[] = [];
@@ -33,8 +32,10 @@ export class PxeBootFilesComponent implements OnInit {
     private fb: FormBuilder,
     private http: HttpClient,
     private toastService: ToastrService,
+    private configService: ConfigService,
     private joyrideService: JoyrideService
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.taskForm = this.fb.group({
       organizationalUnit: ['', Validators.required],
       selectedChild: ['', Validators.required]
@@ -118,13 +119,13 @@ export class PxeBootFilesComponent implements OnInit {
   iniciarTour(): void {
     this.joyrideService.startTour({
       steps: [
-      'titleStep',
-      'selectUnitStep',
-      'selectClassStep',
-      'applyToAllStep',
-      'saveButtonStep',
-      'tableStep',
-      'selectTemplateStep'
+        'titleStep',
+        'selectUnitStep',
+        'selectClassStep',
+        'applyToAllStep',
+        'saveButtonStep',
+        'tableStep',
+        'selectTemplateStep'
       ],
       showPrevButton: true,
       themeColor: '#3f51b5'

ogWebconsole/src/app/components/ogboot/pxe-images/create-image/create-image/create-image.component.ts

@@ -2,6 +2,7 @@ import { HttpClient } from '@angular/common/http';
 import { Component, Inject, OnInit } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { ToastrService } from 'ngx-toastr';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-image',
@@ -9,7 +10,7 @@ import { ToastrService } from 'ngx-toastr';
   styleUrls: ['./create-image.component.css']
 })
 export class CreatePXEImageComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   downloads: any[] = [];
   selectedDownload: any;
   isEditMode: boolean = false;
@@ -18,10 +19,13 @@ export class CreatePXEImageComponent implements OnInit {
 
   constructor(
     private toastService: ToastrService,
+    private configService: ConfigService,
     private http: HttpClient,
     public dialogRef: MatDialogRef<CreatePXEImageComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any
-  ) { }
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.fetchDownloads();

ogWebconsole/src/app/components/ogboot/pxe-images/data.service.ts

@@ -1,16 +1,20 @@
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/og-lives?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/og-lives?page=1&itemsPerPage=1000`;
+  }
 
   getImages(filters: { [key: string]: string }): Observable<any[]> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/ogboot/pxe-images/pxe-images.component.ts

@@ -1,17 +1,18 @@
-import {Component, OnInit, signal} from '@angular/core';
+import { Component, OnInit, signal } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
 import { CreatePXEImageComponent } from './create-image/create-image/create-image.component';
 import { InfoImageComponent } from './info-image/info-image/info-image.component';
 import { MatTableDataSource } from "@angular/material/table";
-import {PageEvent} from "@angular/material/paginator";
-import {ToastrService} from "ngx-toastr";
+import { PageEvent } from "@angular/material/paginator";
+import { ToastrService } from "ngx-toastr";
 import { DatePipe } from "@angular/common";
 import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component';
-import {DataService} from "./data.service";
-import {Observable} from "rxjs";
+import { DataService } from "./data.service";
+import { Observable } from "rxjs";
 import { JoyrideService } from 'ngx-joyride';
-import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
+import { ServerInfoDialogComponent } from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-pxe-images',
@@ -19,7 +20,8 @@ import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-
   styleUrls: ['./pxe-images.component.css']
 })
 export class PXEimagesComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   images: { downloadUrl: string; name: string; uuid: string }[] = [];
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
@@ -27,7 +29,7 @@ export class PXEimagesComponent implements OnInit {
   page: number = 1;
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
   selectedElements: string[] = [];
-  loading:boolean = false;
+  loading: boolean = false;
   filters: { [key: string]: string } = {};
   alertMessage: string | null = null;
   readonly panelOpenState = signal(false);
@@ -66,15 +68,17 @@ export class PXEimagesComponent implements OnInit {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/og-lives`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private dataService: DataService,
+    private configService: ConfigService,
     private toastService: ToastrService,
     private joyrideService: JoyrideService
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/og-lives`;
+  }
 
   ngOnInit(): void {
     this.loading = true;
@@ -113,7 +117,7 @@ export class PXEimagesComponent implements OnInit {
     });
   }
 
-  toggleAction(image: any, action:string): void {
+  toggleAction(image: any, action: string): void {
     switch (action) {
       case 'set-default':
         this.http.post(`${this.apiUrl}/server/${image.uuid}/set-default`, {}).subscribe({
@@ -197,7 +201,7 @@ export class PXEimagesComponent implements OnInit {
 
   showOgLive(event: MouseEvent, data: any): void {
     event.stopPropagation();
-    const dialogRef = this.dialog.open(InfoImageComponent, { data: { data }, width: '700px'});
+    const dialogRef = this.dialog.open(InfoImageComponent, { data: { data }, width: '700px' });
   }
 
   applyFilter() {
@@ -255,14 +259,14 @@ export class PXEimagesComponent implements OnInit {
   iniciarTour(): void {
     this.joyrideService.startTour({
       steps: [
-      'titleStep',
-      'addImageStep',
-      'searchNameStep',
-      'searchDefaultImageStep',
-      'searchInstalledStep',
-      'tableStep',
-      'actionsStep',
-      'paginationStep'
+        'titleStep',
+        'addImageStep',
+        'searchNameStep',
+        'searchDefaultImageStep',
+        'searchInstalledStep',
+        'tableStep',
+        'actionsStep',
+        'paginationStep'
       ],
       showPrevButton: true,
       themeColor: '#3f51b5'

ogWebconsole/src/app/components/ogboot/pxe/create-pxeTemplate/create-pxe-template.component.ts

@@ -4,6 +4,7 @@ import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
 import { ToastrService } from 'ngx-toastr';
 import { DeleteModalComponent } from "../../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-pxe-template',
@@ -11,7 +12,7 @@ import { DeleteModalComponent } from "../../../../shared/delete_modal/delete-mod
   styleUrls: ['./create-pxe-template.component.css']
 })
 export class CreatePxeTemplateComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   templateForm!: FormGroup;
   previewContent: string = '';
   isEditMode: boolean = false;
@@ -54,10 +55,13 @@ exit`
     public dialogRef: MatDialogRef<CreatePxeTemplateComponent>,
     public dialog: MatDialog,
     private http: HttpClient,
+    private configService: ConfigService,
     private fb: FormBuilder,
     private toastService: ToastrService,
     @Inject(MAT_DIALOG_DATA) public data: any
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit() {
     this.isEditMode = !!this.data;

ogWebconsole/src/app/components/ogboot/pxe/data.service.ts

@@ -1,17 +1,21 @@
 
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/pxe-templates?page=1&itemsPerPage=1000`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/pxe-templates?page=1&itemsPerPage=1000`;
+  }
 
   getPxeTemplates(filters: { [key: string]: string }): Observable<any[]> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/ogboot/pxe/pxe.component.ts

@@ -1,17 +1,18 @@
 import { HttpClient } from '@angular/common/http';
 import { Component } from '@angular/core';
-import { CreatePxeTemplateComponent } from './create-pxeTemplate/create-pxe-template.component'; // Asegúrate de que el path sea correcto
+import { CreatePxeTemplateComponent } from './create-pxeTemplate/create-pxe-template.component';
 import { MatDialog } from '@angular/material/dialog';
 import { MatTableDataSource } from '@angular/material/table';
 import { PageEvent } from '@angular/material/paginator';
 import { ToastrService } from 'ngx-toastr';
 import { DatePipe } from '@angular/common';
 import { DataService } from './data.service';
-import {ShowTemplateContentComponent} from "./show-template-content/show-template-content.component";
-import {Observable} from "rxjs";
+import { ShowTemplateContentComponent } from "./show-template-content/show-template-content.component";
+import { Observable } from "rxjs";
 import { JoyrideService } from 'ngx-joyride';
-import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
-import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
+import { DeleteModalComponent } from "../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { ServerInfoDialogComponent } from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-pxe',
@@ -19,7 +20,8 @@ import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-
   styleUrls: ['./pxe.component.css']
 })
 export class PxeComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   pxeTemplates: any[] = [];
   currentPage: number = 1;
   dataSource = new MatTableDataSource<any>();
@@ -28,7 +30,7 @@ export class PxeComponent {
   page: number = 1;
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
   selectedElements: string[] = [];
-  loading:boolean = false;
+  loading: boolean = false;
   filters: { [key: string]: string } = {};
   alertMessage: string | null = null;
   datePipe: DatePipe = new DatePipe('es-ES');
@@ -58,15 +60,17 @@ export class PxeComponent {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/pxe-templates`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private toastService: ToastrService,
     private dataService: DataService,
-    private joyrideService: JoyrideService
-  ) { }
+    private joyrideService: JoyrideService,
+    private configService: ConfigService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/pxe-templates`;
+  }
 
   ngOnInit(): void {
     this.loading = true;
@@ -140,7 +144,7 @@ export class PxeComponent {
 
   showTemplate(event: MouseEvent, data: any): void {
     event.stopPropagation();
-    const dialogRef = this.dialog.open(ShowTemplateContentComponent, { data: { data }, width: '700px'});
+    const dialogRef = this.dialog.open(ShowTemplateContentComponent, { data: { data }, width: '700px' });
   }
 
   syncTemplates() {

ogWebconsole/src/app/components/ogboot/pxe/show-template-content/show-template-content.component.ts

@@ -1,6 +1,7 @@
-import {Component, Inject} from '@angular/core';
-import {MAT_DIALOG_DATA} from "@angular/material/dialog";
-import {HttpClient} from "@angular/common/http";
+import { Component, Inject } from '@angular/core';
+import { MAT_DIALOG_DATA } from "@angular/material/dialog";
+import { HttpClient } from "@angular/common/http";
+import { ConfigService } from "@services/config.service";
 
 @Component({
   selector: 'app-show-template-content',
@@ -8,12 +9,14 @@ import {HttpClient} from "@angular/common/http";
   styleUrl: './show-template-content.component.css'
 })
 export class ShowTemplateContentComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   displayedColumns: string[] = ['property', 'value'];
   generalData: any[] = [];
   constructor(
     @Inject(MAT_DIALOG_DATA) public data: any,
-    private http: HttpClient
+    private http: HttpClient,
+    private configService: ConfigService
   ) {
+    this.baseUrl = this.configService.apiUrl;
   }
 }

ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.ts

@@ -1,9 +1,10 @@
 import { Component, OnInit, Inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import {MatDialogRef, MAT_DIALOG_DATA, MatDialog} from '@angular/material/dialog';
+import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
 import { FormControl } from '@angular/forms';
 import { ToastrService } from 'ngx-toastr';
-import {OperationResultDialogComponent} from "../operation-result-dialog/operation-result-dialog.component";
+import { OperationResultDialogComponent } from "../operation-result-dialog/operation-result-dialog.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-add-clients-to-subnet',
@@ -11,7 +12,7 @@ import {OperationResultDialogComponent} from "../operation-result-dialog/operati
   styleUrls: ['./add-clients-to-subnet.component.css']
 })
 export class AddClientsToSubnetComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   units: any[] = [];
   clients: any[] = [];
   selectedClients: string[] = [];
@@ -25,8 +26,11 @@ export class AddClientsToSubnetComponent implements OnInit {
     public dialogRef: MatDialogRef<AddClientsToSubnetComponent>,
     private toastService: ToastrService,
     public dialog: MatDialog,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: { subnetUuid: string, subnetName: string }
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.loading = true;

ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts

@@ -3,6 +3,7 @@ import { Component, Inject, OnInit } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { ToastrService } from 'ngx-toastr';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-subnet',
@@ -10,7 +11,7 @@ import { ToastrService } from 'ngx-toastr';
   styleUrls: ['./create-subnet.component.css']
 })
 export class CreateSubnetComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   subnetForm: FormGroup;
   isEditMode: boolean = false;
   subnetId: string | null = null;
@@ -19,10 +20,12 @@ export class CreateSubnetComponent implements OnInit {
     private toastService: ToastrService,
     private http: HttpClient,
     private fb: FormBuilder,
+    private configService: ConfigService,
     public dialogRef: MatDialogRef<CreateSubnetComponent>,
     public dialog: MatDialog,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.subnetForm = this.fb.group({
       name: ['', Validators.required],
       netmask: ['', Validators.required],

ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts

@@ -9,8 +9,9 @@ import { AddClientsToSubnetComponent } from './add-clients-to-subnet/add-clients
 import { ServerInfoDialogComponent } from "./server-info-dialog/server-info-dialog.component";
 import { Observable } from "rxjs";
 import { JoyrideService } from 'ngx-joyride';
-import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component";
-import {ShowClientsComponent} from "./show-clients/show-clients.component";
+import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
+import { ShowClientsComponent } from "./show-clients/show-clients.component";
+import { ConfigService } from '@services/config.service';
 
 export interface Subnet {
   '@id': string;
@@ -36,7 +37,7 @@ export interface Subnet {
   styleUrls: ['./og-dhcp-subnets.component.css']
 })
 export class OgDhcpSubnetsComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   displayedColumns: string[] = ['id', 'name', 'netmask', 'ipAddress', 'synchronized', 'serverId', 'clients', 'actions'];
   dataSource = new MatTableDataSource<Subnet>([]);
   length = 0;
@@ -45,7 +46,7 @@ export class OgDhcpSubnetsComponent implements OnInit {
   filters: { [key: string]: string } = {};
   pageSizeOptions: number[] = [5, 10, 20];
   alertMessage: string | null = null;
-  loading:boolean = false;
+  loading: boolean = false;
 
   @ViewChild(MatPaginator) paginator: MatPaginator | undefined;
 
@@ -59,10 +60,13 @@ export class OgDhcpSubnetsComponent implements OnInit {
     { columnDef: 'clients', header: 'Lista de clientes', cell: (subnet: Subnet) => `${subnet.clients}` },
   ];
 
-  private apiUrl = `${this.baseUrl}/subnets`;
+  private apiUrl: string;
 
   constructor(public dialog: MatDialog, private http: HttpClient, private toastService: ToastrService,
-    private joyrideService: JoyrideService) { }
+    private joyrideService: JoyrideService, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/subnets`;
+  }
 
   ngOnInit() {
     this.loading = true;

ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.ts

@@ -1,10 +1,11 @@
 import { Component, Inject, OnInit } from '@angular/core';
 import { ToastrService } from "ngx-toastr";
 import { HttpClient } from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from "@angular/material/dialog";
+import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from "@angular/material/dialog";
 import { MatTableDataSource } from "@angular/material/table";
 import { Client } from "../../groups/model/model";
-import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { DeleteModalComponent } from "../../../shared/delete_modal/delete-modal/delete-modal.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-show-clients',
@@ -12,7 +13,7 @@ import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/de
   styleUrl: './show-clients.component.css'
 })
 export class ShowClientsComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   dataSource = new MatTableDataSource<Client>([]);
   length = 0;
   itemsPerPage: number = 10;
@@ -22,13 +23,13 @@ export class ShowClientsComponent implements OnInit {
   filters: { [key: string]: string } = {};
 
   protected status = [
-    {value: 'off', name: 'Apagado'},
-    {value: 'initializing', name: 'Inicializando'},
-    {value: 'og-live', name: 'Og Live'},
-    {value: 'linux', name: 'Linux'},
-    {value: 'linux-session', name: 'Linux Session'},
-    {value: 'windows', name: 'Windows'},
-    {value: 'mac', name: 'Mac'},
+    { value: 'off', name: 'Apagado' },
+    { value: 'initializing', name: 'Inicializando' },
+    { value: 'og-live', name: 'Og Live' },
+    { value: 'linux', name: 'Linux' },
+    { value: 'linux-session', name: 'Linux Session' },
+    { value: 'windows', name: 'Windows' },
+    { value: 'mac', name: 'Mac' },
   ];
 
   columns = [
@@ -48,8 +49,11 @@ export class ShowClientsComponent implements OnInit {
     private http: HttpClient,
     public dialogRef: MatDialogRef<ShowClientsComponent>,
     public dialog: MatDialog,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: any
-  ) { }
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     if (this.data) {
@@ -89,7 +93,8 @@ export class ShowClientsComponent implements OnInit {
             this.toastService.error(error.error['hydra:description']);
           }
         });
-      }})
+      }
+    })
   }
 
   onNoClick(): void {

ogWebconsole/src/app/components/ogdhcp/status/status.component.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
-import {HttpClient} from "@angular/common/http";
+import { HttpClient } from "@angular/common/http";
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-status',
@@ -8,7 +9,7 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrl: './status.component.css'
 })
 export class StatusComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   diskUsage: any = {};
   servicesStatus: any = {};
   subnets: any[] = [];
@@ -25,8 +26,9 @@ export class StatusComponent {
     domain: ['#FF6384', '#3f51b5']
   };
 
-  constructor(private http: HttpClient,
-    private joyrideService: JoyrideService) {}
+  constructor(private http: HttpClient, private joyrideService: JoyrideService, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+  }
 
   ngOnInit(): void {
     this.loadStatus();

ogWebconsole/src/app/components/operative-system/create-operative-system/create-operative-system.component.ts

@@ -1,9 +1,10 @@
-import {Component, Inject} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {DataService} from "../../software/data.service";
+import { Component, Inject } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { DataService } from "../../software/data.service";
+import { ConfigService } from "@services/config.service";
 
 @Component({
   selector: 'app-create-operative-system',
@@ -11,9 +12,8 @@ import {DataService} from "../../software/data.service";
   styleUrl: './create-operative-system.component.css'
 })
 export class CreateOperativeSystemComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   formGroup: FormGroup<any>;
-  private apiUrl = `${this.baseUrl}/software`;
   operativeSystemId: string | null = null;
 
   constructor(
@@ -22,8 +22,10 @@ export class CreateOperativeSystemComponent {
     public dialogRef: MatDialogRef<CreateOperativeSystemComponent>,
     private toastService: ToastrService,
     private dataService: DataService,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.formGroup = this.fb.group({
       name: ['', Validators.required],
     });

ogWebconsole/src/app/components/operative-system/operative-system.component.ts

@@ -1,15 +1,15 @@
-import {Component, signal} from '@angular/core';
-import {MatTableDataSource} from "@angular/material/table";
-import {DatePipe} from "@angular/common";
-import {MatDialog} from "@angular/material/dialog";
-import {HttpClient} from "@angular/common/http";
-import {DataService} from "../software/data.service";
-import {ToastrService} from "ngx-toastr";
-import {CreateSoftwareComponent} from "../software/create-software/create-software.component";
-import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component";
-import {PageEvent} from "@angular/material/paginator";
-import {CreateOperativeSystemComponent} from "./create-operative-system/create-operative-system.component";
+import { Component, signal } from '@angular/core';
+import { MatTableDataSource } from "@angular/material/table";
+import { DatePipe } from "@angular/common";
+import { MatDialog } from "@angular/material/dialog";
+import { HttpClient } from "@angular/common/http";
+import { DataService } from "../software/data.service";
+import { ToastrService } from "ngx-toastr";
+import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
+import { PageEvent } from "@angular/material/paginator";
+import { CreateOperativeSystemComponent } from "./create-operative-system/create-operative-system.component";
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-operative-system',
@@ -17,14 +17,15 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrl: './operative-system.component.css'
 })
 export class OperativeSystemComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   images: { downloadUrl: string; name: string; uuid: string }[] = [];
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
   page: number = 0;
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
-  loading:boolean = false;
+  loading: boolean = false;
   filters: { [key: string]: string } = {};
   alertMessage: string | null = null;
   readonly panelOpenState = signal(false);
@@ -48,15 +49,16 @@ export class OperativeSystemComponent {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/operative-systems`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
-    private dataService: DataService,
+    private configService: ConfigService,
     private toastService: ToastrService,
     private joyrideService: JoyrideService
-  ) {}
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/operative-systems`;
+  }
 
   ngOnInit(): void {
     this.search();
@@ -73,7 +75,7 @@ export class OperativeSystemComponent {
   }
 
   search(): void {
-    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1 }&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
+    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
       (data) => {
         this.dataSource.data = data['hydra:member'];
         this.length = data['hydra:totalItems'];

ogWebconsole/src/app/components/repositories/backup-image/backup-image.component.ts

@@ -1,9 +1,10 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {Router} from "@angular/router";
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
+import { Component, Inject, OnInit } from '@angular/core';
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { Router } from "@angular/router";
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { ConfigService } from "@services/config.service";
 
 @Component({
   selector: 'app-backup-image',
@@ -11,7 +12,7 @@ import {FormBuilder, FormGroup, Validators} from "@angular/forms";
   styleUrl: './backup-image.component.css'
 })
 export class BackupImageComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   loading: boolean = false;
   form!: FormGroup;
 
@@ -21,9 +22,10 @@ export class BackupImageComponent implements OnInit {
     public dialogRef: MatDialogRef<BackupImageComponent>,
     private toastService: ToastrService,
     private router: Router,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: { imageImageRepository: any }
   ) {
-
+    this.baseUrl = this.configService.apiUrl;
   }
 
   ngOnInit(): void {

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

@@ -1,8 +1,9 @@
-import {Component, Inject} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {Router} from "@angular/router";
+import { Component, Inject } from '@angular/core';
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { Router } from "@angular/router";
+import { ConfigService } from "@services/config.service";
 
 @Component({
   selector: 'app-convert-image',
@@ -10,7 +11,7 @@ import {Router} from "@angular/router";
   styleUrl: './convert-image.component.css'
 })
 export class ConvertImageComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   loading: boolean = true;
   imageName: string = '';
 
@@ -19,9 +20,10 @@ export class ConvertImageComponent {
     public dialogRef: MatDialogRef<ConvertImageComponent>,
     private toastService: ToastrService,
     private router: Router,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: { repositoryUuid: any, name: string }
   ) {
-
+    this.baseUrl = this.configService.apiUrl;
   }
 
   ngOnInit(): void {

ogWebconsole/src/app/components/repositories/create-repository/create-repository.component.ts

@@ -1,9 +1,10 @@
-import {Component, Inject} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {DataService} from "../../images/data.service";
+import { Component, Inject } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { DataService } from "../../images/data.service";
+import { ConfigService } from "@services/config.service";
 
 @Component({
   selector: 'app-create-repository',
@@ -11,7 +12,7 @@ import {DataService} from "../../images/data.service";
   styleUrl: './create-repository.component.css'
 })
 export class CreateRepositoryComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   imageForm: FormGroup<any>;
   repositoryId: string | null = null;
   softwareProfiles: any[] = [];
@@ -22,8 +23,10 @@ export class CreateRepositoryComponent {
     public dialogRef: MatDialogRef<CreateRepositoryComponent>,
     private toastService: ToastrService,
     private dataService: DataService,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
     this.imageForm = this.fb.group({
       name: ['', Validators.required],
       ip: [''],

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

@@ -1,16 +1,17 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {Router} from "@angular/router";
+import { Component, Inject, OnInit } from '@angular/core';
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { Router } from "@angular/router";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-import-image',
   templateUrl: './import-image.component.html',
   styleUrl: './import-image.component.css'
 })
-export class ImportImageComponent implements OnInit{
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+export class ImportImageComponent implements OnInit {
+  baseUrl: string;
   loading: boolean = true;
   imageName: string = '';
 
@@ -19,9 +20,10 @@ export class ImportImageComponent implements OnInit{
     public dialogRef: MatDialogRef<ImportImageComponent>,
     private toastService: ToastrService,
     private router: Router,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: { repositoryUuid: any, name: string }
   ) {
-
+    this.baseUrl = this.configService.apiUrl;
   }
 
   ngOnInit(): void {

ogWebconsole/src/app/components/repositories/main-repository-view/main-repository-view.component.ts

@@ -1,14 +1,15 @@
-import {Component, Inject, OnInit} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
-import {HttpClient} from "@angular/common/http";
-import {ToastrService} from "ngx-toastr";
-import {DataService} from "../../images/data.service";
-import {ActivatedRoute} from "@angular/router";
-import {MatTableDataSource} from "@angular/material/table";
-import {DatePipe} from "@angular/common";
-import {Observable} from "rxjs";
-import {MatDialog} from "@angular/material/dialog";
-import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
+import { Component, Inject, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { HttpClient } from "@angular/common/http";
+import { ToastrService } from "ngx-toastr";
+import { DataService } from "../../images/data.service";
+import { ActivatedRoute } from "@angular/router";
+import { MatTableDataSource } from "@angular/material/table";
+import { DatePipe } from "@angular/common";
+import { Observable } from "rxjs";
+import { MatDialog } from "@angular/material/dialog";
+import { ServerInfoDialogComponent } from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-main-repository-view',
@@ -16,7 +17,8 @@ import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-
   styleUrl: './main-repository-view.component.css'
 })
 export class MainRepositoryViewComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   repositoryForm: FormGroup<any>;
   repositoryId: string | null = null;
   dataSource = new MatTableDataSource<any>();
@@ -81,7 +83,6 @@ export class MainRepositoryViewComponent implements OnInit {
     }
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
-  private apiUrl = `${this.baseUrl}/images`;
 
   constructor(
     private fb: FormBuilder,
@@ -90,7 +91,10 @@ export class MainRepositoryViewComponent implements OnInit {
     private dataService: DataService,
     private route: ActivatedRoute,
     public dialog: MatDialog,
+    private configService: ConfigService
   ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/images`;
     this.repositoryForm = this.fb.group({
       name: ['', Validators.required],
       ip: [''],

ogWebconsole/src/app/components/repositories/repositories.component.ts

@@ -8,6 +8,7 @@ import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delet
 import { JoyrideService } from 'ngx-joyride';
 import {CreateRepositoryComponent} from "./create-repository/create-repository.component";
 import { Router } from '@angular/router';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-repositories',
@@ -15,7 +16,8 @@ import { Router } from '@angular/router';
   styleUrl: './repositories.component.css'
 })
 export class RepositoriesComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
@@ -52,15 +54,17 @@ export class RepositoriesComponent implements OnInit {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/image-repositories`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private toastService: ToastrService,
     private joyrideService: JoyrideService,
-    private router: Router
-  ) {}
+    private router: Router,
+    private configService: ConfigService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/image-repositories`;
+  }
 
   ngOnInit(): void {
     this.search();

ogWebconsole/src/app/components/repositories/repository-images/repository-images.component.ts

@@ -12,6 +12,7 @@ import {BackupImageComponent} from "../backup-image/backup-image.component";
 import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
 import {ImportImageComponent} from "../import-image/import-image.component";
 import {ConvertImageComponent} from "../convert-image/convert-image.component";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-repository-images',
@@ -19,7 +20,8 @@ import {ConvertImageComponent} from "../convert-image/convert-image.component";
   styleUrl: './repository-images.component.css'
 })
 export class RepositoryImagesComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
@@ -63,7 +65,6 @@ export class RepositoryImagesComponent implements OnInit {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/image-image-repositories`;
   @Input() repositoryUuid: any
   private repositoryId: any;
 
@@ -72,7 +73,11 @@ export class RepositoryImagesComponent implements OnInit {
     private http: HttpClient,
     private toastService: ToastrService,
     private joyrideService: JoyrideService,
-  ) {}
+    private configService: ConfigService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/image-image-repositories`;
+  }
 
   ngOnInit(): void {
     if (this.repositoryUuid) {

ogWebconsole/src/app/components/software-profile/create-software-profile/create-software-profile.component.ts

@@ -7,6 +7,7 @@ import { DataService as SoftwareService } from '../../software/data.service';
 import { DataService } from '../data.service';
 import { Observable, startWith } from 'rxjs';
 import { debounceTime, switchMap, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-software-profile',
@@ -14,9 +15,9 @@ import { debounceTime, switchMap, map } from 'rxjs/operators';
   styleUrls: ['./create-software-profile.component.css']
 })
 export class CreateSoftwareProfileComponent implements OnInit {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   formGroup: FormGroup;
-  private apiUrl = `${this.baseUrl}/software-profiles`;
   softwareCollection: any[] = [];
   organizationalUnits: any[] = [];
   operativeSystems: any[] = [];
@@ -33,8 +34,11 @@ export class CreateSoftwareProfileComponent implements OnInit {
     private toastService: ToastrService,
     private softwareDataService: SoftwareService,
     private dataService: DataService,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/software-profiles`;
     this.formGroup = this.fb.group({
       description: [''],
       comments: [''],

ogWebconsole/src/app/components/software-profile/data.service.ts

@@ -1,16 +1,20 @@
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/software-profiles`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) { 
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/software-profiles`;
+  }
 
   getSoftwareProfiles(filters: { [key: string]: string }): Observable<any[]> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/software-profile/software-profile.component.ts

@@ -1,14 +1,15 @@
-import {Component, signal} from '@angular/core';
-import {MatTableDataSource} from "@angular/material/table";
-import {DatePipe} from "@angular/common";
-import {MatDialog} from "@angular/material/dialog";
-import {HttpClient} from "@angular/common/http";
-import {DataService} from "../software/data.service";
-import {ToastrService} from "ngx-toastr";
-import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component";
-import {PageEvent} from "@angular/material/paginator";
-import {CreateSoftwareProfileComponent} from "./create-software-profile/create-software-profile.component";
+import { Component, signal } from '@angular/core';
+import { MatTableDataSource } from "@angular/material/table";
+import { DatePipe } from "@angular/common";
+import { MatDialog } from "@angular/material/dialog";
+import { HttpClient } from "@angular/common/http";
+import { DataService } from "../software/data.service";
+import { ToastrService } from "ngx-toastr";
+import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
+import { PageEvent } from "@angular/material/paginator";
+import { CreateSoftwareProfileComponent } from "./create-software-profile/create-software-profile.component";
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-software-profile',
@@ -16,14 +17,15 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrl: './software-profile.component.css'
 })
 export class SoftwareProfileComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   images: { downloadUrl: string; name: string; uuid: string }[] = [];
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
   page: number = 0;
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
-  loading:boolean = false;
+  loading: boolean = false;
   filters: { [key: string]: string } = {};
   alertMessage: string | null = null;
   readonly panelOpenState = signal(false);
@@ -52,15 +54,17 @@ export class SoftwareProfileComponent {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/software-profiles`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private dataService: DataService,
     private toastService: ToastrService,
-    private joyrideService: JoyrideService
-  ) {}
+    private joyrideService: JoyrideService,
+    private configService: ConfigService
+  ) { 
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/software-profiles`;
+  }
 
   ngOnInit(): void {
     this.search();
@@ -77,7 +81,7 @@ export class SoftwareProfileComponent {
   }
 
   search(): void {
-    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1 }&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
+    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
       (data) => {
         this.dataSource.data = data['hydra:member'];
         this.length = data['hydra:totalItems'];
@@ -133,9 +137,9 @@ export class SoftwareProfileComponent {
 
   iniciarTour(): void {
     this.joyrideService.startTour({
-      steps: ['titleStep','addStep', 'filterStep', 'tableStep', 'actionsStep'],
+      steps: ['titleStep', 'addStep', 'filterStep', 'tableStep', 'actionsStep'],
       showPrevButton: true,
-      themeColor: '#3f51b5' 
+      themeColor: '#3f51b5'
     });
   }
 }

ogWebconsole/src/app/components/software/create-software/create-software.component.ts

@@ -1,9 +1,10 @@
-import {Component, Inject} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from "@angular/forms";
-import {HttpClient} from "@angular/common/http";
-import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
-import {ToastrService} from "ngx-toastr";
-import {DataService} from "../data.service";
+import { Component, Inject } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { HttpClient } from "@angular/common/http";
+import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import { ToastrService } from "ngx-toastr";
+import { DataService } from "../data.service";
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-create-software',
@@ -11,9 +12,9 @@ import {DataService} from "../data.service";
   styleUrl: './create-software.component.css'
 })
 export class CreateSoftwareComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
   formGroup: FormGroup<any>;
-  private apiUrl = `${this.baseUrl}/software`;
+  private apiUrl: string;
   softwareId: string | null = null;
 
   constructor(
@@ -22,8 +23,11 @@ export class CreateSoftwareComponent {
     public dialogRef: MatDialogRef<CreateSoftwareComponent>,
     private toastService: ToastrService,
     private dataService: DataService,
+    private configService: ConfigService,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/software`;
     this.formGroup = this.fb.group({
       name: ['', Validators.required],
       description: [''],

ogWebconsole/src/app/components/software/data.service.ts

@@ -1,16 +1,20 @@
 import { Injectable } from '@angular/core';
-import {HttpClient, HttpParams} from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
+import { ConfigService } from '@services/config.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class DataService {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
-  private apiUrl = `${this.baseUrl}/software`;
+  baseUrl: string;
+  private apiUrl: string;
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private configService: ConfigService) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/software`;
+  }
 
   getSoftwareCollection(filters: { [key: string]: string }): Observable<any[]> {
     const params = new HttpParams({ fromObject: filters });

ogWebconsole/src/app/components/software/software.component.ts

@@ -1,14 +1,15 @@
-import {Component, signal} from '@angular/core';
-import {MatTableDataSource} from "@angular/material/table";
-import {DatePipe} from "@angular/common";
-import {MatDialog} from "@angular/material/dialog";
-import {HttpClient} from "@angular/common/http";
-import {DataService} from "./data.service";
-import {ToastrService} from "ngx-toastr";
-import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component";
-import {PageEvent} from "@angular/material/paginator";
-import {CreateSoftwareComponent} from "./create-software/create-software.component";
+import { Component, signal } from '@angular/core';
+import { MatTableDataSource } from "@angular/material/table";
+import { DatePipe } from "@angular/common";
+import { MatDialog } from "@angular/material/dialog";
+import { HttpClient } from "@angular/common/http";
+import { DataService } from "./data.service";
+import { ToastrService } from "ngx-toastr";
+import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
+import { PageEvent } from "@angular/material/paginator";
+import { CreateSoftwareComponent } from "./create-software/create-software.component";
 import { JoyrideService } from 'ngx-joyride';
+import { ConfigService } from '@services/config.service';
 
 @Component({
   selector: 'app-software',
@@ -16,14 +17,15 @@ import { JoyrideService } from 'ngx-joyride';
   styleUrl: './software.component.css'
 })
 export class SoftwareComponent {
-  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  baseUrl: string;
+  private apiUrl: string;
   images: { downloadUrl: string; name: string; uuid: string }[] = [];
   dataSource = new MatTableDataSource<any>();
   length: number = 0;
   itemsPerPage: number = 10;
   page: number = 0;
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
-  loading:boolean = false;
+  loading: boolean = false;
   filters: { [key: string]: string } = {};
   alertMessage: string | null = null;
   readonly panelOpenState = signal(false);
@@ -57,15 +59,17 @@ export class SoftwareComponent {
   ];
   displayedColumns = [...this.columns.map(column => column.columnDef), 'actions'];
 
-  private apiUrl = `${this.baseUrl}/software`;
-
   constructor(
     public dialog: MatDialog,
     private http: HttpClient,
     private dataService: DataService,
     private toastService: ToastrService,
-    private joyrideService: JoyrideService
-  ) {}
+    private joyrideService: JoyrideService,
+    private configService: ConfigService
+  ) {
+    this.baseUrl = this.configService.apiUrl;
+    this.apiUrl = `${this.baseUrl}/software`;
+  }
 
   ngOnInit(): void {
     this.search();
@@ -82,7 +86,7 @@ export class SoftwareComponent {
   }
 
   search(): void {
-    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1 }&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
+    this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
       (data) => {
         this.dataSource.data = data['hydra:member'];
         this.length = data['hydra:totalItems'];
@@ -139,14 +143,14 @@ export class SoftwareComponent {
   iniciarTour(): void {
     this.joyrideService.startTour({
       steps: [
-      'titleStep',
-      'addSoftwareStep',
-      'searchStep',
-      'tableStep',
+        'titleStep',
+        'addSoftwareStep',
+        'searchStep',
+        'tableStep',
       ],
       showPrevButton: true,
       themeColor: '#3f51b5'
     });
   }
-  
+
 }

ogWebconsole/src/app/services/config.service.ts

@@ -25,4 +25,8 @@ export class ConfigService {
   get apiUrl(): string {
     return this.config.apiUrl;
   }
+
+  get mercureUrl(): string {
+    return this.config.mercureUrl;
+  }
 }

ogWebconsole/src/assets/config.json

@@ -1,3 +1,4 @@
 {
-    "apiUrl": "https://127.0.0.1:8443"
+    "apiUrl": "https://127.0.0.1:8443",
+    "mercureUrl": "http://localhost:3000/.well-known/mercure"
 }

ogWebconsole/tsconfig.json

@@ -21,7 +21,11 @@
     "lib": [
       "ES2022",
       "dom"
-    ]
+    ],
+    "baseUrl": "./",
+    "paths": {
+      "@services/*": ["src/app/services/*"],
+    }
   },
   "angularCompilerOptions": {
     "enableI18nLegacyMessageIdFormat": false,