Data syncs correctly when reconnected after offline period

An app that does not automatically sync on reconnect forces users to manually pull-to-refresh or restart the app to see changes made on another device or from the server. CWE-362 applies when the window between going offline and reconnecting allows remote state to diverge without the client knowing. ISO 25010:2011 reliability.recoverability requires that the app reaches a consistent state after a connectivity gap without user intervention. In collaborative or multi-device scenarios, the failure to auto-sync on reconnect means users work on stale data, potentially overwriting remote changes.

Detect the offline→online transition in your NetInfo listener and trigger a full sync cycle — upload queued local changes first, then fetch remote updates, then reconcile.

import { useEffect, useRef, useState } from 'react';
import NetInfo from '@react-native-community/netinfo';

export function useSyncOnReconnect() {
  const [isOnline, setIsOnline] = useState(true);
  const wasOnline = useRef(true);

  useEffect(() => {
    const unsub = NetInfo.addEventListener(async (state) => {
      const online = state.isConnected ?? false;
      if (!wasOnline.current && online) {
        // Transition: offline → online
        await drainQueue(executeAction);   // flush local writes
        await fetchRemoteUpdates();        // pull server state
        await reconcileConflicts();        // merge (see conflict-resolution-strategy)
      }
      wasOnline.current = online;
      setIsOnline(online);
    });
    return unsub;
  }, []);

  return isOnline;
}

Run this hook at root navigator level so the sync fires regardless of which screen the user is on when connectivity returns.