chore(format): updates js files to updates prettier

assets/components/LogViewer/ContainerStat.vue

@@ -31,7 +31,7 @@ const cpuData = computedWithControl(
       value: stat.snapshot.cpu + "%",
     }));
     return points;
-  }
+  },
 );
 
 const memoryData = computedWithControl(
@@ -44,7 +44,7 @@ const memoryData = computedWithControl(
       value: formatBytes(stat.snapshot.memoryUsage),
     }));
     return points;
-  }
+  },
 );
 </script>
 

assets/components/LogViewer/LogEventSource.spec.ts

@@ -44,7 +44,7 @@ describe("<LogEventSource />", () => {
       hourStyle = "auto",
     }: { searchFilter?: string | undefined; hourStyle?: "auto" | "24" | "12" } = {
       hourStyle: "auto",
-    }
+    },
   ) {
     settings.value.hourStyle = hourStyle;
     search.searchFilter.value = searchFilter;

assets/components/LogViewer/LogViewer.vue

@@ -58,17 +58,25 @@ const routeHash = useRouteHash();
 watch(
   routeHash,
   (hash) => {
-    if(hash){
+    if (hash) {
       document.querySelector(`[data-key="${hash.substring(1)}"]`)?.scrollIntoView({ block: "center" });
     }
   },
-  { immediate: true, flush: "post" }
+  { immediate: true, flush: "post" },
 );
 </script>
 <style scoped lang="scss">
 .events {
   padding: 1em 0;
-  font-family: ui-monospace, SFMono-Regular, SF Mono, Consolas, Liberation Mono, monaco, Menlo, monospace;
+  font-family:
+    ui-monospace,
+    SFMono-Regular,
+    SF Mono,
+    Consolas,
+    Liberation Mono,
+    monaco,
+    Menlo,
+    monospace;
 
   & > li {
     display: flex;

assets/components/ScrollProgress.vue

@@ -37,7 +37,7 @@ onMounted(() => {
     () => {
       scrollElement.value = (root.value?.closest("[data-scrolling]") as HTMLElement) ?? document;
     },
-    { immediate: true, flush: "post" }
+    { immediate: true, flush: "post" },
   );
 });
 
@@ -56,7 +56,7 @@ watchPostEffect(() => {
         delay: 2000,
         fill: "both",
         easing: "ease-out",
-      }
+      },
     );
   }
 });

assets/components/Search.vue

@@ -46,7 +46,9 @@ onUnmounted(() => resetSearch());
   right: 0;
   border-radius: 0 0 0 5px;
   z-index: 10;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+  box-shadow:
+    0 1px 3px rgba(0, 0, 0, 0.12),
+    0 1px 2px rgba(0, 0, 0, 0.24);
 
   button.delete {
     margin-left: 1em;

assets/components/SideMenu.vue

@@ -82,21 +82,27 @@ const sortedContainers = computed(() =>
       } else {
         return a.name.localeCompare(b.name);
       }
-    })
+    }),
 );
 
 const hosts = computed(() =>
-  config.hosts.reduce((acc, item) => {
-    acc[item.host] = item;
-    return acc;
-  }, {} as Record<string, { name: string; host: string }>)
+  config.hosts.reduce(
+    (acc, item) => {
+      acc[item.host] = item;
+      return acc;
+    },
+    {} as Record<string, { name: string; host: string }>,
+  ),
 );
 
 const activeContainersById = computed(() =>
-  activeContainers.value.reduce((acc, item) => {
-    acc[item.id] = item;
-    return acc;
-  }, {} as Record<string, Container>)
+  activeContainers.value.reduce(
+    (acc, item) => {
+      acc[item.id] = item;
+      return acc;
+    },
+    {} as Record<string, Container>,
+  ),
 );
 </script>
 <style scoped lang="scss">

assets/components/common/DateTime.vue

@@ -11,9 +11,10 @@ const props = defineProps<{
 }>();
 
 const dateFormatter = new Intl.DateTimeFormat(undefined, { day: "2-digit", month: "2-digit", year: "numeric" });
-const use12Hour = $computed(() => ({ auto: undefined, "12": true, "24": false }[hourStyle.value]));
+const use12Hour = $computed(() => ({ auto: undefined, "12": true, "24": false })[hourStyle.value]);
 const timeFormatter = $computed(
-  () => new Intl.DateTimeFormat(undefined, { hour: "numeric", minute: "2-digit", second: "2-digit", hour12: use12Hour })
+  () =>
+    new Intl.DateTimeFormat(undefined, { hour: "numeric", minute: "2-digit", second: "2-digit", hour12: use12Hour }),
 );
 
 const dateStr = $computed(() => dateFormatter.format(props.date));

assets/components/common/MobileMenu.vue

@@ -109,14 +109,17 @@ const sortedContainers = computed(() =>
       } else {
         return a.name.localeCompare(b.name);
       }
-    })
+    }),
 );
 
 const hosts = computed(() =>
-  config.hosts.reduce((acc, item) => {
-    acc[item.host] = item;
-    return acc;
-  }, {} as Record<string, { name: string; host: string }>)
+  config.hosts.reduce(
+    (acc, item) => {
+      acc[item.host] = item;
+      return acc;
+    },
+    {} as Record<string, { name: string; host: string }>,
+  ),
 );
 </script>
 <style scoped lang="scss">

assets/composables/eventsource.ts

@@ -82,8 +82,8 @@ export function useLogStream(container: ComputedRef<Container>, streamConfig: Lo
 
     es = new EventSource(
       `${config.base}/api/logs/stream/${container.value.host}/${container.value.id}?${new URLSearchParams(
-        params
-      ).toString()}`
+        params,
+      ).toString()}`,
     );
     es.addEventListener("container-stopped", () => {
       es?.close();
@@ -127,8 +127,8 @@ export function useLogStream(container: ComputedRef<Container>, streamConfig: Lo
     const logs = await (
       await fetch(
         `${config.base}/api/logs/${container.value.host}/${container.value.id}?${new URLSearchParams(
-          params
-        ).toString()}`
+          params,
+        ).toString()}`,
       )
     ).text();
     if (logs) {
@@ -149,7 +149,7 @@ export function useLogStream(container: ComputedRef<Container>, streamConfig: Lo
         buffer.push(new DockerEventLogEntry("Container started", new Date(), "container-started"));
         connect({ clear: false });
       }
-    }
+    },
   );
 
   onUnmounted(() => {
@@ -161,7 +161,7 @@ export function useLogStream(container: ComputedRef<Container>, streamConfig: Lo
   watch(
     () => container.value.id,
     () => connect(),
-    { immediate: true }
+    { immediate: true },
   );
 
   watch(streamConfig, () => connect());

assets/main.ts

@@ -3,8 +3,8 @@ import { createApp, App as VueApp } from "vue";
 import App from "./App.vue";
 
 const app = createApp(App);
-Object.values(import.meta.glob<{ install: (app: VueApp) => void }>("./modules/*.ts", { eager: true })).forEach((i) =>
-  i.install?.(app)
+Object.values(import.meta.glob<{ install: (app: VueApp) => void }>("./modules/*.ts", { eager: true })).forEach(
+  (i) => i.install?.(app),
 );
 
 app.mount("#app");

assets/models/Container.ts

@@ -21,7 +21,7 @@ export class Container {
     public readonly host: string,
     public status: string,
     public state: ContainerState,
-    public health?: ContainerHealth
+    public health?: ContainerHealth,
   ) {
     this.stat = ref({ cpu: 0, memory: 0, memoryUsage: 0 });
     this.throttledStatHistory = useThrottledRefHistory(this.stat, { capacity: 300, deep: true, throttle: 1000 });

assets/models/LogEntry.ts

@@ -29,7 +29,7 @@ export abstract class LogEntry<T extends string | JSONObject> implements HasComp
     public readonly id: number,
     public readonly date: Date,
     public readonly std: Std,
-    public readonly level?: string
+    public readonly level?: string,
   ) {
     this._message = message;
   }
@@ -48,7 +48,7 @@ export class SimpleLogEntry extends LogEntry<string> {
     date: Date,
     public readonly level: string,
     public readonly position: Position,
-    public readonly std: Std
+    public readonly std: Std,
   ) {
     super(message, id, date, std, level);
   }
@@ -66,7 +66,7 @@ export class ComplexLogEntry extends LogEntry<JSONObject> {
     date: Date,
     public readonly level: string,
     public readonly std: Std,
-    visibleKeys?: Ref<string[][]>
+    visibleKeys?: Ref<string[][]>,
   ) {
     super(message, id, date, std, level);
     if (visibleKeys) {
@@ -99,7 +99,11 @@ export class ComplexLogEntry extends LogEntry<JSONObject> {
 }
 
 export class DockerEventLogEntry extends LogEntry<string> {
-  constructor(message: string, date: Date, public readonly event: string) {
+  constructor(
+    message: string,
+    date: Date,
+    public readonly event: string,
+  ) {
     super(message, date.getTime(), date, "stderr", "info");
   }
   getComponent(): Component {
@@ -115,7 +119,7 @@ export class SkippedLogsEntry extends LogEntry<string> {
     date: Date,
     totalSkipped: number,
     public readonly firstSkipped: LogEntry<string | JSONObject>,
-    lastSkipped: LogEntry<string | JSONObject>
+    lastSkipped: LogEntry<string | JSONObject>,
   ) {
     super("", date.getTime(), date, "stderr", "info");
     this._totalSkipped = totalSkipped;
@@ -151,7 +155,7 @@ export function asLogEntry(event: LogEvent): LogEntry<string | JSONObject> {
       new Date(event.ts),
       event.l,
       event.p,
-      event.s === "unknown" ? "stderr" : event.s ?? "stderr"
+      event.s === "unknown" ? "stderr" : event.s ?? "stderr",
     );
   } else {
     return new ComplexLogEntry(
@@ -159,7 +163,7 @@ export function asLogEntry(event: LogEvent): LogEntry<string | JSONObject> {
       event.id,
       new Date(event.ts),
       event.l,
-      event.s === "unknown" ? "stderr" : event.s ?? "stderr"
+      event.s === "unknown" ? "stderr" : event.s ?? "stderr",
     );
   }
 }

assets/modules/i18n.ts

@@ -7,8 +7,8 @@ export const install = (app: App) => {
       ([key, value]) => {
         const yaml = key.endsWith(".yaml");
         return [key.slice(14, yaml ? -5 : -4), value.default];
-      }
-    )
+      },
+    ),
   );
   const i18n = createI18n({
     legacy: false,

assets/pages/index.vue

@@ -124,7 +124,7 @@ useIntervalFn(
     totalCpu = runningContainers.reduce((acc, c) => acc + (c.stat?.cpu ?? 0), 0);
   },
   1000,
-  { immediate: true }
+  { immediate: true },
 );
 
 let totalMem = $ref(0);
@@ -133,7 +133,7 @@ useIntervalFn(
     totalMem = runningContainers.reduce((acc, c) => acc + (c.stat?.memoryUsage ?? 0), 0);
   },
   1000,
-  { immediate: true }
+  { immediate: true },
 );
 
 function onEnter() {

assets/stores/container.ts

@@ -10,10 +10,13 @@ export const useContainerStore = defineStore("container", () => {
   const ready = ref(false);
 
   const allContainersById = computed(() =>
-    containers.value.reduce((acc, container) => {
-      acc[container.id] = container;
-      return acc;
-    }, {} as Record<string, Container>)
+    containers.value.reduce(
+      (acc, container) => {
+        acc[container.id] = container;
+        return acc;
+      },
+      {} as Record<string, Container>,
+    ),
   );
 
   const visibleContainers = computed(() => {
@@ -29,7 +32,7 @@ export const useContainerStore = defineStore("container", () => {
     es = new EventSource(`${config.base}/api/events/stream`);
 
     es.addEventListener("containers-changed", (e: Event) =>
-      updateContainers(JSON.parse((e as MessageEvent).data) as ContainerJson[])
+      updateContainers(JSON.parse((e as MessageEvent).data) as ContainerJson[]),
     );
     es.addEventListener("container-stat", (e) => {
       const stat = JSON.parse((e as MessageEvent).data) as ContainerStat;
@@ -83,7 +86,7 @@ export const useContainerStore = defineStore("container", () => {
           c.host,
           c.status,
           c.state,
-          c.health
+          c.health,
         );
       }),
     ];

docs/.vitepress/theme/components/HeroVideo.vue

@@ -13,7 +13,7 @@ onMounted(() => {
     {
       attributes: true,
       attributeFilter: ["class"],
-    }
+    },
   );
 });
 </script>