Date: Tue, 3 Nov 2026 11:58:21 +0100
Subject: [PATCH 40/68] refactor(setup): simplify connection rendering and
guidance
---
README.md | 2 +-
dataiku_mcp/setup_page.html | 98 +++++++++++++++++++++++++++++++------
dataiku_mcp/setup_server.py | 4 +-
3 files changed, 84 insertions(+), 20 deletions(-)
diff --git a/README.md b/README.md
index c9c10ce4..19895319 100644
--- a/README.md
+++ b/README.md
@@ -35,7 +35,7 @@ Dataiku Headless uses [uv 0.12.0 or later](https://docs.astral.sh/uv/getting-sta
Install the plugin, then select or ask **Set up Dataiku Headless**. In Claude Code, you can explicitly run `/dataiku-headless:dataiku-headless-setup`. The setup skill checks the local runtime, helps install uv when needed, and securely saves your Dataiku URL and personal API key on your local machine.
-To manage connections later, ask **Manage Dataiku connections**. The local browser manager lists connections by instance type and lets you add, edit, delete, switch the active instance, or choose a saved startup default. Test a connection before saving, then select **Done** when finished. Existing credentials stay hidden when editing; leave the API key blank to keep the saved credential. Environment and Code Studio connections are read-only and take precedence at startup. The page expires after ten minutes.
+To manage saved connections later, ask **Manage Dataiku connections**. The local browser manager groups instances by type and supports adding, editing, deleting, switching, and choosing a startup default. Test before saving, then select **Done**. Saved credentials stay hidden; environment and Code Studio connections are read-only.
Here's how to do it in the Codex app; Claude has a similar plugin-install flow.
diff --git a/dataiku_mcp/setup_page.html b/dataiku_mcp/setup_page.html
index e1eb4bb9..749f8871 100644
--- a/dataiku_mcp/setup_page.html
+++ b/dataiku_mcp/setup_page.html
@@ -569,9 +569,9 @@
text-align: left;
}
#environment-note {
- margin-bottom: 20px;
- }
- .toolbar {
+ margin-bottom: 20px;
+ }
+ .toolbar {
gap: 15px;
}
.search {
@@ -878,6 +878,47 @@ Add connection
$("save").disabled = !validationId;
}
}
+ function connectionRow(connection) {
+ const name = esc(connection.name);
+ const active = state.active === connection.name;
+ const isDefault = state.default === connection.name;
+ const managed = connection.source !== "config";
+ const badges = [];
+ const actions = [];
+ if (active) badges.push('Active');
+ if (isDefault)
+ badges.push('Startup default');
+ if (managed)
+ badges.push('Environment');
+ if (!active)
+ actions.push(
+ ``,
+ );
+ if (managed) {
+ const source =
+ connection.source === "code-studio-environment"
+ ? "Code Studio"
+ : "environment variables";
+ actions.push(`Managed by ${source}`);
+ } else {
+ if (!isDefault)
+ actions.push(
+ ``,
+ );
+ actions.push(
+ ``,
+ ``,
+ );
+ }
+ return `
+
+
${name}${badges.join("")}
+
${esc(connection.url)}
+
+
${actions.join("")}
+ ${deleteName === connection.name ? deletion(connection) : ""}
+
Add connection
Object.entries(types)
.map(([type, label]) => {
const rows = matches.filter((c) => c.instance_type === type);
- return rows.length
- ? `${label}
${rows.length}${rows
- .map((c) => {
- const managed = c.source !== "config";
- const attr = `data-name="${esc(c.name)}"`;
- return `
${esc(c.name)}${state.active === c.name ? 'Active' : ""}${state.default === c.name ? 'Startup default' : ""}${managed ? 'Environment' : ""}
${esc(c.url)}
${state.active !== c.name ? `` : ""}${managed ? `${c.source === "code-studio-environment" ? "Managed by Code Studio" : "Managed by environment variables"}` : `${state.default !== c.name ? `` : ""}`}
${deleteName === c.name ? deletion(c) : ""}
`;
- })
- .join("")}
${label}
${rows.length}
+ ${rows.map(connectionRow).join("")}
+ `;
})
.join("") ||
`${connections.length ? "No matching connections" : "Add your first connection"}
${connections.length ? "Try a different name, URL, or instance type." : "Connect a Dataiku instance to start working with your agent."}
Delete ${esc(c.name)}?This removes the saved connection from Headless. The Dataiku instance and its data stay in place.
${affected ? `
This connection is ${[state.active === c.name ? "active now" : "", state.default === c.name ? "the startup default" : ""].filter(Boolean).join(" and ")}.
${replacements.length ? `
` : "
No other saved connection remains. You will need to add or select one before continuing.
"}` : ""}
`;
+ const roles = [];
+ if (state.active === connection.name) roles.push("active now");
+ if (state.default === connection.name)
+ roles.push("the startup default");
+ let fallback = "";
+ if (roles.length) {
+ fallback = `This connection is ${roles.join(" and ")}.
`;
+ if (replacements.length) {
+ const options = replacements
+ .map(
+ (item) =>
+ ``,
+ )
+ .join("");
+ fallback += `
+ `;
+ } else {
+ fallback +=
+ "No other saved connection remains. You will need to add or select one before continuing.
";
+ }
+ }
+ return `
+
Delete ${name}?
+
This removes the saved connection from Headless. The Dataiku instance and its data stay in place.
+ ${fallback}
+
+
+
+
+