From 961736566aad556a33cf4700a68b51bdfae127da Mon Sep 17 00:00:00 2001
From: Gareth <garethgeorge97@gmail.com>
Date: Tue, 13 Jan 2026 23:25:56 -0800
Subject: [PATCH] env var tooltip

---
 .../features/repositories/AddRepoModal.tsx    | 34 +++++++++++++++++--
 1 file changed, 31 insertions(+), 3 deletions(-)

diff --git a/webui/src/features/repositories/AddRepoModal.tsx b/webui/src/features/repositories/AddRepoModal.tsx
index e4aa353e..de4f8d3c 100644
--- a/webui/src/features/repositories/AddRepoModal.tsx
+++ b/webui/src/features/repositories/AddRepoModal.tsx
@@ -461,9 +461,16 @@ export const AddRepoModal = ({ template }: { template: Repo | null }) => {
                   label={m.add_repo_modal_field_env_vars()}
                   items={getField(["env"]) || []}
                   onUpdate={(items: string[]) => updateField(["env"], items)}
-                  tooltip={m.add_repo_modal_field_env_vars_tooltip({
-                    MY_FOO_VAR: "$MY_FOO_VAR",
-                  })}
+                  tooltip={
+                    <Stack gap={2}>
+                      <CText>
+                        {m.add_repo_modal_field_env_vars_tooltip({
+                          MY_FOO_VAR: "$MY_FOO_VAR",
+                        })}
+                      </CText>
+                      <EnvVarTooltip uri={getField(["uri"])} />
+                    </Stack>
+                  }
                   placeholder="KEY=VALUE"
                 />
 
@@ -769,3 +776,24 @@ const formatMissingEnvVars = (partialMatches: string[][]): string => {
     })
     .join(" or ");
 };
+const EnvVarTooltip = ({ uri }: { uri: string }) => {
+  if (!uri) return null;
+  const scheme = uri.split(":")[0];
+  const expected = expectedEnvVars[scheme];
+  if (!expected) return null;
+  return (
+    <Box mt={2} p={2} bg="bg.muted" borderRadius="md" borderWidth="1px">
+      <CText fontWeight="bold" mb={1}>
+        Recommended for {scheme}:
+      </CText>
+      <ul style={{ paddingLeft: "1.2em" }}>
+        {expected.map((set, i) => (
+          <li key={i}>
+            {i > 0 && "or "}
+            {set.join(" + ")}
+          </li>
+        ))}
+      </ul>
+    </Box>
+  );
+};