🔧 Refactoring the airdcpp reducer

2021-08-26 21:47:05 -07:00
parent 2960c2dca4
commit 4ebe543f6a
5 changed files with 102 additions and 50 deletions
--- a/src/client/actions/airdcpp.actions.tsx
+++ b/src/client/actions/airdcpp.actions.tsx
@@ -11,8 +11,9 @@ import {
  AIRDCPP_RESULT_DOWNLOAD_INITIATED,
  AIRDCPP_DOWNLOAD_PROGRESS_TICK,
  AIRDCPP_BUNDLES_FETCHED,
+  AIRDCPP_SEARCH_IN_PROGRESS,
 } from "../constants/action-types";
-import { each, isNil } from "lodash";
+import { each, isNil, isUndefined } from "lodash";
 import axios from "axios";

 interface SearchData {
@@ -26,33 +27,82 @@ function sleep(ms: number): Promise<NodeJS.Timeout> {
 }

 export const search = (data: SearchData) => async (dispatch) => {
-  await SocketService.connect("admin", "password", true);
-  const instance: SearchInstance = await SocketService.post("search");
+  try {
+    if (!SocketService.isConnected()) {
+      await SocketService.connect("admin", "password", true);
+    }
+    const instance: SearchInstance = await SocketService.post("search");

-  SocketService.addListener(
-    `search/${instance.id}`,
-    "search_hub_searches_sent",
-    async (searchInfo) => {
-      dispatch({
-        type: AIRDCPP_HUB_SEARCHES_SENT,
-        searchInfo,
-        instance,
-      });
-    },
-  );
+    // We want to get notified about every new result in order to make the user experience better
+    await SocketService.addListener(
+      `search/${instance.id}`,
+      "search_result_added",
+      (groupedResult) => {
+        dispatch({
+          type: AIRDCPP_SEARCH_RESULTS_RECEIVED,
+          groupedResult: groupedResult.result,
+        });
+        // ...add the received result in the UI
+        // (it's probably a good idea to have some kind of throttling for the UI updates as there can be thousands of results)
+      },
+    );

-  await SocketService.post<SearchResponse>(
-    `search/${instance.id}/hub_search`,
-    data,
-  );
+    // We also want to update the existing items in our list when new hits arrive for the previously listed files/directories
+    await SocketService.addListener(
+      `search/${instance.id}`,
+      "search_result_updated",
+      async (groupedResult) => {
+        console.log(groupedResult);
+        dispatch({
+          type: AIRDCPP_SEARCH_RESULTS_RECEIVED,
+          results: groupedResult,
+        });
+        // ...update properties of the existing result in the UI
+      },
+    );

-  await sleep(10000);
-  const results = await SocketService.get(`search/${instance.id}/results/0/25`);
-  dispatch({
-    type: AIRDCPP_SEARCH_RESULTS_RECEIVED,
-    results,
-  });
-  return results;
+    await SocketService.addListener(
+      `search/${instance.id}`,
+      "search_hub_searches_sent",
+      async (searchInfo) => {
+        await sleep(5000);
+        // The search can now be considered to be "complete"
+
+        // Check the number of received results (in real use cases we should know that even without calling the API)
+        const currentInstance = await SocketService.get(
+          `search/${instance.id}`,
+        );
+        if (currentInstance.result_count === 0) {
+          console.log("ASDASDASDASDD");
+          // ...nothing was received, show an informative message to the user
+        }
+
+        // If there's an "in progress" indicator in the UI, that could also be disabled here
+        dispatch({
+          type: AIRDCPP_HUB_SEARCHES_SENT,
+          searchInfo,
+          instance,
+        });
+      },
+    );
+    await SocketService.post<SearchResponse>(
+      `search/${instance.id}/hub_search`,
+      data,
+    );
+
+    // await sleep(10000);
+    // const results = await SocketService.get(
+    //   `search/${instance.id}/results/0/25`,
+    // );
+
+    // dispatch({
+    //     type: AIRDCPP_SEARCH_RESULTS_RECEIVED,
+    //     results,
+    //   });
+  } catch (error) {
+    console.log("ERO", error);
+    throw error;
+  }
 };

 export const downloadAirDCPPItem =
@@ -111,7 +161,7 @@ export const getDownloadProgress =
      if (!SocketService.isConnected()) {
        await SocketService.connect("admin", "password", true);
      }
-      SocketService.addListener(
+      await SocketService.addListener(
        `queue`,
        "queue_bundle_tick",
        async (downloadProgressData) => {
--- a/src/client/components/AcquisitionPanel.tsx
+++ b/src/client/components/AcquisitionPanel.tsx
@@ -16,7 +16,7 @@ export const AcquisitionPanel = (
  const sanitizedVolumeName = volumeName.replace(/[^a-zA-Z0-9 ]/g, "");
  const issueName = props.comicBookMetadata.sourcedMetadata.comicvine.name;
  const airDCPPSearchResults = useSelector(
-    (state: RootState) => state.airdcpp.results,
+    (state: RootState) => { console.log(state); return state.airdcpp.results;}
  );
  const isAirDCPPSearchInProgress = useSelector(
    (state: RootState) => state.airdcpp.isAirDCPPSearchInProgress,
@@ -35,13 +35,15 @@ export const AcquisitionPanel = (
    },
    [dispatch],
  );
+
  const dcppQuery = {
    query: {
-      pattern: `${sanitizedVolumeName}`,
+      pattern: `${sanitizedVolumeName.replace(/#/g, "")}`,
+      // pattern: "Templier T2.cbr",
      extensions: ["cbz", "cbr"],
    },
    hub_urls: ["nmdcs://piter.feardc.net:411"],
-    priority: 1,
+    priority: 5,
  };

  const downloadDCPPResult = useCallback(
@@ -102,7 +104,8 @@ export const AcquisitionPanel = (
      </div>
      {/* AirDC++ results */}
      <div>
-        {!isNil(airDCPPSearchResults) && (
+          ASDASD {JSON.stringify(airDCPPSearchResults)}
+        {/* {!isNil(airDCPPSearchResults) && (
          <table className="table is-striped">
            <thead>
              <tr>
@@ -169,7 +172,7 @@ export const AcquisitionPanel = (
              })}
            </tbody>
          </table>
-        )}
+        )} */}
      </div>
    </>
  );
--- a/src/client/components/ComicDetail.tsx
+++ b/src/client/components/ComicDetail.tsx
@@ -85,7 +85,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
      name: "Volume Information",
      icon: <i className="fas fa-layer-group"></i>,
      content: isComicBookMetadataAvailable ? (
-        <>
+        <div key={1}>
          <div className="columns">
            <div className="column is-narrow">
              <figure className="card-image">
@@ -137,26 +137,28 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
              )}
            ></div>
          </div>
-        </>
+        </div>
      ) : null,
    },
    {
      id: 2,
      icon: <i className="fas fa-puzzle-piece"></i>,
      name: "Other Metadata",
-      content: <div>bastard</div>,
+      content: <div key={2}>bastard</div>,
    },
    {
      id: 3,
      icon: <i className="fas fa-download"></i>,
      name: "Acquisition",
-      content: <AcquisitionPanel comicBookMetadata={comicBookDetailData} />,
+      content: (
+        <AcquisitionPanel comicBookMetadata={comicBookDetailData} key={3} />
+      ),
    },
    {
      id: 4,
      icon: <i className="fas fa-cloud-download-alt"></i>,
      name: "Downloads",
-      content: <DownloadsPanel data={comicBookDetailData} />,
+      content: <DownloadsPanel data={comicBookDetailData} key={4} />,
    },
  ];
  const MetadataTabGroup = () => {
--- a/src/client/components/DownloadsPanel.tsx
+++ b/src/client/components/DownloadsPanel.tsx
@@ -60,11 +60,11 @@ export const DownloadsPanel = (
          {!isNil(props.data) &&
            props.data &&
            map(props.data, (bundle) => (
-              <>
+              <span key={bundle.id}>
                <dt>{bundle.name}</dt>
                <dd>{bundle.target}</dd>
                <dd>{bundle.size}</dd>
-              </>
+              </span>
            ))}
        </dl>
      </div>
--- a/src/client/reducers/airdcpp.reducer.ts
+++ b/src/client/reducers/airdcpp.reducer.ts
@@ -10,32 +10,30 @@ import { LOCATION_CHANGE } from "connected-react-router";

 const initialState = {
  isAirDCPPSearchInProgress: false,
-  searchStatus: "",
  searchInfo: null,
  searchInstance: null,
  downloadResult: null,
  bundleDBImportResult: null,
+  searchResults: [],
 };

 function airdcppReducer(state = initialState, action) {
  switch (action.type) {
+    case AIRDCPP_SEARCH_RESULTS_RECEIVED:
+      console.log("mad", state.searchResults);
+      return {
+        ...state,
+        isAirDCPPSearchInProgress: true,
+        searchResults: [...state.searchResults, action.groupedResult],
+      };
    case AIRDCPP_SEARCH_IN_PROGRESS:
      return {
        ...state,
        isAirDCPPSearchInProgress: true,
      };
-
-    case AIRDCPP_SEARCH_RESULTS_RECEIVED:
-      return {
-        ...state,
-        isAirDCPPSearchInProgress: false,
-        searchStatus: "Search complete",
-        results: action.results,
-      };
    case AIRDCPP_HUB_SEARCHES_SENT:
      return {
        ...state,
-        searchStatus: "Hub searches sent",
        isAirDCPPSearchInProgress: true,
        searchInfo: action.searchInfo,
        searchInstance: action.instance,
@@ -52,7 +50,6 @@ function airdcppReducer(state = initialState, action) {
        downloadProgressData: action.downloadProgressData,
      };
    case AIRDCPP_BUNDLES_FETCHED:
-        console.log(action)
      return {
        ...state,
        bundles: action.bundles,
@@ -63,7 +60,7 @@ function airdcppReducer(state = initialState, action) {
      };

    default:
-      return state;
+      return { ...state };
  }
 }