Add repository loading functionality to Global Status component

ogWebconsole/src/app/components/global-status/global-status.component.html

@@ -40,7 +40,16 @@
       </div>
     </mat-tab>
 
-    <mat-tab label="Pxe"> Content 3 </mat-tab>
+    <mat-tab label="{{'repositories' | translate}}"> 
+      <div *ngIf="!loading" class="content-container">
+        <ul>
+          <li *ngFor="let repository of repositories">
+            {{ repository.name }}
+          </li>
+        </ul>
+      </div>
+    </mat-tab>
+    
   </mat-tab-group>
 </mat-dialog-content>
 <mat-dialog-actions class="action-container">

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

@@ -20,6 +20,8 @@ export class GlobalStatusComponent implements OnInit {
     domain: ['#df200d', '#26a700']
   };
   view: [number, number] = [400, 220];
+  repositoriesUrl: string;
+  repositories: any[] = [];
 
   ogBootApiUrl: string;
   ogBootDiskUsage: any = {};
@@ -40,6 +42,7 @@ export class GlobalStatusComponent implements OnInit {
     this.baseUrl = this.configService.apiUrl;
     this.ogBootApiUrl = `${this.baseUrl}/og-boot/status`;
     this.dhcpApiUrl = `${this.baseUrl}/og-dhcp/status`;
+    this.repositoriesUrl = `${this.baseUrl}/image-repositories`;
   }
 
   ngOnInit(): void {
@@ -91,6 +94,20 @@ export class GlobalStatusComponent implements OnInit {
     });
   }
 
+  loadRepositories(): void {
+    this.loading = true;
+    this.http.get<any>(`${this.repositoriesUrl}?page=1&itemsPerPage=10`).subscribe(
+      data => {
+        this.repositories = data['hydra:member'];
+        this.loading = false;
+      },
+      error => {
+        console.error('Error fetching repositories', error);
+        this.loading = false;
+      }
+    );
+  }
+
   loadOgBootStatus(): void {
     this.isDhcp = false;
     this.loadStatus(this.ogBootApiUrl, this.ogBootDiskUsage, this.ogBootServicesStatus, this.ogBootDiskUsageChartData, this.installedOgLives, this.isDhcp);