From fd663b9c0e0ed43a47c3c4b6db5c53e121c0bd1e Mon Sep 17 00:00:00 2001
From: Amir Raminfar <findamir@gmail.com>
Date: Sun, 18 May 2025 18:14:06 -0700
Subject: [PATCH] feat: adds option to instantly redirect to new container
 (#3897)

---
 assets/components/common/DropdownMenu.vue |  2 +-
 assets/components/common/LabeledInput.vue |  2 +-
 assets/pages/container/[id].vue           | 13 ++++++++++++-
 assets/pages/settings.vue                 | 19 +++++++++++++++++--
 assets/stores/settings.ts                 | 12 ++++++++++--
 internal/profile/disk.go                  |  2 +-
 6 files changed, 42 insertions(+), 8 deletions(-)

diff --git a/assets/components/common/DropdownMenu.vue b/assets/components/common/DropdownMenu.vue
index 11ecb1da..fa943f14 100644
--- a/assets/components/common/DropdownMenu.vue
+++ b/assets/components/common/DropdownMenu.vue
@@ -1,5 +1,5 @@
 <template>
-  <details class="dropdown" ref="details" v-on-click-outside="close">
+  <details class="dropdown dropdown-end" ref="details" v-on-click-outside="close">
     <summary class="btn btn-primary flex-nowrap" v-bind="$attrs">
       <slot name="trigger"> {{ label }} <carbon:caret-down /></slot>
     </summary>
diff --git a/assets/components/common/LabeledInput.vue b/assets/components/common/LabeledInput.vue
index fddb48e2..6e7b1ed5 100644
--- a/assets/components/common/LabeledInput.vue
+++ b/assets/components/common/LabeledInput.vue
@@ -1,6 +1,6 @@
 <template>
   <label class="label text-base-content cursor-pointer gap-4">
-    <div class="flex-1"><slot name="label" /></div>
+    <div class="flex-1 whitespace-normal"><slot name="label" /></div>
     <slot name="input" />
   </label>
 </template>
diff --git a/assets/pages/container/[id].vue b/assets/pages/container/[id].vue
index 220d46c7..0b590852 100644
--- a/assets/pages/container/[id].vue
+++ b/assets/pages/container/[id].vue
@@ -39,6 +39,7 @@ watch(currentContainer, () => (redirectTrigger.value = false));
 
 watchEffect(() => {
   if (redirectTrigger.value) return;
+  if (automaticRedirect.value === "none") return;
   if (!currentContainer.value) return;
   if (currentContainer.value.state === "running") return;
   if (Date.now() - +currentContainer.value.finishedAt > 5 * 60 * 1000) return;
@@ -49,7 +50,7 @@ watchEffect(() => {
 
   if (!nextContainer) return;
 
-  if (automaticRedirect.value) {
+  if (automaticRedirect.value === "delayed") {
     redirectTrigger.value = true;
     showToast(
       {
@@ -73,6 +74,16 @@ watchEffect(() => {
       },
       { timed: 4000 },
     );
+  } else {
+    router.push({ name: "/container/[id]", params: { id: nextContainer.id } });
+    showToast(
+      {
+        title: t("alert.redirected.title"),
+        message: t("alert.redirected.message", { containerId: nextContainer.id }),
+        type: "info",
+      },
+      { expire: 3000 },
+    );
   }
 });
 </script>
diff --git a/assets/pages/settings.vue b/assets/pages/settings.vue
index 15e0eb59..c59026c5 100644
--- a/assets/pages/settings.vue
+++ b/assets/pages/settings.vue
@@ -119,13 +119,28 @@
       <div class="has-underline">
         <h2>{{ $t("settings.options") }}</h2>
       </div>
+
+      <LabeledInput>
+        <template #label>
+          {{ $t("settings.automatic-redirect") }}
+        </template>
+        <template #input>
+          <DropdownMenu
+            v-model="automaticRedirect"
+            :options="[
+              { label: 'Instant', value: 'instant' },
+              { label: 'Delayed', value: 'delayed' },
+              { label: 'None', value: 'none' },
+            ]"
+          />
+        </template>
+      </LabeledInput>
+
       <Toggle v-model="search">
         {{ $t("settings.search") }} <key-shortcut char="f" class="align-top"></key-shortcut>
       </Toggle>
 
       <Toggle v-model="showAllContainers">{{ $t("settings.show-stopped-containers") }}</Toggle>
-
-      <Toggle v-model="automaticRedirect">{{ $t("settings.automatic-redirect") }}</Toggle>
     </section>
   </PageWithLinks>
 </template>
diff --git a/assets/stores/settings.ts b/assets/stores/settings.ts
index 8ef9abdf..48834182 100644
--- a/assets/stores/settings.ts
+++ b/assets/stores/settings.ts
@@ -14,7 +14,7 @@ export type Settings = {
   dateLocale: "auto" | "en-US" | "en-GB" | "de-DE" | "en-CA";
   softWrap: boolean;
   collapseNav: boolean;
-  automaticRedirect: boolean;
+  automaticRedirect: "instant" | "delayed" | "none";
   locale: string;
 };
 export const DEFAULT_SETTINGS: Settings = {
@@ -31,12 +31,20 @@ export const DEFAULT_SETTINGS: Settings = {
   dateLocale: "auto",
   softWrap: true,
   collapseNav: false,
-  automaticRedirect: true,
+  automaticRedirect: "delayed",
   locale: "",
 };
 
 export const settings = useProfileStorage("settings", DEFAULT_SETTINGS);
 
+// @ts-ignore: automaticRedirect is now a string enum, but might be a boolean in older data
+if (settings.value.automaticRedirect === true) {
+  settings.value.automaticRedirect = "delayed";
+  // @ts-ignore: automaticRedirect is now a string enum, but might be a boolean in older data
+} else if (settings.value.automaticRedirect === false) {
+  settings.value.automaticRedirect = "none";
+}
+
 export const {
   collapseNav,
   compact,
diff --git a/internal/profile/disk.go b/internal/profile/disk.go
index de5e2845..a8520dbb 100644
--- a/internal/profile/disk.go
+++ b/internal/profile/disk.go
@@ -28,7 +28,7 @@ type Settings struct {
 	ShowAllContainers bool    `json:"showAllContainers"`
 	SoftWrap          bool    `json:"softWrap"`
 	CollapseNav       bool    `json:"collapseNav"`
-	AutomaticRedirect bool    `json:"automaticRedirect"`
+	AutomaticRedirect string  `json:"automaticRedirect"`
 	Size              string  `json:"size,omitempty"`
 	Compact           bool    `json:"compact"`
 	LightTheme        string  `json:"lightTheme,omitempty"`