From a9822048e4473cd96819ef50feddfe3493df3b81 Mon Sep 17 00:00:00 2001
From: Den <2119348+dzianisv@users.noreply.github.com>
Date: Tue, 9 Jun 2026 03:31:46 -0700
Subject: [PATCH] ux(quick-connect): hint users to Advanced for custom server
 username (#23) (#25)

Quick Connect now shows a one-line hint under the password field stating
that username defaults to 'opencode' and pointing to Advanced options for
servers using a custom OPENCODE_SERVER_USERNAME. Tap-target to switch
modes is included.

Closes #23

Co-authored-by: dzianisv <dzianis.varabyou@gmail.com>
---
 app/connection/add.tsx | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/app/connection/add.tsx b/app/connection/add.tsx
index d07228b..a826d7c 100644
--- a/app/connection/add.tsx
+++ b/app/connection/add.tsx
@@ -209,6 +209,13 @@ export default function AddConnectionScreen() {
           onChangeText={setPassword}
           secureTextEntry
         />
+        <Text style={[styles.usernameHint, isDark && styles.hintDark]}>
+          Username defaults to <Text style={styles.code}>opencode</Text>. Custom username? Use{" "}
+          <Text style={styles.usernameHintLink} onPress={() => setMode("advanced")}>
+            Advanced options
+          </Text>
+          .
+        </Text>
 
         {/* Connect button */}
         <TouchableOpacity
@@ -524,6 +531,17 @@ const styles = StyleSheet.create({
     paddingHorizontal: 4,
     borderRadius: 4,
   },
+  usernameHint: {
+    fontSize: 12,
+    color: "#666666",
+    marginTop: 6,
+    marginBottom: 4,
+    lineHeight: 18,
+  },
+  usernameHintLink: {
+    color: "#6366f1",
+    fontWeight: "600",
+  },
   advancedLink: {
     flexDirection: "row",
     alignItems: "center",