NAS-130332 / 24.10 / Restore pod logs (#10424)

* NAS-130332: Restore pod logs * NAS-130332: Restore pod logs * NAS-130332: Restore pod logs --------- Co-authored-by: Boris Vasilenko <[email protected]> Co-authored-by: Evgeny Stepanovych <[email protected]>
truenas · Aug 11, 2024 · 80cfaf1 · 80cfaf1
1 parent 6c4afbe
commit 80cfaf1
Show file tree

Hide file tree

Showing 95 changed files with 257 additions and 303 deletions.
diff --git a/src/app/pages/apps/apps-routing.module.ts b/src/app/pages/apps/apps-routing.module.ts
@@ -8,6 +8,7 @@ import { CategoryViewComponent } from 'app/pages/apps/components/available-apps/
 import { DockerImagesListComponent } from 'app/pages/apps/components/docker-images/docker-images-list/docker-images-list.component';
 import { InstalledAppsComponent } from 'app/pages/apps/components/installed-apps/installed-apps.component';
 // import { PodShellComponent } from 'app/pages/apps/components/installed-apps/pod-shell/pod-shell.component';
+import { PodLogsComponent } from 'app/pages/apps/components/installed-apps/pod-logs/pod-logs.component';
 import { appNameResolver } from 'app/pages/apps/resolvers/app-name.resolver';
 import { AppDetailViewComponent } from './components/app-detail-view/app-detail-view.component';
 import { AppRouterOutletComponent } from './components/app-router-outlet/app-router-outlet.component';
@@ -59,11 +60,11 @@ const routes: Routes = [
               //   component: PodShellComponent,
               //   data: { title: T('Pod Shell') },
               // },
-              // {
-              //   path: 'logs/:podName/:command/:tail_lines',
-              //   component: PodLogsComponent,
-              //   data: { title: T('Pod Logs') },
-              // },
+              {
+                path: 'logs/:containerId',
+                component: PodLogsComponent,
+                data: { title: T('Pod Logs') },
+              },
             ],
           },
         ],

diff --git a/src/app/pages/apps/apps.module.ts b/src/app/pages/apps/apps.module.ts
@@ -62,6 +62,7 @@ import { AppSettingsButtonComponent } from 'app/pages/apps/components/installed-
 import { AppUpdateCellComponent } from 'app/pages/apps/components/installed-apps/app-update-cell/app-update-cell.component';
 import { AppWorkloadsCardComponent } from 'app/pages/apps/components/installed-apps/app-workloads-card/app-workloads-card.component';
 import { VolumeMountsDialogComponent } from 'app/pages/apps/components/installed-apps/app-workloads-card/volume-mounts-dialog/volume-mounts-dialog.component';
+import { PodLogsComponent } from 'app/pages/apps/components/installed-apps/pod-logs/pod-logs.component';
 import { PodSelectDialogComponent } from 'app/pages/apps/components/pod-select-dialog/pod-select-dialog.component';
 import { SelectPoolDialogComponent } from 'app/pages/apps/components/select-pool-dialog/select-pool-dialog.component';
 import { CustomFormsModule } from 'app/pages/apps/modules/custom-forms/custom-forms.module';
@@ -100,10 +101,9 @@ import { InstalledAppsComponent } from './components/installed-apps/installed-ap
     AppsScopeWrapperComponent,
     AppAvailableInfoCardComponent,
     // TODO: https://ixsystems.atlassian.net/browse/NAS-130392
-    // PodLogsComponent,
     // PodShellComponent,
+    PodLogsComponent,
     PodSelectDialogComponent,
-    // PodSelectLogsDialogComponent,
     AppUpgradeDialogComponent,
     AppDetailsHeaderComponent,
     AppBulkUpgradeComponent,

diff --git a/...pages/apps/components/installed-apps/app-workloads-card/app-workloads-card.component.html b/...pages/apps/components/installed-apps/app-workloads-card/app-workloads-card.component.html
@@ -72,17 +72,18 @@ <h4>
                   >
                     <ix-icon name="mdi-console"></ix-icon>
                   </button>
-                  <button
-                    mat-icon-button
-                    matTooltipPosition="above"
-                    [attr.aria-label]="'View Logs' | translate"
-                    [ixTest]="[container.service_name, 'view_logs']"
-                    [matTooltip]="'View Logs' | translate"
-                    (click)="viewLogsButtonPressed(container.service_name)"
-                  >
-                    <ix-icon name="mdi-text-box"></ix-icon>
-                  </button>
                 }
+
+                <button
+                  mat-icon-button
+                  matTooltipPosition="above"
+                  [attr.aria-label]="'View Logs' | translate"
+                  [ixTest]="[container.service_name, 'view_logs']"
+                  [matTooltip]="'View Logs' | translate"
+                  (click)="viewLogsButtonPressed(container)"
+                >
+                  <ix-icon name="mdi-text-box"></ix-icon>
+                </button>
               </div>
             }
           </div>

diff --git a/...es/apps/components/installed-apps/app-workloads-card/app-workloads-card.component.spec.ts b/...es/apps/components/installed-apps/app-workloads-card/app-workloads-card.component.spec.ts
@@ -111,7 +111,7 @@ describe('AppContainersCardComponent', () => {
 
     expect(containers[0].querySelector('.service-name')).toHaveText('netdata');
     expect(containers[0].querySelector('.container-state')).toHaveText('Running');
-    expect(containers[0].querySelectorAll('.container-action button')).toHaveLength(1);
+    expect(containers[0].querySelectorAll('.container-action button')).toHaveLength(2);
   });
 
   it('opens volume mounts dialog when Volume Mounts button is pressed', async () => {

diff --git a/...p/pages/apps/components/installed-apps/app-workloads-card/app-workloads-card.component.ts b/...p/pages/apps/components/installed-apps/app-workloads-card/app-workloads-card.component.ts
@@ -71,23 +71,15 @@ export class AppWorkloadsCardComponent {
   // });
   }
 
-  viewLogsButtonPressed(_: string): void {
-  // TODO: https://ixsystems.atlassian.net/browse/NAS-130392
-
-  // this.matDialog.open(PodSelectDialogComponent, {
-  //   minWidth: '650px',
-  //   maxWidth: '850px',
-  //   data: {
-  //     containerImageKey,
-  //     app: this.app,
-  //     appName: this.app.name,
-  //     title: this.translate.instant('Choose pod'),
-  //     type: PodSelectDialogType.Logs,
-  //     customSubmit: (formValueDialog: PodDialogFormValue) => {
-  //       this.logDialogSubmit(formValueDialog);
-  //     },
-  //   },
-  // });
+  viewLogsButtonPressed(containerDetails: AppContainerDetails): void {
+    this.router.navigate([
+      '/apps',
+      'installed',
+      this.app().metadata.train,
+      this.app().name,
+      'logs',
+      containerDetails.id,
+    ]);
   }
 
   private shellDialogSubmit(formValue: PodDialogFormValue): void {

diff --git a/src/app/pages/apps/components/installed-apps/pod-logs/pod-logs.component.html b/src/app/pages/apps/components/installed-apps/pod-logs/pod-logs.component.html
@@ -7,23 +7,24 @@
     (valueChange)="onFontSizeChanged($event)"
   ></ix-toolbar-slider>
 
-  <button mat-button ixTest="reconnect" (click)="onReconnect()">
-    {{ 'Reconnect' | translate }}
-  </button>
+  @if (false) {
+    <button mat-button ixTest="reconnect" (click)="reconnect()">
+      {{ 'Reconnect' | translate }}
+    </button>
 
-  <button mat-button color="primary" ixTest="download-logs" (click)="onDownloadLogs()">
-    {{ 'Download Logs' | translate }}
-  </button>
+
+    <button mat-button color="primary" ixTest="download-logs" (click)="onDownloadLogs()">
+      {{ 'Download Logs' | translate }}
+    </button>
+  }
 </ix-page-header>
 
 <div class="pod-logs-wrapper">
   <div class="meta-data">
     <label>{{ 'Application Name' | translate }}:</label>
     <span class="name">{{ appName }}</span>
-    <label>{{ 'Pod Name' | translate }}:</label>
-    <span class="name">{{ podName }}</span>
-    <label>{{ 'Container Name' | translate }}:</label>
-    <span class="name">{{ containerName }}</span>
+    <label>{{ 'Container ID' | translate }}:</label>
+    <span class="name">{{ containerId }}</span>
   </div>
   <div
     #logContainer

diff --git a/src/app/pages/apps/components/installed-apps/pod-logs/pod-logs.component.ts b/src/app/pages/apps/components/installed-apps/pod-logs/pod-logs.component.ts
@@ -1,4 +1,3 @@
-import { HttpErrorResponse } from '@angular/common/http';
 import {
   ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild,
 } from '@angular/core';
@@ -10,10 +9,6 @@ import { combineLatest, map, Subscription } from 'rxjs';
 import { WebSocketError } from 'app/interfaces/websocket-error.interface';
 import { DialogService } from 'app/modules/dialog/dialog.service';
 import { AppLoaderService } from 'app/modules/loader/app-loader.service';
-import {
-  LogsDialogFormValue,
-  PodSelectLogsDialogComponent,
-} from 'app/pages/apps/components/pod-select-logs/pod-select-logs-dialog.component';
 import { DownloadService } from 'app/services/download.service';
 import { ErrorHandlerService } from 'app/services/error-handler.service';
 import { ShellService } from 'app/services/shell.service';
@@ -39,9 +34,7 @@ export class PodLogsComponent implements OnInit {
 
   fontSize = 14;
   appName: string;
-  podName: string;
-  containerName: string;
-  protected tailLines = 500;
+  containerId: string;
   podLogSubscriptionId: string = null;
   podLogSubName = '';
   isLoadingPodLogs = false;
@@ -65,9 +58,7 @@ export class PodLogsComponent implements OnInit {
       untilDestroyed(this),
     ).subscribe(([params, parentParams]) => {
       this.appName = parentParams.appId as string;
-      this.podName = params.podName as string;
-      this.containerName = params.command as string;
-      this.tailLines = params.tail_lines as number;
+      this.containerId = params.containerId as string;
 
       this.reconnect();
     });
@@ -82,7 +73,7 @@ export class PodLogsComponent implements OnInit {
       this.podLogsChangedListener.unsubscribe();
     }
 
-    this.podLogSubName = `kubernetes.pod_log_follow:{"release_name":"${this.appName}", "pod_name":"${this.podName}", "container_name":"${this.containerName}", "tail_lines": ${this.tailLines}}`;
+    this.podLogSubName = `app.container_log_follow:{"app_name": "${this.appName}", "container_id": "${this.containerId}"}`;
     this.podLogSubscriptionId = UUID.UUID();
     this.podLogsChangedListener = this.ws.subscribeToLogs(this.podLogSubName).pipe(
       map((apiEvent) => apiEvent.fields),
@@ -121,76 +112,44 @@ export class PodLogsComponent implements OnInit {
   }
 
   onDownloadLogs(): void {
-    this.showChooseLogsDialog(true);
-  }
-
-  onReconnect(): void {
-    this.showChooseLogsDialog(false);
-  }
-
-  showChooseLogsDialog(isDownload: boolean): void {
-    this.matDialog.open(PodSelectLogsDialogComponent, {
-      minWidth: '650px',
-      maxWidth: '850px',
-      data: {
-        appName: this.appName,
-        title: 'Choose log',
-        customSubmit: (logsFormValueDialog: LogsDialogFormValue) => {
-          if (isDownload) {
-            this.downloadLogs(logsFormValueDialog);
-            return;
-          }
-          this.onChooseLogs(logsFormValueDialog);
-        },
-      },
-    });
+    // TODO: download logs
   }
 
-  downloadLogs(formValue: LogsDialogFormValue): void {
-    const appName = formValue.apps;
-    const podName = formValue.pods;
-    const containerName = formValue.containers;
-    const tailLines = formValue.tail_lines;
-
-    this.dialogService.closeAllDialogs();
-
-    const fileName = `${appName}_${podName}_${containerName}.log`;
-    const mimetype = 'application/octet-stream';
-    this.ws.call(
-      'core.download',
-      [
-        'chart.release.pod_logs',
-        [appName, { pod_name: podName, container_name: containerName, tail_lines: tailLines }],
-        fileName,
-      ],
-    ).pipe(
-      this.loader.withLoader(),
-      this.errorHandler.catchError(),
-      untilDestroyed(this),
-    ).subscribe((download) => {
-      const [, url] = download;
-      this.download.streamDownloadFile(url, fileName, mimetype)
-        .pipe(untilDestroyed(this))
-        .subscribe({
-          next: (file: Blob) => {
-            if (download !== null) {
-              this.download.downloadBlob(file, fileName);
-            }
-          },
-          error: (error: HttpErrorResponse) => {
-            this.dialogService.error(this.errorHandler.parseHttpError(error));
-          },
-        });
-    });
-  }
-
-  onChooseLogs(formValue: LogsDialogFormValue): void {
-    this.appName = formValue.apps;
-    this.podName = formValue.pods;
-    this.containerName = formValue.containers;
-    this.tailLines = formValue.tail_lines;
-
-    this.reconnect();
-    this.dialogService.closeAllDialogs();
-  }
+  // downloadLogs(formValue: LogsDialogFormValue): void {
+  //   const appName = formValue.apps;
+  //   const podName = formValue.pods;
+  //   const containerName = formValue.containers;
+  //   const tailLines = formValue.tail_lines;
+
+  //   this.dialogService.closeAllDialogs();
+
+  //   const fileName = `${appName}_${podName}_${containerName}.log`;
+  //   const mimetype = 'application/octet-stream';
+  //   this.ws.call(
+  //     'core.download',
+  //     [
+  //       'chart.release.pod_logs',
+  //       [appName, { pod_name: podName, container_name: containerName, tail_lines: tailLines }],
+  //       fileName,
+  //     ],
+  //   ).pipe(
+  //     this.loader.withLoader(),
+  //     this.errorHandler.catchError(),
+  //     untilDestroyed(this),
+  //   ).subscribe((download) => {
+  //     const [, url] = download;
+  //     this.download.streamDownloadFile(url, fileName, mimetype)
+  //       .pipe(untilDestroyed(this))
+  //       .subscribe({
+  //         next: (file: Blob) => {
+  //           if (download !== null) {
+  //             this.download.downloadBlob(file, fileName);
+  //           }
+  //         },
+  //         error: (error: HttpErrorResponse) => {
+  //           this.dialogService.error(this.errorHandler.parseHttpError(error));
+  //         },
+  //       });
+  //   });
+  // }
 }
diff --git a/src/assets/i18n/af.json b/src/assets/i18n/af.json
@@ -954,8 +954,8 @@
   "Console Settings": "",
   "Contact": "",
   "Container": "",
+  "Container ID": "",
   "Container Images": "",
-  "Container Name": "",
   "Container Read": "",
   "Container Write": "",
   "Containers": "",
@@ -3097,7 +3097,7 @@
   "Please specify trains from which UI should retrieve available applications for the catalog.": "",
   "Please visit our support page for help.": "",
   "Please wait": "",
-  "Pod Name": "",
+  "Pod Logs": "",
   "Pods": "",
   "Pool": "",
   "Pool Available Space Threshold (%)": "",

diff --git a/src/assets/i18n/ar.json b/src/assets/i18n/ar.json
@@ -954,8 +954,8 @@
   "Console Settings": "",
   "Contact": "",
   "Container": "",
+  "Container ID": "",
   "Container Images": "",
-  "Container Name": "",
   "Container Read": "",
   "Container Write": "",
   "Containers": "",
@@ -3097,7 +3097,7 @@
   "Please specify trains from which UI should retrieve available applications for the catalog.": "",
   "Please visit our support page for help.": "",
   "Please wait": "",
-  "Pod Name": "",
+  "Pod Logs": "",
   "Pods": "",
   "Pool": "",
   "Pool Available Space Threshold (%)": "",

diff --git a/src/assets/i18n/ast.json b/src/assets/i18n/ast.json
@@ -954,8 +954,8 @@
   "Console Settings": "",
   "Contact": "",
   "Container": "",
+  "Container ID": "",
   "Container Images": "",
-  "Container Name": "",
   "Container Read": "",
   "Container Write": "",
   "Containers": "",
@@ -3097,7 +3097,7 @@
   "Please specify trains from which UI should retrieve available applications for the catalog.": "",
   "Please visit our support page for help.": "",
   "Please wait": "",
-  "Pod Name": "",
+  "Pod Logs": "",
   "Pods": "",
   "Pool": "",
   "Pool Available Space Threshold (%)": "",

diff --git a/src/assets/i18n/az.json b/src/assets/i18n/az.json
@@ -954,8 +954,8 @@
   "Console Settings": "",
   "Contact": "",
   "Container": "",
+  "Container ID": "",
   "Container Images": "",
-  "Container Name": "",
   "Container Read": "",
   "Container Write": "",
   "Containers": "",
@@ -3097,7 +3097,7 @@
   "Please specify trains from which UI should retrieve available applications for the catalog.": "",
   "Please visit our support page for help.": "",
   "Please wait": "",
-  "Pod Name": "",
+  "Pod Logs": "",
   "Pods": "",
   "Pool": "",
   "Pool Available Space Threshold (%)": "",