[Bug]: Socket.IO client has no reconnection handling — real-time notifications are silently lost after any network interruption

[prince-pokharna]

bug, real-time, reliability, GSSoC 2026

Summary

StackIt uses Socket.IO for real-time notifications (new answers, comments, and mentions). The client-side Socket.IO setup uses default configuration with no explicit reconnection strategy, no room re-subscription after reconnect, and no missed-notifications recovery. After any network interruption — mobile data drop, laptop sleep, VPN reconnect — users silently miss all notifications that fired during the disconnection window.

Problem

• No explicit reconnection, reconnectionAttempts, or reconnectionDelay configuration on the Socket.IO client.
• After a reconnect, the client does not re-emit the room-join event, so server-side socket.to(userId).emit(...) calls go to a room the reconnected socket is no longer subscribed to.
• No HTTP polling fallback to fetch missed notifications on reconnect.
• No visual indicator when the real-time connection is interrupted.

Steps to Reproduce

1. Open StackIt and log in.
2. Disable your network connection for 30 seconds.
3. Have another user post an answer to your question.
4. Re-enable network.
5. Observe: no notification is received for the answer posted during the outage.

Proposed Solution

1. Configure explicit reconnection on the Socket.IO client:

// client/src/socket.js (or equivalent)
import { io } from 'socket.io-client';

const socket = io(import.meta.env.VITE_API_URL, {
  auth: { token: localStorage.getItem('token') },
  reconnection: true,
  reconnectionAttempts: 10,
  reconnectionDelay: 1000,
  reconnectionDelayMax: 5000,
  timeout: 20000,
});

socket.on('reconnect', () => {
  // Re-join personal notification room
  socket.emit('user:rejoin');
  // Fetch missed notifications since last seen
  fetchMissedNotifications();
});

socket.on('disconnect', () => {
  showConnectionBanner('Reconnecting...');
});

socket.on('connect', () => {
  hideConnectionBanner();
});

2. Add a GET /api/notifications/missed?since=<iso-timestamp> endpoint that returns all notifications generated since the client's last activity timestamp, called automatically on every reconnect.

3. Add a subtle "Reconnecting..." banner in the UI header so users are aware of connection state.

I am participating in GSSoC 2026. Could you please assign this issue to me?

[prince-pokharna]

Hey @Ashmita1206 ,
Please assign it to me under GSSoC 2026.
/assign /claim /claim-assignment