diff --git a/assets/components/ContainerTable.vue b/assets/components/ContainerTable.vue
index 2964d200..8ff1f38c 100644
--- a/assets/components/ContainerTable.vue
+++ b/assets/components/ContainerTable.vue
@@ -28,7 +28,7 @@
{{ container.name }}
-
{{ container.host }} |
+ {{ container.hostLabel }} |
{{ container.state }} |
@@ -69,7 +69,7 @@ const fields = {
},
host: {
label: "label.host",
- sortFunc: (a: Container, b: Container) => a.host.localeCompare(b.host) * direction.value,
+ sortFunc: (a: Container, b: Container) => a.hostLabel.localeCompare(b.hostLabel) * direction.value,
mobileVisible: false,
},
state: {
diff --git a/assets/components/FuzzySearchModal.vue b/assets/components/FuzzySearchModal.vue
index 0827e88f..7f712536 100644
--- a/assets/components/FuzzySearchModal.vue
+++ b/assets/components/FuzzySearchModal.vue
@@ -50,7 +50,7 @@ const store = useContainerStore();
const { containers } = storeToRefs(store);
const list = computed(() => {
- return containers.value.map(({ id, created, name, state, host }) => {
+ return containers.value.map(({ id, created, name, state, hostLabel: host }) => {
return {
id,
created,
diff --git a/assets/components/LogViewer/ContainerTitle.vue b/assets/components/LogViewer/ContainerTitle.vue
index 27b998e6..22e0d54d 100644
--- a/assets/components/LogViewer/ContainerTitle.vue
+++ b/assets/components/LogViewer/ContainerTitle.vue
@@ -3,7 +3,10 @@
- {{ container.name }} 1" class="host has-text-weight-light is-hidden-mobile">{{
+ container.hostLabel
+ }}/{{ container.name }}{{ container.swarmId }}
{{ container.image.replace(/@sha.*/, "") }}
diff --git a/assets/components/LogViewer/LogEventSource.spec.ts b/assets/components/LogViewer/LogEventSource.spec.ts
index 405f0c56..d6a90ffc 100644
--- a/assets/components/LogViewer/LogEventSource.spec.ts
+++ b/assets/components/LogViewer/LogEventSource.spec.ts
@@ -12,7 +12,7 @@ import { createRouter, createWebHistory } from "vue-router";
vi.mock("@/stores/config", () => ({
__esModule: true,
- default: { base: "", hosts: ["localhost"] },
+ default: { base: "", hosts: [{ name: "localhost", id: "localhost" }] },
}));
/**
diff --git a/assets/models/Container.spec.ts b/assets/models/Container.spec.ts
index 97b4340e..ffa6cb9f 100644
--- a/assets/models/Container.spec.ts
+++ b/assets/models/Container.spec.ts
@@ -1,5 +1,11 @@
-import { describe, expect, test } from "vitest";
+import { describe, expect, test, vi } from "vitest";
import { Container } from "./Container";
+
+vi.mock("@/stores/config", () => ({
+ __esModule: true,
+ default: { base: "", hosts: [{ name: "localhost", id: "localhost" }] },
+}));
+
describe("Container", () => {
const names = [
[
diff --git a/assets/models/Container.ts b/assets/models/Container.ts
index 7e7f2e43..2471f339 100644
--- a/assets/models/Container.ts
+++ b/assets/models/Container.ts
@@ -7,6 +7,16 @@ type Stat = Omit ;
const SWARM_ID_REGEX = /(\.[a-z0-9]{25})+$/i;
+const hosts = computed(() =>
+ config.hosts.reduce(
+ (acc, item) => {
+ acc[item.id] = item;
+ return acc;
+ },
+ {} as Record,
+ ),
+);
+
export class Container {
private _stat: Ref;
private readonly throttledStatHistory: UseThrottledRefHistoryReturn;
@@ -49,6 +59,10 @@ export class Container {
return unref(this._stat);
}
+ get hostLabel() {
+ return hosts.value[this.host]?.name;
+ }
+
get storageKey() {
return `${stripVersion(this.image)}:${this.command}`;
}
|