Skip to content

feat(offline): add manual retry button to OfflineIndicator - #844

Merged
Jaydbrown merged 1 commit into
conduit-protocol:mainfrom
kobbzy:feat/794-offline-retry-button
Oct 22, 2026
Merged

Jaydbrown merged 1 commit into
conduit-protocol:mainfrom
kobbzy:feat/794-offline-retry-button

Conversation

@kobbzy

@kobbzy kobbzy commented Oct 22, 2026

Copy link
Copy Markdown
Contributor

Summary

Adds a Retry Connection button to the offline toast in components/OfflineIndicator.tsx.

Users returning from a flight or subway who are back online can now manually trigger a connectivity check rather than waiting for the browser's online event.

What changed

components/OfflineIndicator.tsx

  • Added retrying state and a handleRetry useCallback that sends a HEAD request with cache: 'no-store' to NEXT_PUBLIC_HORIZON_URL (falls back to the testnet URL if the env var is unset).
  • On success → banner hides (isOnline set to true).
  • On failure → banner stays, button re-enables so the user can retry again.
  • Button is disabled and shows Retrying… while the request is in-flight.
  • Existing status text wrapped in <span> so the button sits inline cleanly.

components/__tests__/OfflineIndicator.test.tsx

  • Added afterEach(() => vi.restoreAllMocks()) to the outer suite.
  • Added a nested describe('Retry Connection button') block with 5 tests:
    1. Button renders with correct label and is enabled when offline.
    2. Shows Retrying… and is disabled while the fetch is in-flight.
    3. Hides the banner when the retry fetch succeeds.
    4. Keeps the banner visible and re-enables the button when the fetch fails.
    5. Calls fetch with { method: 'HEAD', cache: 'no-store' }.

Test results

All 11 OfflineIndicator tests pass. No pre-existing failures were introduced or masked — the only files changed are:

  • components/OfflineIndicator.tsx
  • components/__tests__/OfflineIndicator.test.tsx

Closes #794

…rotocol#794)

Add a 'Retry Connection' button to the offline toast that pings
NEXT_PUBLIC_HORIZON_URL with a HEAD/no-store request. On success the
banner hides (connection restored); on failure the banner stays visible
and the button re-enables so the user can try again.

Changes:
- components/OfflineIndicator.tsx: add retrying state + handleRetry
  callback; wrap existing text in <span>; render button inline
- components/__tests__/OfflineIndicator.test.tsx: 5 new tests covering
  button render, in-flight disabled state, success/failure paths, and
  fetch arguments; add afterEach restoreAllMocks

Closes conduit-protocol#794
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

components/OfflineIndicator.tsx: add manual reconnect retry button to offline toast

2 participants