Skip to content

feat: implement global browser offline detection and notification banner (#37)#67

Open
MayurKharat0390 wants to merge 1 commit into
abhro05:mainfrom
MayurKharat0390:feat/offline-handling
Open

feat: implement global browser offline detection and notification banner (#37)#67
MayurKharat0390 wants to merge 1 commit into
abhro05:mainfrom
MayurKharat0390:feat/offline-handling

Conversation

@MayurKharat0390

Copy link
Copy Markdown
Contributor

Summary

This PR addresses issue #37 by implementing global browser offline detection, a glassmorphic connection toast banner, and offline fallback adaptations on the Contributors page.

Key Changes

  • Connection Lifecycle Hook (useOnlineStatus):
    • Subscribes to window connection updates (online, offline) and returns state indicators dynamically.
  • Global Network Banner (NetworkStatusBanner):
    • Slides in from the bottom center when the network is lost (amber warning text, blur background).
    • Switches to an emerald green success banner on reconnection, fading out automatically after 3 seconds.
    • Mounted in App.jsx for global route persistence.
  • Offline Fetch Bypass (Contributors):
    • Skips network fetches when offline, preventing redundant developer console network error logs.
    • Automatically serves cached contributor lists.
    • Mounts a dismissible alert card notifying the user they are viewing cached data.

Verification & Testing

  • Vite Build: Ran npm run build to verify the production build compiles.
  • Offline Mocking: Tested toggling offline status inside browser inspection tools; verified the banner slides in/out correctly and the Contributors list gracefully defaults to cache without network requests.

@abhro05

abhro05 commented Jun 5, 2026

Copy link
Copy Markdown
Owner

@MayurKharat0390 Please resolve the conflicts and tag me!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants