diff --git a/ogWebconsole/src/app/app-routing.module.ts b/ogWebconsole/src/app/app-routing.module.ts
index c87b1d9..241d28a 100644
--- a/ogWebconsole/src/app/app-routing.module.ts
+++ b/ogWebconsole/src/app/app-routing.module.ts
@@ -13,14 +13,11 @@ import { PXEimagesComponent } from './components/ogboot/pxe-images/pxe-images.co
 import { PxeComponent } from './components/ogboot/pxe/pxe.component';
 import { PxeBootFilesComponent } from './components/ogboot/pxe-boot-files/pxe-boot-files.component';
 import {OgbootStatusComponent} from "./components/ogboot/ogboot-status/ogboot-status.component";
-import { OgdhcpComponent } from './components/ogdhcp/ogdhcp.component';
-import { OgDhcpSubnetsComponent } from './components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component';
 import { CalendarComponent } from "./components/calendar/calendar.component";
 import { CommandsComponent } from './components/commands/main-commands/commands.component';
 import { CommandsGroupsComponent } from './components/commands/commands-groups/commands-groups.component';
 import { CommandsTaskComponent } from './components/commands/commands-task/commands-task.component';
 import { TaskLogsComponent } from './components/commands/commands-task/task-logs/task-logs.component';
-import { StatusComponent } from "./components/ogdhcp/og-dhcp-subnets/status/status.component";
 import { ClientMainViewComponent } from './components/groups/components/client-main-view/client-main-view.component';
 import { ImagesComponent } from './components/images/images.component';
 import {SoftwareComponent} from "./components/software/software.component";
@@ -41,6 +38,8 @@ import {
 } from "./components/repositories/main-repository-view/main-repository-view.component";
 import {EnvVarsComponent} from "./components/admin/env-vars/env-vars.component";
 import {MenusComponent} from "./components/menus/menus.component";
+import {OgDhcpSubnetsComponent} from "./components/ogdhcp/og-dhcp-subnets.component";
+import {StatusComponent} from "./components/ogdhcp/status/status.component";
 const routes: Routes = [
   { path: '', redirectTo: 'auth/login', pathMatch: 'full' },
   { path: '', component: MainLayoutComponent,
@@ -55,7 +54,6 @@ const routes: Routes = [
       { path: 'pxe', component: PxeComponent },
       { path: 'pxe-boot-file', component: PxeBootFilesComponent },
       { path: 'ogboot-status', component: OgbootStatusComponent },
-      { path: 'dhcp', component: OgdhcpComponent },
       { path: 'subnets', component: OgDhcpSubnetsComponent },
       { path: 'ogdhcp-status', component: StatusComponent },
       { path: 'commands', component: CommandsComponent },
diff --git a/ogWebconsole/src/app/app.module.ts b/ogWebconsole/src/app/app.module.ts
index 7af2819..13805e0 100644
--- a/ogWebconsole/src/app/app.module.ts
+++ b/ogWebconsole/src/app/app.module.ts
@@ -75,10 +75,6 @@ import { MatExpansionPanel, MatExpansionPanelDescription, MatExpansionPanelTitle
 import { OgbootStatusComponent } from './components/ogboot/ogboot-status/ogboot-status.component';
 import { CreatePxeBootFileComponent } from './components/ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component';
 import { NgxChartsModule } from '@swimlane/ngx-charts';
-import { OgdhcpComponent } from './components/ogdhcp/ogdhcp.component';
-import { OgDhcpSubnetsComponent } from './components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component';
-import { CreateSubnetComponent } from './components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component';
-import { AddClientsToSubnetComponent } from './components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component';
 import { CommandsComponent } from './components/commands/main-commands/commands.component';
 import { CommandDetailComponent } from './components/commands/main-commands/detail-command/command-detail.component';
 import { CreateCommandComponent } from './components/commands/main-commands/create-command/create-command.component';
@@ -95,8 +91,6 @@ import { DetailCommandGroupComponent } from './components/commands/commands-grou
 import { CreateTaskComponent } from './components/commands/commands-task/create-task/create-task.component';
 import { DetailTaskComponent } from './components/commands/commands-task/detail-task/detail-task.component';
 import { TaskLogsComponent } from './components/commands/commands-task/task-logs/task-logs.component';
-import { ServerInfoDialogComponent } from './components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component';
-import { StatusComponent } from './components/ogdhcp/og-dhcp-subnets/status/status.component';
 import { MatSliderModule } from '@angular/material/slider';
 import { ClientMainViewComponent } from './components/groups/components/client-main-view/client-main-view.component';
 import { ImagesComponent } from './components/images/images.component';
@@ -131,6 +125,13 @@ import { RepositoryImagesComponent } from './components/repositories/repository-
 import { InputDialogComponent } from './components/commands/commands-task/task-logs/input-dialog/input-dialog.component';
 import { ManageOrganizationalUnitComponent } from './components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component';
 import { BackupImageComponent } from './components/repositories/backup-image/backup-image.component';
+import {ServerInfoDialogComponent} from "./components/ogdhcp/server-info-dialog/server-info-dialog.component";
+import {StatusComponent} from "./components/ogdhcp/status/status.component";
+import {OgDhcpSubnetsComponent} from "./components/ogdhcp/og-dhcp-subnets.component";
+import {CreateSubnetComponent} from "./components/ogdhcp/create-subnet/create-subnet.component";
+import {AddClientsToSubnetComponent} from "./components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component";
+import { ShowClientsComponent } from './components/ogdhcp/show-clients/show-clients.component';
+import { OperationResultDialogComponent } from './components/ogdhcp/operation-result-dialog/operation-result-dialog.component';
 export function HttpLoaderFactory(http: HttpClient) {
   return new TranslateHttpLoader(http, './locale/', '.json');
 }
@@ -169,7 +170,6 @@ export function HttpLoaderFactory(http: HttpClient) {
     PxeBootFilesComponent,
     OgbootStatusComponent,
     CreatePxeBootFileComponent,
-    OgdhcpComponent,
     OgDhcpSubnetsComponent,
     CreateSubnetComponent,
     AddClientsToSubnetComponent,
@@ -218,6 +218,8 @@ export function HttpLoaderFactory(http: HttpClient) {
     InputDialogComponent,
     ManageOrganizationalUnitComponent,
     BackupImageComponent,
+    ShowClientsComponent,
+    OperationResultDialogComponent,
   ],
   bootstrap: [AppComponent],
   imports: [BrowserModule,
diff --git a/ogWebconsole/src/app/components/groups/groups.component.css b/ogWebconsole/src/app/components/groups/groups.component.css
index dc010f8..d461702 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.css
+++ b/ogWebconsole/src/app/components/groups/groups.component.css
@@ -353,9 +353,9 @@ mat-tree mat-tree-node.disabled:hover {
 }
 
 .client-image {
-  width: 60px;
-  height: 60px;
-  margin-bottom: 15px;
+  max-width: 30px !important;
+  max-height: 30px !important;
+  height: auto;
 }
 
 .client-name {
@@ -478,7 +478,7 @@ mat-tree mat-tree-node.disabled:hover {
     display: flex;
     flex-direction: column;
   }
-  
+
 }
 
 .clients-title-name {
@@ -508,7 +508,7 @@ mat-button-toggle-group {
 }
 
 .mat-button-toggle-group .mat-button-toggle {
-  height: 36px; 
+  height: 36px;
   background-color: #3f51b5;
   color: white;
   border: none;
diff --git a/ogWebconsole/src/app/components/groups/groups.component.html b/ogWebconsole/src/app/components/groups/groups.component.html
index 64592af..6ba9d30 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.html
+++ b/ogWebconsole/src/app/components/groups/groups.component.html
@@ -272,28 +272,18 @@
                 </td>
               </ng-container>
 
-              <ng-container matColumnDef="sync">
-                <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ 'sync' | translate }} </th>
-                <td mat-cell *matCellDef="let client">
-                  <button *ngIf="(!syncStatus || syncingClientId !== client.uuid)" mat-icon-button color="primary"
-                    (click)="getStatus(client, selectedNode)">
-                    <mat-icon>sync</mat-icon>
-                  </button>
-
-                  <button *ngIf="syncStatus && syncingClientId === client.uuid" mat-icon-button color="primary">
-                    <mat-spinner diameter="24"></mat-spinner>
-                  </button>
-                </td>
-              </ng-container>
               <ng-container matColumnDef="name">
                 <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ 'name' | translate }} </th>
                 <td mat-cell *matCellDef="let client" matTooltip="{{ getClientPath(client) }}" matTooltipPosition="left"
                   matTooltipShowDelay="500">
-                  <div class="client-info">
-                    <div class="client-name">{{ client.name }}</div>
-                    <div class="client-ip">{{ client.ip }}</div>
-                    <div class="client-ip">{{ client.mac }}</div>
-                  </div>
+                  {{ client.name }}
+                </td>
+              </ng-container>
+              <ng-container matColumnDef="ip">
+                <th mat-header-cell *matHeaderCellDef mat-sort-header>IP </th>
+                <td mat-cell *matCellDef="let client" matTooltip="{{ getClientPath(client) }}" matTooltipPosition="left"
+                    matTooltipShowDelay="500">
+                  {{ client.ip }}
                 </td>
               </ng-container>
               <ng-container matColumnDef="oglive">
@@ -338,6 +328,10 @@
                       <mat-icon>visibility</mat-icon>
                       <span>{{ 'viewDetails' | translate }}</span>
                     </button>
+                    <button mat-menu-item (click)="getStatus(client, selectedNode)">
+                      <mat-icon>sync</mat-icon>
+                      <span>{{ 'sync' | translate }}</span>
+                    </button>
                     <button mat-menu-item (click)="onDeleteClick($event, client)">
                       <mat-icon>delete</mat-icon>
                       <span>{{ 'delete' | translate }}</span>
@@ -361,4 +355,4 @@
       </div>
     </div>
   </div>
-</ng-template>
\ No newline at end of file
+</ng-template>
diff --git a/ogWebconsole/src/app/components/groups/groups.component.ts b/ogWebconsole/src/app/components/groups/groups.component.ts
index d2367f3..4970660 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.ts
+++ b/ogWebconsole/src/app/components/groups/groups.component.ts
@@ -62,7 +62,7 @@ export class GroupsComponent implements OnInit, OnDestroy {
   private originalTreeData: TreeNode[] = [];
   arrayClients: any[] = [];
 
-  displayedColumns: string[] = ['select', 'status', 'sync', 'name', 'oglive', 'subnet', 'pxeTemplate', 'actions'];
+  displayedColumns: string[] = ['select', 'status', 'ip', 'name', 'oglive', 'subnet', 'pxeTemplate', 'actions'];
 
   private _sort!: MatSort;
   private _paginator!: MatPaginator;
diff --git a/ogWebconsole/src/app/components/groups/model/model.ts b/ogWebconsole/src/app/components/groups/model/model.ts
index aaa5b3e..96ce710 100644
--- a/ogWebconsole/src/app/components/groups/model/model.ts
+++ b/ogWebconsole/src/app/components/groups/model/model.ts
@@ -36,6 +36,8 @@ export interface Client {
   "@type": string;
   id: number;
   name: string;
+  ogLive: any;
+  pxtTemplate: any;
   type: string;
   serialNumber: string;
   netiface: string;
diff --git a/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.html b/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.html
index c5a785f..95fedc9 100644
--- a/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.html
+++ b/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.html
@@ -101,6 +101,14 @@
                 <mat-label>Máscara de Red</mat-label>
                 <input matInput formControlName="netmask">
             </mat-form-field>
+          <mat-form-field class="form-field">
+            <mat-label i18n="@@netiface-label">Interfaz de red</mat-label>
+            <mat-select formControlName="netiface">
+              <mat-option *ngFor="let type of netifaceTypes" [value]="type.value">
+                {{ type.name }}
+              </mat-option>
+            </mat-select>
+          </mat-form-field>
             <mat-form-field class="form-field">
                 <mat-label>Router</mat-label>
                 <input matInput formControlName="router">
@@ -174,4 +182,4 @@
             [disabled]="!generalFormGroup.valid || !additionalInfoFormGroup.valid || !networkSettingsFormGroup.valid">{{
             isEditMode ? 'Editar' : 'Crear' }}</button>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.ts b/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.ts
index e99f7d3..d7482a1 100644
--- a/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.ts
+++ b/ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.ts
@@ -41,6 +41,11 @@ export class ManageOrganizationalUnitComponent implements OnInit {
     { "name": 'Half duplex', "value": "half" },
     { "name": 'Full duplex', "value": "full" },
   ];
+  protected netifaceTypes = [
+    { name: 'Eth0', value: 'eth0' },
+    { name: 'Eth1', value: 'eth1' },
+    { name: 'Eth2', value: 'eth2' }
+  ];
   @Output() unitAdded = new EventEmitter();
   calendars: any;
   loading: boolean = false;
@@ -75,6 +80,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
       netmask: [null],
       router: [null],
       ntp: [null],
+      netiface: [null],
       p2pMode: [null],
       p2pTime: [null],
       mcastIp: [null],
@@ -260,6 +266,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
           netmask: data.networkSettings.netmask,
           router: data.networkSettings.router,
           ntp: data.networkSettings.ntp,
+          netiface: data.networkSettings.netiface,
           p2pMode: data.networkSettings.p2pMode,
           p2pTime: data.networkSettings.p2pTime,
           mcastIp: data.networkSettings.mcastIp,
diff --git a/ogWebconsole/src/app/components/images/images.component.ts b/ogWebconsole/src/app/components/images/images.component.ts
index 28e41a7..d59a887 100644
--- a/ogWebconsole/src/app/components/images/images.component.ts
+++ b/ogWebconsole/src/app/components/images/images.component.ts
@@ -5,11 +5,8 @@ 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 {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component";
-import {ServerInfoDialogComponent} from "../ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component";
 import {Observable} from "rxjs";
 import { JoyrideService } from 'ngx-joyride';
-import {ExportImageComponent} from "./export-image/export-image.component";
 
 @Component({
   selector: 'app-images',
diff --git a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts
index 1d039f2..8fc85f0 100644
--- a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts
+++ b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts
@@ -4,7 +4,6 @@ import { HttpClient } from '@angular/common/http';
 import { ToastrService } from 'ngx-toastr';
 import { PageEvent } from '@angular/material/paginator';
 import {Observable} from "rxjs";
-import {ServerInfoDialogComponent} from "../../ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component";
 import { JoyrideService } from 'ngx-joyride';
 
 @Component({
diff --git a/ogWebconsole/src/app/components/ogboot/pxe-images/pxe-images.component.ts b/ogWebconsole/src/app/components/ogboot/pxe-images/pxe-images.component.ts
index 9999831..5b1ea3a 100644
--- a/ogWebconsole/src/app/components/ogboot/pxe-images/pxe-images.component.ts
+++ b/ogWebconsole/src/app/components/ogboot/pxe-images/pxe-images.component.ts
@@ -9,10 +9,9 @@ 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 {ServerInfoDialogComponent} from "../../ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component";
-import {ShowTemplateContentComponent} from "../pxe/show-template-content/show-template-content.component";
 import {Observable} from "rxjs";
 import { JoyrideService } from 'ngx-joyride';
+import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
 
 @Component({
   selector: 'app-pxe-images',
diff --git a/ogWebconsole/src/app/components/ogboot/pxe/pxe.component.ts b/ogWebconsole/src/app/components/ogboot/pxe/pxe.component.ts
index c0ff7a7..b9ed0d4 100644
--- a/ogWebconsole/src/app/components/ogboot/pxe/pxe.component.ts
+++ b/ogWebconsole/src/app/components/ogboot/pxe/pxe.component.ts
@@ -8,10 +8,10 @@ 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 {ServerInfoDialogComponent} from "../../ogdhcp/og-dhcp-subnets/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 {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
 
 @Component({
   selector: 'app-pxe',
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.css b/ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.css
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.css
rename to ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.css
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.html b/ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.html
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.html
rename to ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.html
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.ts b/ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.ts
similarity index 67%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.ts
rename to ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.ts
index c7382ef..7e72ac0 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/add-clients-to-subnet/add-clients-to-subnet.component.ts
@@ -1,8 +1,9 @@
 import { Component, OnInit, Inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { MatDialogRef, MAT_DIALOG_DATA } 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";
 
 @Component({
   selector: 'app-add-clients-to-subnet',
@@ -22,6 +23,7 @@ export class AddClientsToSubnetComponent implements OnInit {
     private http: HttpClient,
     public dialogRef: MatDialogRef<AddClientsToSubnetComponent>,
     private toastService: ToastrService,
+    public dialog: MatDialog,
     @Inject(MAT_DIALOG_DATA) public data: { subnetUuid: string, subnetName: string }
   ) {}
 
@@ -59,21 +61,25 @@ export class AddClientsToSubnetComponent implements OnInit {
   }
 
   save() {
-    this.selectedClients.forEach(clientId => {
-      const postData = { client: `/clients/${clientId}` };
+    const postData = { clients: this.selectedClients.map(clientId => `/clients/${clientId}`) };
 
-      this.http.post(`${this.baseUrl}/og-dhcp/server/${this.data.subnetUuid}/post-host`, postData).subscribe(
-        response => {
-          this.toastService.success(`Cliente asignado correctamente`);
-        },
-        error => {
-          console.error(`Error al asignar el cliente:`, error);
-          this.toastService.error(`Error al asignar el cliente: ${error.error['hydra:description']}`);
-        }
-      );
-    });
+    this.http.post(`${this.baseUrl}/og-dhcp/server/${this.data.subnetUuid}/post-host`, postData).subscribe(
+      (response: any) => {
+        this.dialog.open(OperationResultDialogComponent, {
+          width: '600px',
+          data: {
+            success: response.success || [],
+            errors: response.errors || []
+          }
+        });
 
-    this.dialogRef.close(this.selectedClients);
+        this.dialogRef.close(this.selectedClients);
+      },
+      error => {
+        console.error(`Error al asignar el cliente:`, error);
+        this.toastService.error(`Error al asignar el cliente: ${error.error['hydra:description']}`);
+      }
+    );
   }
 
   close() {
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.css b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.css
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.css
rename to ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.css
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.html b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.html
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.html
rename to ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.html
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.ts b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts
similarity index 97%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.ts
rename to ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts
index ada8414..0f3f710 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts
@@ -2,7 +2,7 @@ import { HttpClient } from '@angular/common/http';
 import { Component, Inject, OnInit } from '@angular/core';
 import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from '@angular/material/dialog';
 import { ToastrService } from 'ngx-toastr';
-import {DeleteModalComponent} from "../../../../shared/delete_modal/delete-modal/delete-modal.component";
+import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
 
 @Component({
   selector: 'app-create-subnet',
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.css b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.css
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.css
rename to ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.css
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.html b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.html
similarity index 94%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.html
rename to ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.html
index 1f3aac2..ae5a071 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.html
+++ b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.html
@@ -58,12 +58,7 @@
       </ng-container>
 
       <ng-container *ngIf="column.columnDef === 'clients'">
-        <button class="action-button" [matMenuTriggerFor]="menu">Ver clientes</button>
-        <mat-menu #menu="matMenu">
-          <button mat-menu-item *ngFor="let client of subnet.clients">
-            {{ client.name }}
-          </button>
-        </mat-menu>
+        <button class="action-button" (click)="openShowClientsDialog(subnet)" >Ver clientes</button>
       </ng-container>
 
       <ng-container *ngIf="column.columnDef !== 'synchronized' && column.columnDef !== 'clients'">
@@ -94,4 +89,4 @@
   <mat-paginator [length]="length" [pageSize]="itemsPerPage" [pageIndex]="page" [pageSizeOptions]="pageSizeOptions"
     (page)="onPageChange($event)">
   </mat-paginator>
-</div>
\ No newline at end of file
+</div>
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.spec.ts b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.spec.ts
similarity index 97%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.spec.ts
rename to ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.spec.ts
index 81460b5..0144ed2 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.spec.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.spec.ts
@@ -16,7 +16,7 @@ import { MatInputModule } from '@angular/material/input';
 import { MatTableModule } from '@angular/material/table';
 import { TranslateModule } from '@ngx-translate/core';
 import { JoyrideModule } from 'ngx-joyride';
-import { LoadingComponent } from '../../../shared/loading/loading.component';
+import { LoadingComponent } from '../../shared/loading/loading.component';
 
 describe('OgDhcpSubnetsComponent', () => {
   let component: OgDhcpSubnetsComponent;
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.ts b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts
similarity index 93%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.ts
rename to ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts
index 6305bda..af524d9 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts
@@ -4,12 +4,13 @@ import { MatTableDataSource } from '@angular/material/table';
 import { CreateSubnetComponent } from './create-subnet/create-subnet.component';
 import { MatDialog } from '@angular/material/dialog';
 import { HttpClient } from '@angular/common/http';
-import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component';
 import { ToastrService } from 'ngx-toastr';
 import { AddClientsToSubnetComponent } from './add-clients-to-subnet/add-clients-to-subnet.component';
 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";
 
 export interface Subnet {
   '@id': string;
@@ -30,7 +31,7 @@ export interface Subnet {
 }
 
 @Component({
-  selector: 'app-og-dhcp-subnets',
+  selector: 'app-ogdhcp',
   templateUrl: './og-dhcp-subnets.component.html',
   styleUrls: ['./og-dhcp-subnets.component.css']
 })
@@ -207,6 +208,20 @@ export class OgDhcpSubnetsComponent {
     );
   }
 
+  openShowClientsDialog(subnet: Subnet) {
+    const dialogRef = this.dialog.open(ShowClientsComponent, {
+      width: '100vw',
+      height: '100vh',
+      maxWidth: '100vw',
+      maxHeight: '100vh',
+      data: { subnetId: subnet.id, subnetName: subnet.name }
+    });
+
+    dialogRef.afterClosed().subscribe(result => {
+      this.loadSubnets();
+    });
+  }
+
   addClientsToSubnet(subnet: Subnet) {
     const dialogRef = this.dialog.open(AddClientsToSubnetComponent, {
       width: '600px',
diff --git a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.html b/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.html
deleted file mode 100644
index d680125..0000000
--- a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<p>ogdhcp works!</p>
diff --git a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.spec.ts b/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.spec.ts
deleted file mode 100644
index 0ab958d..0000000
--- a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.spec.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { OgdhcpComponent } from './ogdhcp.component';
-
-describe('OgdhcpComponent', () => {
-  let component: OgdhcpComponent;
-  let fixture: ComponentFixture<OgdhcpComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [OgdhcpComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(OgdhcpComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
diff --git a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.ts b/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.ts
deleted file mode 100644
index a8ee1b5..0000000
--- a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-ogdhcp',
-  templateUrl: './ogdhcp.component.html',
-  styleUrl: './ogdhcp.component.css'
-})
-export class OgdhcpComponent {
-
-}
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.css b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.css
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.css
rename to ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.css
diff --git a/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.html b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.html
new file mode 100644
index 0000000..3ca5963
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.html
@@ -0,0 +1 @@
+<p>operation-result-dialog works!</p>
diff --git a/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.spec.ts b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.spec.ts
new file mode 100644
index 0000000..21f235c
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OperationResultDialogComponent } from './operation-result-dialog.component';
+
+describe('OperationResultDialogComponent', () => {
+  let component: OperationResultDialogComponent;
+  let fixture: ComponentFixture<OperationResultDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [OperationResultDialogComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(OperationResultDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.ts b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.ts
new file mode 100644
index 0000000..5a9117b
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/operation-result-dialog/operation-result-dialog.component.ts
@@ -0,0 +1,62 @@
+import {Component, Inject} from '@angular/core';
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+
+
+@Component({
+  selector: 'app-operation-result-dialog',
+  template: `
+    <h2 mat-dialog-title>Resultado de la operación</h2>
+    <mat-dialog-content>
+      <div class="success-box" *ngIf="data.success.length > 0">
+        <h3>Éxitos</h3>
+        <ul>
+          <li *ngFor="let success of data.success">{{ success.client }} ✅</li>
+        </ul>
+      </div>
+
+      <div class="error-box" *ngIf="data.errors.length > 0">
+        <h3>Errores</h3>
+        <ul>
+          <li *ngFor="let error of data.errors">
+            {{ error.client }} ❌ - {{ error.error }}
+          </li>
+        </ul>
+      </div>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button color="primary" (click)="close()">Cerrar</button>
+    </mat-dialog-actions>
+  `,
+  styles: [`
+    mat-dialog-content { max-height: 400px; overflow-y: auto; }
+    h3 { margin-bottom: 5px; }
+
+    .success-box {
+      background-color: #d4edda;
+      color: #155724;
+      border: 1px solid #c3e6cb;
+      padding: 10px;
+      border-radius: 5px;
+      margin-bottom: 10px;
+    }
+
+    .error-box {
+      background-color: #f8d7da;
+      color: #721c24;
+      border: 1px solid #f5c6cb;
+      padding: 10px;
+      border-radius: 5px;
+      margin-bottom: 10px;
+    }
+  `]
+})
+export class OperationResultDialogComponent {
+  constructor(
+    public dialogRef: MatDialogRef<OperationResultDialogComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: { success: any[], errors: any[] }
+  ) {}
+
+  close() {
+    this.dialogRef.close();
+  }
+}
diff --git a/ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.css b/ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.css
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/ogdhcp.component.css
rename to ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.css
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.html b/ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.html
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.html
rename to ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.html
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.spec.ts b/ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.spec.ts
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.spec.ts
rename to ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.spec.ts
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.ts b/ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.ts
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.ts
rename to ogWebconsole/src/app/components/ogdhcp/server-info-dialog/server-info-dialog.component.ts
diff --git a/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.css b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.css
new file mode 100644
index 0000000..f28d4ee
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.css
@@ -0,0 +1,97 @@
+.full-width {
+  width: 100%;
+}
+
+form {
+  padding: 20px;
+}
+
+.spacing-container {
+  margin-top: 20px;
+  margin-bottom: 16px;
+}
+
+.list-item-content {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  width: 100%;
+}
+
+.text-content {
+  flex-grow: 1;
+  margin-right: 16px;
+  margin-left: 10px;
+}
+
+.icon-container {
+  display: flex;
+  align-items: center;
+}
+
+.right-icon {
+  margin-left: 8px;
+  cursor: pointer;
+}
+
+.action-container {
+  display: flex;
+  justify-content: flex-end;
+  gap: 1em;
+  padding: 1.5em;
+}
+.header-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 10px;
+  border-bottom: 1px solid #ddd;
+}
+
+.header-container-title {
+  flex-grow: 1;
+  text-align: left;
+  margin-left: 1em;
+}
+
+.lists-container {
+  padding: 16px;
+}
+
+.search-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  margin: 1.5rem 0rem 1.5rem 0rem;
+  box-sizing: border-box;
+}
+
+.search-string {
+  flex: 2;
+  padding: 5px;
+}
+
+table {
+  width: 100%;
+}
+
+.mat-elevation-z8 {
+  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.2);
+}
+
+.paginator-container {
+  display: flex;
+  justify-content: end;
+  margin-bottom: 30px;
+}
+
+mat-spinner {
+  margin: 0 auto;
+  align-self: center;
+}
+
+.subnets-button-row {
+  display: flex;
+  gap: 15px;
+}
diff --git a/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.html b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.html
new file mode 100644
index 0000000..0e16228
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.html
@@ -0,0 +1,75 @@
+<app-loading [isLoading]="loading"></app-loading>
+
+<h2 mat-dialog-title>Buscar clientes en {{data.subnetName}}</h2>
+
+<mat-dialog-content>
+  <div class="search-container">
+    <mat-form-field appearance="fill" class="search-string" joyrideStep="searchNameStep" text="Busca subredes por nombre para localizar una subred específica rápidamente.">
+      <mat-label i18n="@@searchLabel">Buscar nombre del cliente</mat-label>
+      <input matInput placeholder="Búsqueda" [(ngModel)]="filters['name']" i18n-placeholder="@@searchPlaceholder" (keyup.enter)="loadData()"
+             i18n-placeholder="@@searchPlaceholder">
+      <mat-icon matSuffix>search</mat-icon>
+      <button *ngIf="filters['name']" mat-icon-button matSuffix aria-label="Clear tree search" (click)="filters['name'] = ''; loadData()">
+        <mat-icon>close</mat-icon>
+      </button>
+      <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
+    </mat-form-field>
+    <mat-form-field appearance="fill" class="search-string" joyrideStep="searchIpStep" text="Busca clientes por IP.">
+      <mat-label i18n="@@searchLabel">Buscar IP</mat-label>
+      <input matInput placeholder="Búsqueda" [(ngModel)]="filters['ip']" i18n-placeholder="@@searchPlaceholder" (keyup.enter)="loadData()"
+             i18n-placeholder="@@searchPlaceholder">
+      <mat-icon matSuffix>search</mat-icon>
+      <button *ngIf="filters['ip']" mat-icon-button matSuffix aria-label="Clear tree search" (click)="filters['ip'] = ''; loadData()">
+        <mat-icon>close</mat-icon>
+      </button>
+      <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
+    </mat-form-field>
+    <mat-form-field appearance="fill" class="search-string" joyrideStep="searchIpStep" text="Busca clientes por la MAC">
+      <mat-label i18n="@@searchLabel">Buscar Mac</mat-label>
+      <input matInput placeholder="Búsqueda" [(ngModel)]="filters['mac']" i18n-placeholder="@@searchPlaceholder" (keyup.enter)="loadData()"
+             i18n-placeholder="@@searchPlaceholder">
+      <mat-icon matSuffix>search</mat-icon>
+      <button *ngIf="filters['mac']" mat-icon-button matSuffix aria-label="Clear tree search" (click)="filters['mac'] = ''; loadData()">
+        <mat-icon>close</mat-icon>
+      </button>
+      <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
+    </mat-form-field>
+  </div>
+
+  <app-loading [isLoading]="loading"></app-loading>
+  <table *ngIf="!loading" mat-table [dataSource]="dataSource" class="mat-elevation-z8" joyrideStep="tableStep"
+         text="Visualiza y administra las subredes listadas según los filtros aplicados.">
+    <ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
+      <th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
+      <td mat-cell *matCellDef="let client">
+        <ng-container *ngIf="column.columnDef === 'status'">
+          <img [src]="'assets/images/ordenador_' + client.status + '.png'" alt="Client Icon"
+               class="client-image" />
+        </ng-container>
+
+        <ng-container *ngIf="column.columnDef === 'ogLive'">
+          {{ client.ogLive?.date | date }}
+        </ng-container>
+
+        <ng-container *ngIf="column.columnDef !== 'status' && column.columnDef !== 'ogLive'">
+          {{ column.cell(client) }}
+        </ng-container>
+      </td>
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+  </table>
+
+  <div class="paginator-container" joyrideStep="paginationStep"
+       text="Navega entre las páginas de subredes usando el paginador.">
+    <mat-paginator [length]="length" [pageSize]="itemsPerPage" [pageIndex]="page" [pageSizeOptions]="pageSizeOptions"
+                   (page)="onPageChange($event)">
+    </mat-paginator>
+  </div>
+
+</mat-dialog-content>
+
+<mat-dialog-actions class="action-container">
+  <button class="ordinary-button" (click)="onNoClick()">Cancelar</button>
+</mat-dialog-actions>
diff --git a/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.spec.ts b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.spec.ts
new file mode 100644
index 0000000..5a64023
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.spec.ts
@@ -0,0 +1,72 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ShowClientsComponent } from './show-clients.component';
+import {MatExpansionModule} from "@angular/material/expansion";
+import {MatIconModule} from "@angular/material/icon";
+import {MatDividerModule} from "@angular/material/divider";
+import {MatFormFieldModule} from "@angular/material/form-field";
+import {MatSelectModule} from "@angular/material/select";
+import {MatPaginatorModule} from "@angular/material/paginator";
+import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
+import {FormsModule} from "@angular/forms";
+import {MatInputModule} from "@angular/material/input";
+import {MatTableModule} from "@angular/material/table";
+import {TranslateModule} from "@ngx-translate/core";
+import {JoyrideModule} from "ngx-joyride";
+import {MatDialog, MatDialogModule, MatDialogRef} from "@angular/material/dialog";
+import {HttpClient} from "@angular/common/http";
+import {ToastrService} from "ngx-toastr";
+import {of} from "rxjs";
+
+describe('ShowClientsComponent', () => {
+  let component: ShowClientsComponent;
+  let fixture: ComponentFixture<ShowClientsComponent>;
+  let mockDialog: jasmine.SpyObj<MatDialog>;
+  let mockHttpClient: jasmine.SpyObj<HttpClient>;
+  let mockToastrService: jasmine.SpyObj<ToastrService>;
+
+  beforeEach(async () => {
+    mockDialog = jasmine.createSpyObj('MatDialog', ['open']);
+    mockHttpClient = jasmine.createSpyObj('HttpClient', ['get', 'post', 'put', 'delete']);
+    mockToastrService = jasmine.createSpyObj('ToastrService', ['success', 'error']);
+    mockHttpClient.get.and.returnValue(of({ 'hydra:member': [], 'hydra:totalItems': 0 }));
+    mockHttpClient.post.and.returnValue(of({}));
+
+    await TestBed.configureTestingModule({
+      declarations: [ShowClientsComponent],
+      imports: [
+        MatExpansionModule,
+        MatIconModule,
+        MatDividerModule,
+        MatFormFieldModule,
+        MatSelectModule,
+        MatPaginatorModule,
+        BrowserAnimationsModule,
+        FormsModule,
+        MatInputModule,
+        MatDialogModule,
+        MatTableModule,
+        TranslateModule.forRoot(),
+        JoyrideModule.forRoot(),
+      ],
+      providers: [
+        { provide: MatDialog, useValue: mockDialog },
+        { provide: HttpClient, useValue: mockHttpClient },
+        { provide: ToastrService, useValue: mockToastrService },
+        {
+          provide: MatDialogRef,
+          useValue: {}
+        },
+      ],
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(ShowClientsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.ts b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.ts
new file mode 100644
index 0000000..0b50afc
--- /dev/null
+++ b/ogWebconsole/src/app/components/ogdhcp/show-clients/show-clients.component.ts
@@ -0,0 +1,73 @@
+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 {MatTableDataSource} from "@angular/material/table";
+import {Subnet} from "../og-dhcp-subnets.component";
+import {Client} from "../../groups/model/model";
+
+@Component({
+  selector: 'app-show-clients',
+  templateUrl: './show-clients.component.html',
+  styleUrl: './show-clients.component.css'
+})
+export class ShowClientsComponent implements OnInit {
+  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  dataSource = new MatTableDataSource<Client>([]);
+  length = 0;
+  itemsPerPage: number = 10;
+  pageSizeOptions: number[] = [5, 10, 20];
+  page = 0;
+  loading: boolean = false;
+  filters: { [key: string]: string } = {};
+
+  columns = [
+    { columnDef: 'id', header: 'ID', cell: (client: Client) => client.id },
+    { columnDef: 'status', header: 'Estado', cell: (client: Client) => client.status },
+    { columnDef: 'name', header: 'Name', cell: (client: Client) => client.name },
+    { columnDef: 'ip', header: 'Ip', cell: (client: Client) => client.ip },
+    { columnDef: 'mac', header: 'Mac', cell: (client: Client) => client.mac },
+    { columnDef: 'ogLive', header: 'OgLive', cell: (client: Client) => client.ogLive?.date },
+  ];
+
+  displayedColumns: string[] = ['id', 'status', 'name', 'ip', 'mac', 'ogLive'];
+
+  constructor(
+    private toastService: ToastrService,
+    private http: HttpClient,
+    public dialogRef: MatDialogRef<ShowClientsComponent>,
+    public dialog: MatDialog,
+    @Inject(MAT_DIALOG_DATA) public data: any
+  ) { }
+
+  ngOnInit(): void {
+    if (this.data) {
+      this.loadData();
+    }
+  }
+
+  loadData() {
+    this.loading = true;
+    this.http.get<any>(`${this.baseUrl}/clients?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}&subnet.id=${this.data.subnetId}`, { params: this.filters }).subscribe(
+      (data) => {
+        this.dataSource.data = data['hydra:member'];
+        this.length = data['hydra:totalItems'];
+        this.loading = false;
+      },
+      (error) => {
+        this.loading = false;
+      }
+    );
+    console.log(this.dataSource.data)
+  }
+
+  onNoClick(): void {
+    this.dialogRef.close();
+  }
+
+  onPageChange(event: any) {
+    this.page = event.pageIndex;
+    this.itemsPerPage = event.pageSize;
+    this.loadData()
+  }
+}
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.css b/ogWebconsole/src/app/components/ogdhcp/status/status.component.css
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.css
rename to ogWebconsole/src/app/components/ogdhcp/status/status.component.css
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.html b/ogWebconsole/src/app/components/ogdhcp/status/status.component.html
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.html
rename to ogWebconsole/src/app/components/ogdhcp/status/status.component.html
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.spec.ts b/ogWebconsole/src/app/components/ogdhcp/status/status.component.spec.ts
similarity index 96%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.spec.ts
rename to ogWebconsole/src/app/components/ogdhcp/status/status.component.spec.ts
index 2ca1517..6633f82 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.spec.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/status/status.component.spec.ts
@@ -20,7 +20,7 @@ import { ToastrModule } from 'ngx-toastr';
 import { NgxChartsModule } from '@swimlane/ngx-charts';
 import { TranslateModule } from '@ngx-translate/core';
 import { JoyrideModule } from 'ngx-joyride';
-import {LoadingComponent} from "../../../../shared/loading/loading.component";
+import {LoadingComponent} from "../../../shared/loading/loading.component";
 
 describe('StatusComponent', () => {
   let component: StatusComponent;
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.ts b/ogWebconsole/src/app/components/ogdhcp/status/status.component.ts
similarity index 100%
rename from ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.ts
rename to ogWebconsole/src/app/components/ogdhcp/status/status.component.ts
diff --git a/ogWebconsole/src/app/components/repositories/main-repository-view/main-repository-view.component.ts b/ogWebconsole/src/app/components/repositories/main-repository-view/main-repository-view.component.ts
index e398311..6d2433c 100644
--- a/ogWebconsole/src/app/components/repositories/main-repository-view/main-repository-view.component.ts
+++ b/ogWebconsole/src/app/components/repositories/main-repository-view/main-repository-view.component.ts
@@ -6,11 +6,9 @@ import {DataService} from "../../images/data.service";
 import {ActivatedRoute} from "@angular/router";
 import {MatTableDataSource} from "@angular/material/table";
 import {DatePipe} from "@angular/common";
-import {ServerInfoDialogComponent} from "../../ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component";
-import {CreateImageComponent} from "../../images/create-image/create-image.component";
-import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
 import {Observable} from "rxjs";
 import {MatDialog} from "@angular/material/dialog";
+import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
 
 @Component({
   selector: 'app-main-repository-view',
diff --git a/ogWebconsole/src/app/components/repositories/repository-images/repository-images.component.ts b/ogWebconsole/src/app/components/repositories/repository-images/repository-images.component.ts
index 652ebcc..2bfa9d1 100644
--- a/ogWebconsole/src/app/components/repositories/repository-images/repository-images.component.ts
+++ b/ogWebconsole/src/app/components/repositories/repository-images/repository-images.component.ts
@@ -5,12 +5,11 @@ import {MatDialog} from "@angular/material/dialog";
 import {HttpClient} from "@angular/common/http";
 import {ToastrService} from "ngx-toastr";
 import {JoyrideService} from "ngx-joyride";
-import {CreateImageComponent} from "../../images/create-image/create-image.component";
 import {Observable} from "rxjs";
-import {ServerInfoDialogComponent} from "../../ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component";
 import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
 import {ExportImageComponent} from "../../images/export-image/export-image.component";
 import {BackupImageComponent} from "../backup-image/backup-image.component";
+import {ServerInfoDialogComponent} from "../../ogdhcp/server-info-dialog/server-info-dialog.component";
 
 @Component({
   selector: 'app-repository-images',