🔧 Tooling for resumable socket.io sessions

src/client/actions/comicinfo.actions.tsx

@@ -33,7 +33,6 @@ export const getWeeklyPullList = (options) => async (dispatch) => {
     dispatch({
       type: CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS,
     });
-
     await cachedAxios(`${COMICVINE_SERVICE_URI}/getWeeklyPullList`, {
       method: "get",
       params: options,

src/client/actions/fileops.actions.tsx

@@ -40,7 +40,7 @@ import { success } from "react-notification-system-redux";
 
 import { isNil, map } from "lodash";
 
-export const getServiceStatus = (serviceName?: string) => async (dispatch) => {
+export const getServiceStatus = (serviceName?: string) => async dispatch => {
   axios
     .request({
       url: `${LIBRARY_SERVICE_BASE_URI}/getHealthInformation`,
@@ -91,9 +91,9 @@ export const fetchComicBookMetadata = () => async (dispatch) => {
   //   }),
   // );
   dispatch({
-    type: "EMIT_SOCKET_EVENT",
+    type: LS_IMPORT,
     meta: { remote: true },
-    data: { gym: "asas" },
+    data: {},
   });
 };
 export const toggleImportQueueStatus = (options) => async (dispatch) => {

src/client/components/App.tsx

@@ -19,7 +19,7 @@ import {
 } from "../context/AirDCPPSocket";
 import { SocketIOProvider } from "../context/SocketIOContext";
 import socketIOConnectionInstance from "../shared/socket.io/instance";
-import { isEmpty, isUndefined } from "lodash";
+import { isEmpty, isNil, isUndefined } from "lodash";
 import {
   AIRDCPP_DOWNLOAD_PROGRESS_TICK,
   LS_SINGLE_IMPORT,
@@ -97,13 +97,23 @@ const AirDCPPSocketComponent = (): ReactElement => {
   return <></>;
 };
 export const App = (): ReactElement => {
+  const dispatch = useDispatch();
   useEffect(() => {
-    // Listen for the sessionInitialized event
-    socketIOConnectionInstance.on("sessionInitialized", (sessionId) => {
-      console.log(sessionId);
-      // Store the session ID in Redux state
-      // initSession(sessionId);
-    });
+    // Check if there is a sessionId in localStorage
+    const sessionId = localStorage.getItem("sessionId");
+    if (!isNil(sessionId)) {
+      // Resume the session
+      dispatch({
+        type: "RESUME_SESSION",
+        meta: { remote: true },
+        data: { sessionId },
+      });
+    } else {
+      // Inititalize the session and persist the sessionId to localStorage
+      socketIOConnectionInstance.on("sessionInitialized", (sessionId) => {
+        localStorage.setItem("sessionId", sessionId);
+      });
+    }
   }, []);
   return (
     <SocketIOProvider socket={socketIOConnectionInstance}>

src/client/components/ComicDetail/Tabs/ComicInfoXML.tsx

@@ -48,7 +48,9 @@ export const ComicInfoXML = (data): ReactElement => {
         <dd>
           <span className="is-size-7">{json.notes[0]}</span>
         </dd>
-        <dd className="mt-1 mb-1">{json.summary[0]}</dd>
+        <dd className="mt-1 mb-1">
+          {!isUndefined(json.summary) && json.summary[0]}
+        </dd>
       </dl>
     </div>
   );

src/client/components/Dashboard/PullList.tsx

@@ -21,7 +21,7 @@ export const PullList = ({ issues }: PullListProps): ReactElement => {
   useEffect(() => {
     dispatch(
       getWeeklyPullList({
-        startDate: "2023-5-25",
+        startDate: "2023-7-25",
         pageSize: "15",
         currentPage: "1",
       }),

src/client/components/PullList/PullList.tsx

@@ -15,7 +15,7 @@ export const PullList = (): ReactElement => {
   useEffect(() => {
     dispatch(
       getWeeklyPullList({
-        startDate: "2022-11-15",
+        startDate: "2023-7-28",
         pageSize: "15",
         currentPage: "1",
       }),
@@ -109,15 +109,15 @@ export const PullList = (): ReactElement => {
         {!isNil(pullListComics) && (
           <div>
             <div className="library">
-            <T2Table
-              sourceData={pullListComics}
-              columns={columnData}
-              totalPages={pullListComics.length}
-              paginationHandlers={{
-                nextPage: nextPageHandler,
-                previousPage: previousPageHandler,
-              }}
-            />
+              <T2Table
+                sourceData={pullListComics}
+                columns={columnData}
+                totalPages={pullListComics.length}
+                paginationHandlers={{
+                  nextPage: nextPageHandler,
+                  previousPage: previousPageHandler,
+                }}
+              />
             </div>
           </div>
         )}

src/client/shared/socket.io/instance.tsx

@@ -1,9 +1,10 @@
 import io from "socket.io-client";
 import { SOCKET_BASE_URI } from "../../constants/endpoints";
-
+const sessionId = localStorage.getItem("sessionId");
 const socketIOConnectionInstance = io(SOCKET_BASE_URI, {
   transports: ["websocket"],
   withCredentials: true,
+  query: { sessionId },
 });
 
 export default socketIOConnectionInstance;