💡[Feature]: Add Offline Mode & No-Internet State Handling #1273

Related Area

Frontend (React Native) + Backend (Node.js)

Is there an existing issue for this?

• I have searched the existing issues — no duplicate found.

Problem Statement

When a user loses network connectivity, the app shows no indicator, all API calls fail silently, and previously loaded articles are inaccessible. There is no retry mechanism when connection is restored.

Proposed Solution

• Use @react-native-community/netinfo to detect connectivity changes
• Show a persistent "You are offline" banner and auto-dismiss on reconnect
• Cache last-loaded articles using AsyncStorage or MMKV
• Show a friendly empty state when offline with no cached data
• Trigger automatic data refresh once connection is restored

Acceptance Criteria

• useNetworkStatus hook implemented
• Offline banner component shown/hidden based on connectivity
• Previously viewed articles readable offline
• Unit tests for the hook

Labels

enhancement, frontend, mobile-task, good first issue, level2, OpenSourceDevelopment
ecord

I have read the Contributing Guidelines

I'm a GSSOC'24 contributor

I'm a GSSOC'26 contributor

I'm a IEEE IGDTUW contributor

I want to work on this issue