root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): prefill Tailscale hostname from window.location

Browse Source 
Empty hostname triggered provider_not_configured even though the field
was labeled "(optional)". Drop the misleading label and default to the
browser's current hostname so the start action succeeds out of the box.
Also drop the legacy MediaQueryList.addListener fallback to clear the
deprecation warning.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsxdsm
2026-04-29 11:57:38 -07:00
parent a6a8862986
commit 8796a32401
1 changed files with 4 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
packages/dashboard/app/components/SettingsModal.tsx
View File

@@ -487,13 +487,8 @@ export function SettingsModal({
};
updateMobilePicker();
if (typeof mediaQuery.addEventListener === "function") {
mediaQuery.addEventListener("change", updateMobilePicker);
return () => mediaQuery.removeEventListener("change", updateMobilePicker);
}
mediaQuery.addListener(updateMobilePicker);
return () => mediaQuery.removeListener(updateMobilePicker);
mediaQuery.addEventListener("change", updateMobilePicker);
return () => mediaQuery.removeEventListener("change", updateMobilePicker);
}, []);
useEffect(() => {
@@ -3977,7 +3972,7 @@ export function SettingsModal({
{activeProvider === "tailscale" ? (
<>
<label htmlFor="remoteTailscaleHostname">Hostname label</label>
<input id="remoteTailscaleHostname" type="text" placeholder="tailnet label (optional)" value={String(remoteForm.remoteTailscaleHostname ?? "")} onChange={(e) => setForm((f) => ({ ...f, remoteTailscaleHostname: e.target.value } as SettingsFormState))} />
<input id="remoteTailscaleHostname" type="text" placeholder="tailnet label" value={String(remoteForm.remoteTailscaleHostname ?? (typeof window !== "undefined" ? window.location.hostname : ""))} onChange={(e) => setForm((f) => ({ ...f, remoteTailscaleHostname: e.target.value } as SettingsFormState))} />
<label htmlFor="remoteTailscaleTargetPort">Target port</label>
<input id="remoteTailscaleTargetPort" type="number" min={1} max={65535} value={Number(remoteForm.remoteTailscaleTargetPort ?? 4040)} onChange={(e) => setForm((f) => ({ ...f, remoteTailscaleTargetPort: Number(e.target.value || 4040) } as SettingsFormState))} />
<label htmlFor="remoteTailscaleAcceptRoutes" className="checkbox-label">
@@ -4038,7 +4033,7 @@ export function SettingsModal({
const savePayload: Partial<RemoteSettings> = {
remoteActiveProvider: activeProvider,
remoteTailscaleEnabled: activeProvider === "tailscale",
remoteTailscaleHostname: String(formState.remoteTailscaleHostname ?? ""),
remoteTailscaleHostname: String(formState.remoteTailscaleHostname ?? (typeof window !== "undefined" ? window.location.hostname : "")),
remoteTailscaleTargetPort: Number(formState.remoteTailscaleTargetPort ?? 4040),
remoteTailscaleAcceptRoutes: Boolean(formState.remoteTailscaleAcceptRoutes),
remoteCloudflareEnabled: activeProvider === "cloudflare",