diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/InsecureContextGuidance.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/InsecureContextGuidance.tsx index c2f3f992c1..2a16075a40 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/InsecureContextGuidance.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/InsecureContextGuidance.tsx @@ -1,10 +1,13 @@ import { buildSameComputerLoopbackUrl } from "@/lib/secure-context" +import { OCTOBOT_CONNECT_GUIDE_TWO_INTERFACES_URL } from "@/lib/external-links" import { INSECURE_CONTEXT_OPTION_LOCAL_SUBLABEL, INSECURE_CONTEXT_OPTION_LOCAL_TITLE, INSECURE_CONTEXT_OPTION_REMOTE_TITLE, INSECURE_CONTEXT_REMOTE_LEAD, INSECURE_CONTEXT_SAME_COMPUTER_LEAD, + INSECURE_CONTEXT_TWO_INTERFACES_GUIDE_BEFORE, + INSECURE_CONTEXT_TWO_INTERFACES_GUIDE_LINK, INSECURE_CONTEXT_WHY_ADDRESS_AFTER, INSECURE_CONTEXT_WHY_ADDRESS_BEFORE, INSECURE_CONTEXT_WHY_LEAD, @@ -31,11 +34,25 @@ export function InsecureContextGuidance({

{INSECURE_CONTEXT_WHY_LEAD}

{pageHref !== "" ? ( -

- {INSECURE_CONTEXT_WHY_ADDRESS_BEFORE} - {pageHref} - {INSECURE_CONTEXT_WHY_ADDRESS_AFTER} -

+ <> +

+ {INSECURE_CONTEXT_WHY_ADDRESS_BEFORE} + {pageHref} + {INSECURE_CONTEXT_WHY_ADDRESS_AFTER} +

+

+ {INSECURE_CONTEXT_TWO_INTERFACES_GUIDE_BEFORE} + + {INSECURE_CONTEXT_TWO_INTERFACES_GUIDE_LINK} + + . +

+ ) : null}
diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/TailscaleRemoteAccessDialog.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/TailscaleRemoteAccessDialog.tsx index f92eeb8f23..781c8c69e7 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/TailscaleRemoteAccessDialog.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/TailscaleRemoteAccessDialog.tsx @@ -18,6 +18,7 @@ import { TAILSCALE_ADMIN_CONSOLE_MACHINES_URL, TAILSCALE_FULL_DOMAIN_EXAMPLE, TAILSCALE_MAGICDNS_REACHABILITY_LEAD, + TAILSCALE_PRIVATE_NETWORK_CONNECT_GUIDE_LABEL, TAILSCALE_REMOTE_ACCESS_DIALOG_TITLE, TAILSCALE_SERVE_NOT_ENABLED_ON_TAILNET_MESSAGE, TAILSCALE_SERVE_STARTED_RUNNING_MESSAGE, @@ -128,7 +129,7 @@ export function TailscaleRemoteAccessDialog({ target="_blank" rel="noopener noreferrer" > - Read the full Tailscale guide + {TAILSCALE_PRIVATE_NETWORK_CONNECT_GUIDE_LABEL} diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/TailscaleRemoteAccessDialog.test.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/TailscaleRemoteAccessDialog.test.tsx index 6cdca7857c..3a8e02b512 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/TailscaleRemoteAccessDialog.test.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/TailscaleRemoteAccessDialog.test.tsx @@ -9,6 +9,7 @@ import { MAGIC_DNS_OPEN_IN_BROWSER_LABEL, TAILSCALE_ADMIN_CONSOLE_MACHINES_URL, TAILSCALE_MAGICDNS_REACHABILITY_LEAD, + TAILSCALE_PRIVATE_NETWORK_CONNECT_GUIDE_LABEL, TAILSCALE_SERVE_NOT_ENABLED_ON_TAILNET_MESSAGE, TAILSCALE_SERVE_STARTED_RUNNING_MESSAGE, } from "@/lib/ui-recovery-constants" @@ -59,6 +60,7 @@ describe("TailscaleRemoteAccessDialog", () => { expect(markup).not.toContain('aria-label="Copy command"') expect(markup).not.toContain('aria-label="Copy URL"') expect(markup).toContain(OCTOBOT_TAILSCALE_CONNECT_GUIDE_URL) + expect(markup).toContain(TAILSCALE_PRIVATE_NETWORK_CONNECT_GUIDE_LABEL) vi.unstubAllGlobals() }) }) diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/recovery-screen.test.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/recovery-screen.test.tsx index ea710178fa..5a8a311c50 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/recovery-screen.test.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Common/__tests__/recovery-screen.test.tsx @@ -5,6 +5,7 @@ import { confirmAndResetLocalBrowserData, RecoveryScreen, } from "@/components/Common/RecoveryScreen" +import { OCTOBOT_CONNECT_GUIDE_TWO_INTERFACES_URL } from "@/lib/external-links" const mocks = vi.hoisted(() => ({ resetClientStorage: vi.fn().mockResolvedValue(undefined), @@ -54,9 +55,16 @@ describe("RecoveryScreen", () => { }) it("insecure_context omits reset and reload, shows Tailscale setup", () => { + vi.stubGlobal("window", { + location: { + href: "http://192.168.1.50:8000/app/setup?x=1", + port: "8000", + }, + }) const markup = renderToStaticMarkup( , ) + vi.unstubAllGlobals() expect(markup).not.toContain("Reset local browser data") expect(markup).not.toContain("Reload page") expect(markup).toContain("Secure context required") @@ -71,6 +79,8 @@ describe("RecoveryScreen", () => { expect(markup).toContain("share-feedback-stub") expect(markup).toContain('data-testid="insecure-context-option-remote"') expect(markup).toContain('data-testid="recovery-insecure-share-feedback"') + expect(markup).toContain(OCTOBOT_CONNECT_GUIDE_TWO_INTERFACES_URL) + expect(markup).toContain("Learn more about the OctoBot interface in ") expect(markup.toLowerCase()).not.toContain("saved data") expect(markup.toLowerCase()).not.toContain("local data is fine") }) diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ConnectNodeGuide.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ConnectNodeGuide.tsx index 3d85ae7ee8..6618f12c7d 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ConnectNodeGuide.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ConnectNodeGuide.tsx @@ -15,7 +15,8 @@ import { } from "@/components/ui/card" import { buildPairingQrValue } from "@/lib/pairing" import { - OCTOBOT_BETA_GETTING_STARTED_GUIDE_URL, + OCTOBOT_CONNECT_GUIDE_COMMON_ISSUES_URL, + OCTOBOT_CONNECT_GUIDE_URL, OCTOBOT_PLAY_STORE_URL, OCTOBOT_TESTFLIGHT_URL, OCTOBOT_WEB_INTERFACE_URL, @@ -143,16 +144,28 @@ export function ConnectNodeGuide() {

Having trouble connecting to your node?{" "} Try using Brave or Google Chrome instead of Firefox or Safari, which are known to sometimes block the - connection to the node. More troubleshooting tips on{" "} + connection to the node. +

+

+ See our{" "} + + full connect guide + {" "} + and{" "} - our full guide - - . + common issues + {" "} + if the web app shows Unreachable node or Queued actions.

diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ManualNodeConnectPanel.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ManualNodeConnectPanel.tsx index 9bd9adc55b..e05edfce64 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ManualNodeConnectPanel.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/ManualNodeConnectPanel.tsx @@ -1,5 +1,9 @@ import { NodeConnectAddressTabs } from "@/components/Setup/NodeConnectAddressTabs" import { Button } from "@/components/ui/button" +import { + OCTOBOT_CONNECT_GUIDE_COMMON_ISSUES_URL, + OCTOBOT_CONNECT_GUIDE_URL, +} from "@/lib/external-links" type ManualNodeConnectPanelProps = { onSwitchToWeb: () => void @@ -12,9 +16,27 @@ export function ManualNodeConnectPanel({ onSwitchToWeb }: ManualNodeConnectPanel

- Having troubles connecting to your node from the app? Start with the web - version + Having troubles connecting to your node from the app? See our{" "} + + full connect guide + {" "} + or{" "} + + common issues + + .

+

You can also start with the web version.

diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/NodeConnectAddressTabs.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/NodeConnectAddressTabs.tsx index e6c07a0fc7..2e1218e9ca 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/NodeConnectAddressTabs.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/NodeConnectAddressTabs.tsx @@ -44,14 +44,14 @@ export function NodeConnectAddressTabs({ audience }: NodeConnectAddressTabsProps const vpnHostnameHelperText = couldNotDetectVpn ? ( <> - Tailscale may not be running or is disconnected.{" "} + Try restarting Tailscale on the node machine or{" "} + use local network instead + . Note: if you are using another VPN, this might not detect your IP address, you will need to find your it manually. ) : undefined @@ -105,13 +105,13 @@ export function NodeConnectAddressTabs({ audience }: NodeConnectAddressTabsProps rel="noopener noreferrer" >
{ diff --git a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/StartAutomationDialog.tsx b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/StartAutomationDialog.tsx index 9d7256414a..a79d5a3308 100644 --- a/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/StartAutomationDialog.tsx +++ b/packages/tentacles/Services/Interfaces/node_web_interface/src/components/Setup/StartAutomationDialog.tsx @@ -8,7 +8,10 @@ import { DialogTitle, } from "@/components/ui/dialog" import { Button } from "@/components/ui/button" -import { OCTOBOT_WEB_INTERFACE_URL } from "@/lib/external-links" +import { + OCTOBOT_CONNECT_GUIDE_URL, + OCTOBOT_WEB_INTERFACE_URL, +} from "@/lib/external-links" type StartAutomationDialogProps = { open: boolean @@ -70,9 +73,17 @@ export function StartAutomationDialog({ to="/settings/connect" className="underline underline-offset-4 hover:text-foreground" > - step-by-step guide - - . + quick step-by-step guide + {" "} + or the{" "} + + detailed guide on octobot.cloud + {" "} if you have questions.