refactor: lots updates

src/routes/home/usePreload.js

@@ -1,25 +1,29 @@
 import { useEffect, useState } from "react";
-import { useDispatch } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
 import initCache, { useRehydrate } from "../../app/cache";
 import { useLazyGetContactsQuery } from "../../app/services/contact";
-import { useLazyInitStreamingQuery } from "../../app/services/streaming";
+// import { useLazyInitStreamingQuery } from "../../app/services/streaming";
 import { resetAuthData, setUid } from "../../app/slices/auth.data";
 import { fullfillContacts } from "../../app/slices/contacts";
 
 // import { useGetChannelsQuery } from "../../app/services/channel";
 import { useLazyGetServerQuery } from "../../app/services/server";
+import useStreaming from "../../common/hook/useStreaming";
 import { KEY_UID } from "../../app/config";
 // pollingInterval: 0,
 // const querySetting = {
 //   refetchOnMountOrArgChange: true,
 // };
+let request = null;
 export default function usePreload() {
   const { rehydrate, rehydrated } = useRehydrate();
-  const [initStreaming, { isLoading: streaming }] = useLazyInitStreamingQuery();
+  // const [initStreaming, { isLoading: streaming }] = useLazyInitStreamingQuery();
   const [checked, setChecked] = useState(false);
   const dispatch = useDispatch();
   const navigate = useNavigate();
+  const store = useSelector((store) => store);
+  const { startStreaming, streaming, initializing } = useStreaming();
   const [
     getContacts,
     {
@@ -41,6 +45,11 @@ export default function usePreload() {
   useEffect(() => {
     initCache();
     rehydrate();
+    return () => {
+      if (request) {
+        request.abort();
+      }
+    };
   }, []);
 
   useEffect(() => {
@@ -51,10 +60,10 @@ export default function usePreload() {
     }
   }, [rehydrated]);
   useEffect(() => {
-    if (checked && rehydrated) {
-      initStreaming({}, false);
+    if (checked && rehydrated && !initializing && !streaming) {
+      request = startStreaming(store);
     }
-  }, [checked, rehydrated]);
+  }, [checked, rehydrated, store, streaming, initializing]);
 
   useEffect(() => {
     const local_uid = localStorage.getItem(KEY_UID);
@@ -76,10 +85,9 @@ export default function usePreload() {
       }
     }
   }, [contacts]);
-  console.log("loading", contactsLoading, serverLoading, !checked, streaming);
+  // console.log("loading", contactsLoading, serverLoading, !checked);
   return {
-    loading:
-      contactsLoading || serverLoading || !checked || !rehydrated || streaming,
+    loading: contactsLoading || serverLoading || !checked || !rehydrated,
     error: contactsError && serverError,
     success: contactsSuccess && serverSuccess,
     data: {