feature/IO-3096-GlobalNotifications - Checkpoint - Clean up previous socket usages by funneling them all through useSocket vs useContext(SocketConext), package updates.

client/src/components/notification-center/notification-center.container.jsx

@@ -3,7 +3,7 @@ import { useQuery } from "@apollo/client";
 import { connect } from "react-redux";
 import NotificationCenterComponent from "./notification-center.component";
 import { GET_NOTIFICATIONS } from "../../graphql/notifications.queries";
-import { useSocket } from "../../contexts/SocketIO/socketContext.jsx";
+import { INITIAL_NOTIFICATIONS, useSocket } from "../../contexts/SocketIO/socketContext.jsx";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors.js";
 
@@ -31,7 +31,7 @@ export function NotificationCenterContainer({ visible, onClose, bodyshop }) {
     refetch
   } = useQuery(GET_NOTIFICATIONS, {
     variables: {
-      limit: 20,
+      limit: INITIAL_NOTIFICATIONS,
       offset: 0,
       where: whereClause
     },
@@ -147,7 +147,9 @@ export function NotificationCenterContainer({ visible, onClose, bodyshop }) {
 
   useEffect(() => {
     if (visible && !isConnected) {
-      refetch();
+      refetch().catch(
+        (err) => `Something went wrong re-fetching notifications in the notification-center: ${err?.message || ""}`
+      );
     }
   }, [visible, isConnected, refetch]);