Reading zone/-s data from remote dns service

Adamd5x · Dec 11, 2024 · 695e12d · 695e12d
1 parent 476c5a5
commit 695e12d
Show file tree

Hide file tree

Showing 8 changed files with 219 additions and 36 deletions.
diff --git a/src/hiPower.Core/ZoneService.cs b/src/hiPower.Core/ZoneService.cs
@@ -29,9 +29,18 @@ public Task<ErrorOr<bool>> CreateSlaveAsync ()
         return result;
     }
 
-    public Task<ErrorOr<object>> GetListAsync (string serviceId)
+    public async Task<ErrorOr<object>> GetListAsync (string serviceId)
     {
-        throw new NotImplementedException ();
+        var service = await serverService.GetAsync (serviceId);
+        var options = service.Value.Adapt<RemoteServiceOptions> ();
+        var result = await remoteZoneService.GetZonesListAsync (options);
+
+
+        if (result.IsError)
+        {
+            return result.Errors;
+        }
+        return result;
     }
 
     public Task<ErrorOr<object>> UpdateDetailsAsync ()

diff --git a/src/hiPower.WebApi/Controllers/ZonesController.cs b/src/hiPower.WebApi/Controllers/ZonesController.cs
@@ -20,5 +20,17 @@ public async Task<IActionResult> GetDetails ([FromRoute] string id, [FromRoute]
             }
             return Ok (new ApiResult<object>(!result.IsError, result.Value ));
         }
+
+        [HttpGet("{id}")]
+        [ProducesResponseType (StatusCodes.Status200OK, Type = typeof (ApiResult<object>))]
+        public async Task<IActionResult> GetZones ([FromRoute] string id)
+        {
+            var result = await zoneService.GetListAsync (id);
+            if (result.IsError && result.FirstError.Type == ErrorType.NotFound)
+            {
+                return NotFound ();
+            }
+            return Ok (new ApiResult<object> (!result.IsError, result.Value));
+        }
     }
 }
diff --git a/src/powerdns-manager/src/app/features/dashboard/zones/home/home.component.html b/src/powerdns-manager/src/app/features/dashboard/zones/home/home.component.html
@@ -1,27 +1,90 @@
-<p>zones home works!</p>
-<ng-container *ngIf="zoneDetails$ | async as zone">
-    <ul>
-        <li><span>Name</span>{{ zone.name }}</li>
-        <li><span>Serial</span>{{ zone.serial }}</li>
-        <li><span>Last check</span>{{ zone.last_check }}</li>
-        <li><span>Kind</span>{{ zone.kind }}</li>
-        <li><span>DNS SEC</span>{{ zone.dnssec}}</li>
-        <li><span>Records no</span>{{ zone.rrsets.length }}</li>
-        <li><span>Api rectify</span>{{ zone.api_rectify}}</li>
-        <li><span>Url</span>{{ zone.url }}</li>
-    </ul>
-    <hr>
-    <ul>
-    @for(item of zone.rrsets; track (item.type + item.name) ) {
-        <li><span>{{ item.type }}</span><br/>
-            Name: {{ item.name }}<br/>
-            values: 
+<loading></loading>
+<ng-container>
+    <div class="listContainer">
+        <div>
+            <mat-list>
+                <div mat-subheader class="header">Data centers</div>
+                @for(dataCenter of dataCenters$ | async; track dataCenter.id) {
+                    <mat-list-item>
+                        <mat-icon matListItemIcon>folder</mat-icon>
+                        <div matListItemTitle
+                             class="listItem">
+                            <a (click)="onDataCenterClick(dataCenter.id!)">
+                                {{ dataCenter.name }}
+                            </a>
+                        </div>
+                        <div matListItemLine
+                             class="description">
+                            {{ dataCenter.city }} (Country: {{ dataCenter.country }})
+                        </div>
+                    </mat-list-item>
+                }
+            </mat-list>            
+        </div>
+        <div>
+            <mat-list>
+                <div mat-subheader class="header">Services</div>
+                @for(service of services$ | async; track service.id) {
+                    <mat-list-item>
+                        <mat-icon matListItemIcon>folder</mat-icon>
+                        <div matListItemTitle
+                             class="listItem">
+                            <a (click)="onServiceClick(service.id)">
+                                {{ service.name }}
+                            </a>
+                        </div>
+                        <div matListItemLine>
+                            {{ service.proto}}://{{ service.hostAddress }}:{{ service.port}}
+                        </div>
+                    </mat-list-item>
+                }
+            </mat-list>
+        </div>
+        <div>
+            <mat-list>
+                <div mat-subheader class="header">Zones</div>
+                @for(zoneItem of zones$ | async; track zoneItem.id) {
+                    <mat-list-item>
+                        <mat-icon matListItemIcon>map</mat-icon>
+                        <div matListItemTitle
+                             class="listItem">
+                            <a (click)="onZoneDetailsClick(zoneItem.id)">
+                                {{ zoneItem.name }}
+                            </a>
+                        </div>
+                    </mat-list-item>
+                }
+            </mat-list>
+        </div>
+    </div>
+</ng-container>
+
+<div class="resultContainer">
+    <ng-container *ngIf="zoneDetails$ | async as zone">
+        <ul>
+            <li><span>Name</span>{{ zone.name }}</li>
+            <li><span>Serial</span>{{ zone.serial }}</li>
+            <li><span>Last check</span>{{ zone.last_check }}</li>
+            <li><span>Kind</span>{{ zone.kind }}</li>
+            <li><span>DNS SEC</span>{{ zone.dnssec}}</li>
+            <li><span>Records no</span>{{ zone.rrsets.length }}</li>
+            <li><span>Api rectify</span>{{ zone.api_rectify}}</li>
+            <li><span>Url</span>{{ zone.url }}</li>
+        </ul>
+        <div class="details">
             <ul>
-            @for(recordValue of item.records; track recordValue.content ) {
-                <li>{{ recordValue.content }}</li>
+            @for(item of zone.rrsets; track (item.type + item.name) ) {
+                <li><span>{{ item.type }}</span><br/>
+                    Name: {{ item.name }}<br/>
+                    values: 
+                    <ul>
+                    @for(recordValue of item.records; track recordValue.content ) {
+                        <li>{{ recordValue.content }}</li>
+                    }
+                    </ul>
+                </li>
             }
             </ul>
-        </li>
-    }
-    </ul>
-</ng-container>
+        </div>
+    </ng-container>
+</div>
diff --git a/src/powerdns-manager/src/app/features/dashboard/zones/home/home.component.scss b/src/powerdns-manager/src/app/features/dashboard/zones/home/home.component.scss
@@ -1,3 +1,5 @@
+@import '/src/styles/utils/variables';
+
 :host {
     ul {
         font-size: 1rem;
@@ -21,4 +23,55 @@
             list-style-type: '- ';
         }
     }
+
+    .listContainer {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        column-gap: 1rem;
+        margin-bottom: 1rem;
+
+        .header {
+            font-size: 1rem;
+            font-weight: 600;
+            text-decoration: underline;
+        }
+
+        > div {
+            background-color: $color-white;
+            height: 280px;
+            overflow: hidden;
+            overflow-y: auto;            
+        }
+
+
+        .listItem {
+            a {
+                color: $color-blue-navy;
+                font-size: 0.9rem;
+                font-weight: 600;
+
+                &:hover {
+                    cursor: pointer;
+                    text-decoration: underline;
+                }
+            }
+            .description {
+                color: $color-blue-navy !important;
+            }
+        }
+    }
+
+    .resultContainer {
+        height: 500px !important;
+        width: 1550px;
+        overflow: hidden;
+        background-color: $color-white;
+
+        .details {
+            border-top: solid 1px $color-blue-navy;
+            height: 300px;
+            overflow: hidden;
+            overflow-y: scroll;
+        }
+    }
 }
diff --git a/src/powerdns-manager/src/app/features/dashboard/zones/home/home.component.ts b/src/powerdns-manager/src/app/features/dashboard/zones/home/home.component.ts
@@ -2,6 +2,12 @@ import { Component, OnInit } from '@angular/core';
 import { ZonesService } from '../services/zones.service';
 import { EMPTY, Observable } from 'rxjs';
 import { ZoneDetails } from '../core/models/zone-details';
+import { DataCenterService } from '@features/dashboard/data-centers/services/data-center.service';
+import { DataCenter } from '@features/dashboard/data-centers/core/models/data-center';
+import { ServerService } from '../../servers/services/server-service.service';
+import { Server } from '@features/dashboard/servers/core/models/server';
+import { ZoneItem } from '../core/models/zone-item';
+import { LoadingService } from '@shared/components/loading/loading.service';
 
 @Component({
   selector: 'app-home-zones',
@@ -10,12 +16,45 @@ import { ZoneDetails } from '../core/models/zone-details';
 })
 export class HomeComponent implements OnInit {
 
+  dataCenters$: Observable<DataCenter[]> = EMPTY;
+  services$: Observable<Server[]> = EMPTY;
+  zones$: Observable<ZoneItem[]> = EMPTY;
   zoneDetails$: Observable<ZoneDetails> = EMPTY;
 
-  constructor(private zonesService: ZonesService){}
+  private dataCenterId = '';
+  private serviceId = '';
+
+  constructor(private dataCenterService: DataCenterService,
+              private serviceService: ServerService,
+              private zonesService: ZonesService,
+              private loading: LoadingService){}
 
   ngOnInit(): void {
-    this.zoneDetails$ = this.zonesService.getDetails('313629D3-C43A-44CA-972D-EE92073791D5','example.com');
-    this.zoneDetails$.subscribe();
+    this.dataCenters$ = this.dataCenterService
+                            .getDataCentres();
+  }
+
+  onDataCenterClick(id: string): void {
+    this.dataCenterId = id;    
+    this.services$ = this.loading
+                         .showLoaderUntilCompleted(this.serviceService
+                                                       .getServers(this.dataCenterId));
+  }
+
+  onServiceClick(id: string): void {
+    this.serviceId = id;    
+    this.zones$ = this.loading
+                      .showLoaderUntilCompleted(this.zonesService
+                                                    .getList(this.serviceId));
+  }
+
+  onZoneDetailsClick(id: string): void {
+    console.log(`Data center id: ${this.dataCenterId}; Service Id: ${this.serviceId}; Zone Id: ${id}`);
+
+    this.zoneDetails$ = this.loading
+                            .showLoaderUntilCompleted(this.zonesService
+                            .getDetails(this.serviceId, id));
+    this.zoneDetails$
+        .subscribe();
   }
 }
diff --git a/src/powerdns-manager/src/app/features/dashboard/zones/services/zones.service.ts b/src/powerdns-manager/src/app/features/dashboard/zones/services/zones.service.ts
@@ -1,7 +1,8 @@
 import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
-import { filter, map, Observable,
-         of } from 'rxjs';
+import { filter,
+         map,
+         Observable } from 'rxjs';
 
 import { DataService } from '@shared/base/data.service';
 import { ConfigService } from 'src/app/initializer/config.service';
@@ -22,7 +23,7 @@ export class ZonesService extends DataService {
   }
 
   getList(serviceId: string): Observable<ZoneItem[]> {
-    return this.get<ApiResponse<ZoneItem[]>>(`${this.apiUrl}`)
+    return this.get<ApiResponse<ZoneItem[]>>(`${this.apiUrl}/${serviceId}`)
                .pipe(
                   filter(x => x.success),
                   map(x => x.data as ZoneItem[])

diff --git a/src/powerdns-manager/src/app/features/dashboard/zones/zones.module.ts b/src/powerdns-manager/src/app/features/dashboard/zones/zones.module.ts
@@ -6,6 +6,11 @@ import { SharedModule } from '@shared/shared.module';
 import { MaterialsModule } from '@shared/materiald.module';
 import { ZonesService } from '@features/dashboard/zones/services/zones.service';
 import { ManagerErrorHandler } from '@shared/handlers/manager-error-handler';
+import { DataCenterService } from '../data-centers/services/data-center.service';
+import { ServerService } from '../servers/services/server-service.service';
+import { LoadingService } from '@shared/components/loading/loading.service';
+import { LoadingModule } from '@shared/components/loading/loading.module';
+
 
 @NgModule({
   declarations: [
@@ -15,10 +20,14 @@ import { ManagerErrorHandler } from '@shared/handlers/manager-error-handler';
     CommonModule,
     ZonesRoutingModule,
     SharedModule,
-    MaterialsModule
+    MaterialsModule,
+    LoadingModule
   ],
   providers: [
     ZonesService,
+    DataCenterService,
+    ServerService,
+    LoadingService,
     {
       provide: ErrorHandler,
       useClass: ManagerErrorHandler

diff --git a/src/powerdns-manager/src/app/initializer/config.service.ts b/src/powerdns-manager/src/app/initializer/config.service.ts
@@ -41,9 +41,6 @@ export class ConfigService {
   getEndpoint(type: EndpointType): string {
     const endpoints = this.getEndpoints();
     const found = endpoints[type];
-
-    console.log(`Endpoint url: ${environment.apiUrl}/${found?.url}`);
-
     return found?.url;
   }