From b04ba4498e7746664812e33153e4b56b588f331b Mon Sep 17 00:00:00 2001
From: Pujit Mehrotra <pujit@lime-technology.com>
Date: Tue, 28 Oct 2025 14:59:26 -0400
Subject: [PATCH] feat: implement manage settings action

---
 .../Docker/DockerContainerManagement.vue      | 22 +++++---------
 .../Docker/DockerContainersTable.vue          |  9 ++++++
 .../composables/useDockerEditNavigation.ts    | 30 +++++++++++++++++++
 3 files changed, 46 insertions(+), 15 deletions(-)
 create mode 100644 web/src/composables/useDockerEditNavigation.ts

diff --git a/web/src/components/Docker/DockerContainerManagement.vue b/web/src/components/Docker/DockerContainerManagement.vue
index 39039d89c..9e292f347 100644
--- a/web/src/components/Docker/DockerContainerManagement.vue
+++ b/web/src/components/Docker/DockerContainerManagement.vue
@@ -10,7 +10,7 @@ import DockerEdit from '@/components/Docker/Edit.vue';
 import DockerLogs from '@/components/Docker/Logs.vue';
 import DockerOverview from '@/components/Docker/Overview.vue';
 import DockerPreview from '@/components/Docker/Preview.vue';
-import { featureFlags } from '@/helpers/env';
+import { useDockerEditNavigation } from '@/composables/useDockerEditNavigation';
 
 import type { DockerContainer, FlatOrganizerEntry } from '@/composables/gql/graphql';
 import type { LocationQueryRaw } from 'vue-router';
@@ -177,6 +177,8 @@ const rootFolderId = computed(() => result.value?.docker?.organizer?.views?.[0]?
 
 const containers = computed<DockerContainer[]>(() => result.value?.docker?.containers || []);
 
+const { navigateToEditPage } = useDockerEditNavigation();
+
 function handleTableRowClick(payload: {
   id: string;
   type: 'container' | 'folder';
@@ -185,21 +187,11 @@ function handleTableRowClick(payload: {
 }) {
   if (payload.type !== 'container') return;
 
-  if (featureFlags.DOCKER_EDIT_PAGE_NAVIGATION) {
-    const entry = flatEntries.value.find((e) => e.id === payload.id && e.type === 'container');
-    const container = entry?.meta as DockerContainer | undefined;
-    const containerName = (container?.names?.[0] || '').replace(/^\//, '');
-    const templatePath = container?.templatePath;
+  const entry = flatEntries.value.find((e) => e.id === payload.id && e.type === 'container');
+  const container = entry?.meta as DockerContainer | undefined;
 
-    if (containerName && templatePath) {
-      const currentPath = window.location.pathname;
-      const basePath = currentPath.substring(
-        0,
-        currentPath.indexOf('?') === -1 ? currentPath.length : currentPath.indexOf('?')
-      );
-      window.location.href = `${basePath}/UpdateContainer?xmlTemplate=edit:${encodeURIComponent(templatePath)}`;
-      return;
-    }
+  if (navigateToEditPage(container)) {
+    return;
   }
 
   setActiveContainer(payload.id);
diff --git a/web/src/components/Docker/DockerContainersTable.vue b/web/src/components/Docker/DockerContainersTable.vue
index 4104890cf..1d7d82cc2 100644
--- a/web/src/components/Docker/DockerContainersTable.vue
+++ b/web/src/components/Docker/DockerContainersTable.vue
@@ -16,6 +16,7 @@ import { STOP_DOCKER_CONTAINER } from '@/components/Docker/docker-stop-container
 import { UNPAUSE_DOCKER_CONTAINER } from '@/components/Docker/docker-unpause-container.mutation';
 import { ContainerState } from '@/composables/gql/graphql';
 import { useContainerActions } from '@/composables/useContainerActions';
+import { useDockerEditNavigation } from '@/composables/useDockerEditNavigation';
 import { useFolderOperations } from '@/composables/useFolderOperations';
 import { useFolderTree } from '@/composables/useFolderTree';
 import { useTreeData } from '@/composables/useTreeData';
@@ -519,6 +520,8 @@ function handleBulkAction(action: string) {
   showToast(`${action} (${ids.length})`);
 }
 
+const { navigateToEditPage } = useDockerEditNavigation();
+
 function handleRowAction(row: TreeRow<DockerContainer>, action: string) {
   if (row.type !== 'container') return;
   if (action === 'Start / Stop') {
@@ -529,6 +532,12 @@ function handleRowAction(row: TreeRow<DockerContainer>, action: string) {
     containerActions.handleRowPauseResume(row);
     return;
   }
+  if (action === 'Manage Settings') {
+    const container = row.meta as DockerContainer | undefined;
+    if (navigateToEditPage(container)) {
+      return;
+    }
+  }
   showToast(`${action}: ${row.name}`);
 }
 
diff --git a/web/src/composables/useDockerEditNavigation.ts b/web/src/composables/useDockerEditNavigation.ts
new file mode 100644
index 000000000..1c835408a
--- /dev/null
+++ b/web/src/composables/useDockerEditNavigation.ts
@@ -0,0 +1,30 @@
+import { featureFlags } from '@/helpers/env';
+
+import type { DockerContainer } from '@/composables/gql/graphql';
+
+export function useDockerEditNavigation() {
+  function navigateToEditPage(container: DockerContainer | undefined, containerName?: string) {
+    if (!featureFlags.DOCKER_EDIT_PAGE_NAVIGATION) {
+      return false;
+    }
+
+    const name = containerName || (container?.names?.[0] || '').replace(/^\//, '');
+    const templatePath = container?.templatePath;
+
+    if (!name || !templatePath) {
+      return false;
+    }
+
+    const currentPath = window.location.pathname;
+    const basePath = currentPath.substring(
+      0,
+      currentPath.indexOf('?') === -1 ? currentPath.length : currentPath.indexOf('?')
+    );
+    window.location.href = `${basePath}/UpdateContainer?xmlTemplate=edit:${encodeURIComponent(templatePath)}`;
+    return true;
+  }
+
+  return {
+    navigateToEditPage,
+  };
+}