From c2f9c6a38d8d94639347755455569532b0a85606 Mon Sep 17 00:00:00 2001
From: Matt Hill <matthewonthemoon@gmail.com>
Date: Wed, 27 Jul 2022 22:56:29 -0600
Subject: [PATCH] display logs in local time while retaining iso format

---
 .../src/app/pages/logs/logs.page.ts           | 15 +++++++++--
 frontend/projects/shared/src/public-api.ts    |  1 +
 .../shared/src/util/to-local-iso-string.ts    | 26 +++++++++++++++++++
 .../ui/src/app/components/logs/logs.page.ts   | 23 ++++++++++++----
 .../notifications/notifications.page.html     |  3 ++-
 .../ui/src/app/services/api/api.fixures.ts    |  6 ++---
 6 files changed, 63 insertions(+), 11 deletions(-)
 create mode 100644 frontend/projects/shared/src/util/to-local-iso-string.ts

diff --git a/frontend/projects/diagnostic-ui/src/app/pages/logs/logs.page.ts b/frontend/projects/diagnostic-ui/src/app/pages/logs/logs.page.ts
index 88f706edd..05d92749c 100644
--- a/frontend/projects/diagnostic-ui/src/app/pages/logs/logs.page.ts
+++ b/frontend/projects/diagnostic-ui/src/app/pages/logs/logs.page.ts
@@ -1,6 +1,7 @@
 import { Component, ViewChild } from '@angular/core'
 import { IonContent } from '@ionic/angular'
 import { ApiService } from 'src/app/services/api/api.service'
+import { toLocalIsoString } from '@start9labs/shared'
 var Convert = require('ansi-to-html')
 var convert = new Convert({
   bg: 'transparent',
@@ -42,7 +43,12 @@ export class LogsPage {
 
       newLogs.innerHTML =
         logs
-          .map(l => `${l.timestamp} ${convert.toHtml(l.message)}`)
+          .map(
+            l =>
+              `<b>${toLocalIsoString(
+                new Date(l.timestamp),
+              )}</b> ${convert.toHtml(l.message)}`,
+          )
           .join('\n') + (logs.length ? '\n' : '')
       container?.prepend(newLogs)
 
@@ -100,7 +106,12 @@ export class LogsPage {
 
       newLogs.innerHTML =
         logs
-          .map(l => `${l.timestamp} ${convert.toHtml(l.message)}`)
+          .map(
+            l =>
+              `<b>${toLocalIsoString(
+                new Date(l.timestamp),
+              )}</b> ${convert.toHtml(l.message)}`,
+          )
           .join('\n') + (logs.length ? '\n' : '')
       container?.append(newLogs)
       this.loadingMore = false
diff --git a/frontend/projects/shared/src/public-api.ts b/frontend/projects/shared/src/public-api.ts
index ccc43978e..4cbb0c642 100644
--- a/frontend/projects/shared/src/public-api.ts
+++ b/frontend/projects/shared/src/public-api.ts
@@ -36,4 +36,5 @@ export * from './types/workspace-config'
 
 export * from './util/get-pkg-id'
 export * from './util/misc.util'
+export * from './util/to-local-iso-string'
 export * from './util/unused'
diff --git a/frontend/projects/shared/src/util/to-local-iso-string.ts b/frontend/projects/shared/src/util/to-local-iso-string.ts
new file mode 100644
index 000000000..4af2ae771
--- /dev/null
+++ b/frontend/projects/shared/src/util/to-local-iso-string.ts
@@ -0,0 +1,26 @@
+export function toLocalIsoString(date: Date) {
+  const tzo = -date.getTimezoneOffset()
+  const dif = tzo >= 0 ? '+' : '-'
+
+  function pad(num: number) {
+    return (num < 10 ? '0' : '') + num
+  }
+
+  return (
+    date.getFullYear() +
+    '-' +
+    pad(date.getMonth() + 1) +
+    '-' +
+    pad(date.getDate()) +
+    'T' +
+    pad(date.getHours()) +
+    ':' +
+    pad(date.getMinutes()) +
+    ':' +
+    pad(date.getSeconds()) +
+    dif +
+    pad(Math.floor(Math.abs(tzo) / 60)) +
+    ':' +
+    pad(Math.abs(tzo) % 60)
+  )
+}
diff --git a/frontend/projects/ui/src/app/components/logs/logs.page.ts b/frontend/projects/ui/src/app/components/logs/logs.page.ts
index e3337da0e..3fc542168 100644
--- a/frontend/projects/ui/src/app/components/logs/logs.page.ts
+++ b/frontend/projects/ui/src/app/components/logs/logs.page.ts
@@ -1,6 +1,7 @@
+import { formatDate } from '@angular/common'
 import { Component, Input, ViewChild } from '@angular/core'
 import { IonContent } from '@ionic/angular'
-import { ErrorToastService } from '@start9labs/shared'
+import { ErrorToastService, toLocalIsoString } from '@start9labs/shared'
 import { RR } from 'src/app/services/api/api.types'
 var Convert = require('ansi-to-html')
 var convert = new Convert({
@@ -53,8 +54,14 @@ export class LogsPage {
     if (!(newLogs instanceof HTMLElement)) return
 
     newLogs.innerHTML =
-      logs.map(l => `${l.timestamp} ${convert.toHtml(l.message)}`).join('\n') +
-      (logs.length ? '\n' : '')
+      logs
+        .map(
+          l =>
+            `<b>${toLocalIsoString(new Date(l.timestamp))}</b> ${convert.toHtml(
+              l.message,
+            )}`,
+        )
+        .join('\n') + (logs.length ? '\n' : '')
     container?.append(newLogs)
     this.loadingNext = false
     this.scrollEvent()
@@ -87,8 +94,14 @@ export class LogsPage {
     if (!(newLogs instanceof HTMLElement)) return
 
     newLogs.innerHTML =
-      logs.map(l => `${l.timestamp} ${convert.toHtml(l.message)}`).join('\n') +
-      (logs.length ? '\n' : '')
+      logs
+        .map(
+          l =>
+            `<b>${toLocalIsoString(new Date(l.timestamp))}</b> ${convert.toHtml(
+              l.message,
+            )}`,
+        )
+        .join('\n') + (logs.length ? '\n' : '')
     container?.prepend(newLogs)
     const afterContainerHeight = container?.scrollHeight || 0
 
diff --git a/frontend/projects/ui/src/app/pages/notifications/notifications.page.html b/frontend/projects/ui/src/app/pages/notifications/notifications.page.html
index 4c23aba0d..7931bc8d8 100644
--- a/frontend/projects/ui/src/app/pages/notifications/notifications.page.html
+++ b/frontend/projects/ui/src/app/pages/notifications/notifications.page.html
@@ -84,7 +84,8 @@
             <h2>
               <b>
                 <span *ngIf="not['package-id'] as pkgId">
-                  {{ packageData[pkgId]?.manifest?.title || pkgId }} -
+                  <!-- @TODO remove $any when Angular gets smart enough -->
+                  {{ $any(packageData[pkgId])?.manifest?.title || pkgId }} -
                 </span>
                 <ion-text [color]="getColor(not)"> {{ not.title }} </ion-text>
               </b>
diff --git a/frontend/projects/ui/src/app/services/api/api.fixures.ts b/frontend/projects/ui/src/app/services/api/api.fixures.ts
index d76eec58f..cab03ba62 100644
--- a/frontend/projects/ui/src/app/services/api/api.fixures.ts
+++ b/frontend/projects/ui/src/app/services/api/api.fixures.ts
@@ -949,13 +949,13 @@ export module Mock {
 
   export const ServerLogs: Log[] = [
     {
-      timestamp: '2019-12-26T14:20:30.872Z',
+      timestamp: '2022-07-28T03:52:54.808769Z',
       message: '****** START *****',
     },
     {
       timestamp: '2019-12-26T14:21:30.872Z',
       message:
-        '2021/11/09 22:55:04 \u001b[34mPOST \u001b[0;32;49m200\u001b[0m photoview.embassy/api/graphql \u001b[0;36;49m1.169406ms\u001b[0m unauthenticated<p>TEST PARAGRAPH</p>',
+        '\u001b[34mPOST \u001b[0;32;49m200\u001b[0m photoview.embassy/api/graphql \u001b[0;36;49m1.169406ms\u001b[0m unauthenticated<p>TEST PARAGRAPH</p>',
     },
     {
       timestamp: '2019-12-26T14:22:30.872Z',
@@ -965,7 +965,7 @@ export module Mock {
 
   export const PackageLogs: Log[] = [
     {
-      timestamp: '2019-12-26T14:20:30.872Z',
+      timestamp: '2022-07-28T03:52:54.808769Z',
       message: '****** START *****',
     },
     {