diff --git a/packages/app/src/app/settings.tsx b/packages/app/src/app/settings.tsx index ab584b8b5..aee1d0fd9 100644 --- a/packages/app/src/app/settings.tsx +++ b/packages/app/src/app/settings.tsx @@ -120,6 +120,11 @@ const styles = StyleSheet.create((theme) => ({ fontSize: theme.fontSize.sm, fontFamily: Fonts.mono, }, + hostConnections: { + color: theme.colors.foregroundMuted, + fontSize: theme.fontSize.xs, + fontFamily: Fonts.mono, + }, hostError: { color: theme.colors.palette.red[300], fontSize: theme.fontSize.xs, @@ -662,7 +667,7 @@ export default function SettingsScreen() { style={styles.addButton} onPress={() => setIsAddHostMethodVisible(true)} > - + Add host + + Add connection @@ -1060,7 +1065,15 @@ function DaemonCard({ ? "rgba(245, 158, 11, 0.1)" : statusTone === "error" ? "rgba(248, 113, 113, 0.1)" - : "rgba(161, 161, 170, 0.1)"; + : "rgba(161, 161, 170, 0.1)"; + + const connectionsSummary = (() => { + const parts = daemon.connections.map((conn) => { + if (conn.type === "relay") return `relay:${conn.relayEndpoint}`; + return `direct:${conn.endpoint}`; + }); + return parts.join(" • "); + })(); return ( @@ -1097,6 +1110,7 @@ function DaemonCard({ return ""; })()} + {connectionsSummary ? {connectionsSummary} : null} {connectionError ? {connectionError} : null} diff --git a/packages/app/src/components/add-host-method-modal.tsx b/packages/app/src/components/add-host-method-modal.tsx index 97bdf7114..c6a51638c 100644 --- a/packages/app/src/components/add-host-method-modal.tsx +++ b/packages/app/src/components/add-host-method-modal.tsx @@ -63,12 +63,12 @@ export function AddHostMethodModal({ }, [onClose, onPasteLink]); return ( - + Direct connection - Enter a host and port. + Local network or Tailscale (unencrypted). @@ -77,7 +77,7 @@ export function AddHostMethodModal({ Scan QR code - Use your camera to pair. + Relay pairing (E2EE). ) : null} @@ -86,7 +86,7 @@ export function AddHostMethodModal({ Paste pairing link - Works without a camera. + Relay pairing (E2EE).