Merge branch 'master' of https://github.com/rishighan/threetwo into elasticsearch-upgrade-fix

🔧 Fixes for DOMNesting issues on the Downloads page
Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>
2023-03-05 23:03:28 -05:00 · 2023-03-02 00:20:23 -05:00 · 2023-03-02 00:12:25 -05:00 · 2023-03-02 00:12:02 -05:00 · 2023-03-02 00:02:19 -05:00 · 2023-03-01 23:48:57 -05:00
35 changed files with 573 additions and 3430 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,14 +1,14 @@
 module.exports = {
-  extends: ["plugin:react/recommended", "plugin:@typescript-eslint/recommended", "plugin:prettier/recommended", "plugin:css-modules/recommended", "plugin:storybook/recommended", "plugin:storybook/recommended", "plugin:storybook/recommended", "plugin:storybook/recommended"],
+  extends: ["plugin:react/recommended", "plugin:@typescript-eslint/recommended", "plugin:prettier/recommended", "plugin:css-modules/recommended", "plugin:storybook/recommended", "plugin:storybook/recommended", "plugin:storybook/recommended"],
  parser: "@typescript-eslint/parser",
  parserOptions: {
    sourceType: "module",
    ecmaVersion: 2020,
    ecmaFeatures: {
      jsx: true // Allows for the parsing of JSX
+
    }
  },
-
  plugins: ["@typescript-eslint", "css-modules"],
  settings: {
    "import/resolver": {
@@ -18,9 +18,9 @@ module.exports = {
    },
    react: {
      version: "detect" // Tells eslint-plugin-react to automatically detect the version of React to use
+
    }
  },
-
  // Fine tune rules
  rules: {
    "@typescript-eslint/no-var-requires": 0
--- a/.github/workflows/docker-image.yml
+++ b/.github/workflows/docker-image.yml
@@ -12,7 +12,7 @@ jobs:
    steps:
    - uses: actions/checkout@master
    - name: Publish to Registry
-      uses: elgohr/Publish-Docker-Github-Action@v5
+      uses: elgohr/Publish-Docker-Github-Action@master
      with:
        name: frishi/threetwo
        username: ${{ secrets.DOCKER_USERNAME }}
--- a/.storybook/main.js
+++ b/.storybook/main.js
@@ -0,0 +1,19 @@
+module.exports = {
+  stories: [
+    "../src/client/stories/*.stories.mdx",
+    "../src/client/stories/*.stories.@(js|jsx|ts|tsx)",
+  ],
+  staticDirs: [
+    "../src/client/stories/assets"
+  ],
+  addons: [
+    "@storybook/addon-links",
+    "@storybook/preset-scss",
+    "@storybook/addon-essentials",
+    "@storybook/addon-interactions",
+  ],
+  framework: "@storybook/react",
+  core: {
+    builder: "webpack5",
+  },
+};
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@@ -1,17 +0,0 @@
-import type { StorybookConfig } from "@storybook/react-vite";
-const config: StorybookConfig = {
-  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
-  addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-interactions",
-  ],
-  framework: {
-    name: "@storybook/react-vite",
-    options: {},
-  },
-  docs: {
-    autodocs: "tag",
-  },
-};
-export default config;
--- a/.storybook/preview-head.html
+++ b/.storybook/preview-head.html
@@ -1,3 +0,0 @@
-<script>
-  window.global = window;
-</script>
--- a/.storybook/preview.js
+++ b/.storybook/preview.js
@@ -0,0 +1,9 @@
+export const parameters = {
+  actions: { argTypesRegex: "^on[A-Z].*" },
+  controls: {
+    matchers: {
+      color: /(background|color)$/i,
+      date: /Date$/,
+    },
+  },
+}
--- a/.storybook/preview.ts
+++ b/.storybook/preview.ts
@@ -1,18 +0,0 @@
-import type { Preview } from "@storybook/react";
-
-const preview: Preview = {
-  parameters: {
-    backgrounds: {
-      default: "light",
-    },
-    actions: { argTypesRegex: "^on[A-Z].*" },
-    controls: {
-      matchers: {
-        color: /(background|color)$/i,
-        date: /Date$/,
-      },
-    },
-  },
-};
-
-export default preview;
--- a/Matching.png
+++ b/Matching.png
--- a/integration.png
+++ b/integration.png
--- a/Dashboard.png
+++ b/Dashboard.png
--- a/6
+++ b/6
@@ -1,4 +1,4 @@
-FROM node:18.15.0-alpine
+FROM node:17.3-alpine
 LABEL maintainer="Rishi Ghan <rishi.ghan@gmail.com>"

 WORKDIR /threetwo
@@ -9,11 +9,11 @@ COPY nodemon.json ./
 COPY jsdoc.json ./

 # RUN apt-get update && apt-get install -y git python3 build-essential autoconf automake g++ libpng-dev make
-RUN apk --no-cache add g++ make libpng-dev git python3 libc6-compat autoconf automake libjpeg-turbo-dev libpng-dev mesa-dev mesa libxi build-base gcc libtool nasm
+RUN apk --no-cache add g++ make libpng-dev python3 git libc6-compat autoconf automake  bash libjpeg-turbo-dev libpng-dev mesa-dev mesa libxi build-base gcc libtool nasm
 RUN yarn --ignore-engines


 COPY . .
-EXPOSE 5173
+EXPOSE 3050

 ENTRYPOINT [ "npm", "start" ]
--- a/Library.png
+++ b/Library.png
--- a/README.md
+++ b/README.md
@@ -6,13 +6,13 @@ ThreeTwo! _aims to be_ a comic book curation app.

 ### Screenshots

-![](https://github.com/rishighan/threetwo-visual-updates/raw/67e56878eb0381c73c1dea746a45253d3dcaa184/update_december_2022/Dashboard.png)
+![](https://raw.githubusercontent.com/rishighan/threetwo/rishighan-screenshots-dec-2022/Dashboard.png)

-![](https://github.com/rishighan/threetwo-visual-updates/raw/67e56878eb0381c73c1dea746a45253d3dcaa184/update_december_2022/Library.png)
+![](https://raw.githubusercontent.com/rishighan/threetwo/rishighan-screenshots-dec-2022/Library.png)

-![](https://github.com/rishighan/threetwo-visual-updates/raw/67e56878eb0381c73c1dea746a45253d3dcaa184/update_december_2022/DC%2B%2B%20integration.png)
+![](https://raw.githubusercontent.com/rishighan/threetwo/rishighan-screenshots-dec-2022/DC%2B%2B%20integration.png)

-![](https://github.com/rishighan/threetwo-visual-updates/raw/67e56878eb0381c73c1dea746a45253d3dcaa184/update_december_2022/ComicVine%20Matching.png)
+![](https://raw.githubusercontent.com/rishighan/threetwo/rishighan-screenshots-dec-2022/ComicVine%20Matching.png)


 ### 🦄 Early Development Support Channel
@@ -40,8 +40,9 @@ For debugging and troubleshooting, you can run this app locally using these step

 1. Clone this repo using `git clone https://github.com/rishighan/threetwo.git`
 2. `yarn run dev` (you can ignore the warnings)
-3. This will open `http://localhost:5173` in your default browser
-4. Note that this is simply the UI layer and won't offer anything beyond a scaffold. You have to spin up the microservices locally to get it to work.
+3. This will open `http://localhost:3050` in your default browser
+4. For testing `OPDS` functionality, create a folder called `comics` under `/src/server` and put some comics in there. The `OPDS` feed is accessed to `http://localhost:8050/api/opds`
+5. Note that this is simply the UI layer and won't offer anything beyond a scaffold. You have to spin up the microservices locally to get it to work.


 ## Troubleshooting
--- a/package.json
+++ b/package.json
@@ -7,10 +7,8 @@
  "scripts": {
    "build": "vite build",
    "dev": "rimraf dist && npm run build && vite",
-    "start": "npm run build && vite",
-    "docs": "jsdoc -c jsdoc.json",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
+    "prod": "npm run build && vite",
+    "docs": "jsdoc -c jsdoc.json"
  },
  "author": "Rishi Ghan",
  "license": "MIT",
@@ -20,31 +18,32 @@
    "@dnd-kit/core": "^4.0.0",
    "@dnd-kit/sortable": "^5.0.0",
    "@dnd-kit/utilities": "^3.2.0",
-    "@fortawesome/fontawesome-free": "^6.3.0",
+    "@fortawesome/fontawesome-free": "^6.1.1",
    "@redux-devtools/extension": "^3.2.2",
    "@rollup/plugin-node-resolve": "^15.0.1",
    "@tanstack/react-table": "^8.5.11",
-    "@types/axios": "^0.14.0",
    "@types/mime-types": "^2.1.0",
-    "@types/react-router-dom": "^5.3.3",
+    "@types/react": "^17.0.3",
+    "@types/react-dom": "^17.0.2",
+    "@types/react-redux": "^7.1.16",
+    "@types/react-router-dom": "^5.1.7",
    "@types/socket.io": "^3.0.2",
    "@types/socket.io-client": "^3.0.0",
    "@vitejs/plugin-react": "^3.1.0",
-    "airdcpp-apisocket": "~2.4.5-beta.2",
-    "axios": "^1.3.4",
-    "axios-cache-interceptor": "^1.0.1",
+    "airdcpp-apisocket": "2.4.5-beta.1",
+    "axios": "^0.27.2",
    "axios-rate-limit": "^1.3.0",
+    "axios-simple-cache-adapter": "^1.1.0",
    "babel-polyfill": "^6.26.0",
    "babel-preset-minify": "^0.5.2",
    "better-docs": "^2.7.2",
    "date-fns": "^2.28.0",
    "dayjs": "^1.10.6",
-    "ellipsize": "^0.5.1",
+    "ellipsize": "^0.1.0",
    "express": "^4.17.1",
    "filename-parser": "^1.0.2",
    "final-form": "^4.20.2",
    "final-form-arrays": "^3.0.2",
-    "history": "^5.3.0",
    "html-to-text": "^8.1.0",
    "jsdoc": "^3.6.10",
    "lodash": "^4.17.21",
@@ -56,16 +55,16 @@
    "react-collapsible": "^2.9.0",
    "react-comic-viewer": "^0.4.0",
    "react-day-picker": "^8.6.0",
-    "react-dom": "^18.2.0",
+    "react-dom": "^18.1.0",
    "react-fast-compare": "^3.2.0",
    "react-final-form": "^6.5.9",
    "react-final-form-arrays": "^3.1.4",
    "react-loader-spinner": "^4.0.0",
    "react-masonry-css": "^1.0.16",
    "react-modal": "^3.15.1",
-    "react-redux": "^8.0.5",
-    "react-router": "^6.9.0",
-    "react-router-dom": "^6.9.0",
+    "react-redux": "^7.2.6",
+    "react-router": "^6.2.2",
+    "react-router-dom": "^6.2.2",
    "react-select": "^5.3.2",
    "react-select-async-paginate": "^0.7.2",
    "react-slick": "^0.29.0",
@@ -78,10 +77,12 @@
    "redux-thunk": "^2.4.2",
    "slick-carousel": "^1.8.1",
    "socket.io-client": "^4.3.2",
-    "styled-components": "^5.3.9",
+    "styled-components": "^5.3.5",
    "threetwo-ui-typings": "^1.0.14",
    "vite-plugin-html": "^3.2.0",
    "websocket": "^1.0.34",
+    "ws": "^7.5.3",
+    "xml2js": "^0.4.23",
    "xregexp": "^5.0.2"
  },
  "devDependencies": {
@@ -92,27 +93,21 @@
    "@babel/preset-env": "^7.20.2",
    "@babel/preset-react": "^7.18.6",
    "@babel/preset-typescript": "^7.13.0",
-    "@storybook/addon-essentials": "^7.0.0-rc.3",
-    "@storybook/addon-interactions": "^7.0.0-rc.3",
-    "@storybook/addon-links": "^7.0.0-rc.3",
-    "@storybook/blocks": "^7.0.0-rc.3",
-    "@storybook/react": "^7.0.0-rc.3",
-    "@storybook/react-vite": "^7.0.0-rc.3",
-    "@storybook/testing-library": "^0.0.14-next.1",
    "@tsconfig/node14": "^1.0.0",
-    "@types/ellipsize": "^0.1.1",
    "@types/express": "^4.17.8",
    "@types/jest": "^26.0.20",
    "@types/lodash": "^4.14.168",
    "@types/node": "^14.14.34",
-    "@types/react": "^18.0.28",
-    "@types/react-dom": "^18.0.11",
-    "@types/react-redux": "^7.1.25",
+    "@types/react": "^17.0.3",
+    "@types/react-dom": "^17.0.2",
+    "@types/react-redux": "^7.1.16",
    "@typescript-eslint/eslint-plugin": "^4.17.0",
    "@typescript-eslint/parser": "^4.17.0",
    "babel-eslint": "^10.0.0",
    "body-parser": "^1.19.0",
    "bulma": "^0.9.4",
+    "comlink": "^4.3.0",
+    "concurrently": "^4.0.0",
    "eslint": "^7.22.0",
    "eslint-config-airbnb": "^18.2.1",
    "eslint-config-airbnb-base": "^14.2.1",
@@ -122,7 +117,6 @@
    "eslint-plugin-jsx-a11y": "^6.0.3",
    "eslint-plugin-prettier": "^3.3.1",
    "eslint-plugin-react": "^7.22.0",
-    "eslint-plugin-storybook": "^0.6.11",
    "express": "^4.17.1",
    "install": "^0.13.0",
    "jest": "^26.6.3",
@@ -132,9 +126,8 @@
    "react-refresh": "^0.14.0",
    "rimraf": "^4.1.3",
    "sass": "^1.58.1",
-    "storybook": "^7.0.0-rc.3",
    "tslint": "^6.1.3",
-    "typescript": "^5.0.2",
-    "vite": "^4.2.0"
+    "typescript": "^4.2.3",
+    "vite": "^4.1.1"
  }
 }
--- a/src/client/actions/comicinfo.actions.tsx
+++ b/src/client/actions/comicinfo.actions.tsx
@@ -1,6 +1,10 @@
 import axios from "axios";
 import rateLimiter from "axios-rate-limit";
-import { setupCache } from "axios-cache-interceptor";
+import {
+  AxiosCacheRequestConfig,
+  createCacheAdapter,
+} from "axios-simple-cache-adapter";
+import qs from "qs";
 import {
  CV_SEARCH_SUCCESS,
  CV_API_CALL_IN_PROGRESS,
@@ -22,22 +26,25 @@ import {
  LIBRARY_SERVICE_BASE_URI,
 } from "../constants/endpoints";

+const axiosCacheAdapter = createCacheAdapter();
 const http = rateLimiter(axios.create(), {
  maxRequests: 1,
  perMilliseconds: 1000,
  maxRPS: 1,
 });
-const cachedAxios = setupCache(axios);
+
 export const getWeeklyPullList = (options) => async (dispatch) => {
  try {
    dispatch({
      type: CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS,
    });

-    await cachedAxios(`${COMICVINE_SERVICE_URI}/getWeeklyPullList`, {
+    await axios(`${COMICVINE_SERVICE_URI}/getWeeklyPullList`, {
      method: "get",
      params: options,
-    }).then((response) => {
+      axiosCacheAdapter,
+      cache: 1000, // value in MS
+    } as AxiosCacheRequestConfig).then((response) => {
      dispatch({
        type: CV_WEEKLY_PULLLIST_FETCHED,
        data: response.data.result,
@@ -63,6 +70,9 @@ export const comicinfoAPICall = (options) => async (dispatch) => {
        "Content-Type": "application/json",
        "Access-Control-Allow-Origin": "*",
      },
+      paramsSerializer: (params) => {
+        return qs.stringify(params, { arrayFormat: "repeat" });
+      },
    });

    switch (options.callURIAction) {
--- a/src/client/actions/fileops.actions.tsx
+++ b/src/client/actions/fileops.actions.tsx
@@ -34,27 +34,11 @@ import {
  WANTED_COMICS_FETCHED,
  VOLUMES_FETCHED,
  CV_WEEKLY_PULLLIST_FETCHED,
-  LIBRARY_SERVICE_HEALTH,
 } from "../constants/action-types";
 import { success } from "react-notification-system-redux";

 import { isNil, map } from "lodash";

-export const getServiceStatus = (serviceName?: string) => async dispatch => {
-  axios
-    .request({
-      url: `${LIBRARY_SERVICE_BASE_URI}/getHealthInformation`,
-      method: "GET",
-      transformResponse: (r: string) => JSON.parse(r),
-    })
-    .then((response) => {
-      const { data } = response;
-      dispatch({
-        type: LIBRARY_SERVICE_HEALTH,
-        status: data,
-      });
-    });
-};
 export async function walkFolder(path: string): Promise<Array<IFolderData>> {
  return axios
    .request<Array<IFolderData>>({
@@ -143,50 +127,49 @@ export const getComicBooks = (options) => async (dispatch) => {
 * @returns Nothing.
 * @param payload
 */
-export const importToDB =
-  (sourceName: string, metadata?: any) => (dispatch) => {
-    try {
-      const comicBookMetadata = {
-        importType: "new",
-        payload: {
-          rawFileDetails: {
-            name: "",
-          },
-          importStatus: {
-            isImported: true,
-            tagged: false,
-            matchedResult: {
-              score: "0",
-            },
-          },
-          sourcedMetadata: metadata || null,
-          acquisition: { source: { wanted: true, name: sourceName } },
+export const importToDB = (sourceName: string, metadata?: any) => (dispatch) => {
+  try {
+    const comicBookMetadata = {
+      importType: "new",
+      payload: {
+        rawFileDetails: {
+          name: "",
        },
-      };
-      dispatch({
-        type: IMS_CV_METADATA_IMPORT_CALL_IN_PROGRESS,
-      });
-      return axios
-        .request({
-          url: `${LIBRARY_SERVICE_BASE_URI}/rawImportToDb`,
-          method: "POST",
-          data: comicBookMetadata,
-          // transformResponse: (r: string) => JSON.parse(r),
-        })
-        .then((response) => {
-          const { data } = response;
-          dispatch({
-            type: IMS_CV_METADATA_IMPORT_SUCCESSFUL,
-            importResult: data,
-          });
+        importStatus: {
+          isImported: true,
+          tagged: false,
+          matchedResult: {
+            score: "0",
+          },
+        },
+        sourcedMetadata: metadata || null,
+        acquisition: { source: { wanted: true, name: sourceName } },
+      }
+    };
+    dispatch({
+      type: IMS_CV_METADATA_IMPORT_CALL_IN_PROGRESS,
+    });
+    return axios
+      .request({
+        url: `${LIBRARY_SERVICE_BASE_URI}/rawImportToDb`,
+        method: "POST",
+        data: comicBookMetadata,
+        // transformResponse: (r: string) => JSON.parse(r),
+      })
+      .then((response) => {
+        const { data } = response;
+        dispatch({
+          type: IMS_CV_METADATA_IMPORT_SUCCESSFUL,
+          importResult: data,
        });
-    } catch (error) {
-      dispatch({
-        type: IMS_CV_METADATA_IMPORT_FAILED,
-        importError: error,
      });
-    }
-  };
+  } catch (error) {
+    dispatch({
+      type: IMS_CV_METADATA_IMPORT_FAILED,
+      importError: error,
+    });
+  }
+};

 export const fetchVolumeGroups = () => async (dispatch) => {
  try {
@@ -271,23 +254,24 @@ export const fetchComicVineMatches =
 * @returns {any}
 */
 export const extractComicArchive =
+
  (path: string, options: any): any =>
-  async (dispatch) => {
-    dispatch({
-      type: IMS_COMIC_BOOK_ARCHIVE_EXTRACTION_CALL_IN_PROGRESS,
-    });
-    await axios({
-      method: "POST",
-      url: `${LIBRARY_SERVICE_BASE_URI}/uncompressFullArchive`,
-      headers: {
-        "Content-Type": "application/json; charset=utf-8",
-      },
-      data: {
-        filePath: path,
-        options,
-      },
-    });
-  };
+    async (dispatch) => {
+      dispatch({
+        type: IMS_COMIC_BOOK_ARCHIVE_EXTRACTION_CALL_IN_PROGRESS,
+      });
+      await axios({
+        method: "POST",
+        url: `${LIBRARY_SERVICE_BASE_URI}/uncompressFullArchive`,
+        headers: {
+          "Content-Type": "application/json; charset=utf-8",
+        },
+        data: {
+          filePath: path,
+          options,
+        },
+      });
+    };

 /**
 * Description
@@ -365,4 +349,4 @@ export const analyzeImage =
      type: IMG_ANALYSIS_DATA_FETCH_SUCCESS,
      result: foo.data,
    });
-  };
+  };
--- a/src/client/components/AirDCPPSettings/AirDCPPSettingsForm.tsx
+++ b/src/client/components/AirDCPPSettings/AirDCPPSettingsForm.tsx
@@ -15,15 +15,14 @@ export const AirDCPPSettingsForm = (): ReactElement => {
    try {
      if (!isUndefined(hostname)) {
        const matches = hostname.match(hostnameRegex);
-        return isNil(matches) && matches.length !== 0
-          ? hostname
-          : "Invalid hostname; it should not contain special characters";
+        return (isNil(matches) && matches.length !== 0) ? hostname : "Invalid hostname; it should not contain special characters";
      }
-    } catch {
+    }
+    catch {
      return null;
    }
-  };
-
+  }
+  
  const onSubmit = useCallback(async (values) => {
    try {
      airDCPPSettings.setSettings(values);
@@ -40,7 +39,7 @@ export const AirDCPPSettingsForm = (): ReactElement => {
    airDCPPSettings.setSettings({});
    dispatch(deleteSettings());
  }, []);
-  const validate = async () => {};
+  const validate = async () => { };
  const initFormData = !isUndefined(
    airDCPPSettings.airDCPPState.settings.directConnect,
  )
@@ -68,20 +67,13 @@ export const AirDCPPSettingsForm = (): ReactElement => {
                </span>
              </p>
              <div className="control is-expanded">
-                <Field name="hostname" validate={hostValidator}>
+                <Field
+                  name="hostname"
+                  validate={hostValidator}>
                  {({ input, meta }) => (
                    <div>
-                      <input
-                        {...input}
-                        type="text"
-                        placeholder="AirDC++ hostname"
-                        className="input"
-                      />
-                      {meta.error && meta.touched && (
-                        <span className="is-size-7 has-text-danger">
-                          {meta.error}
-                        </span>
-                      )}
+                      <input {...input} type="text" placeholder="AirDC++ hostname" className="input" />
+                      {meta.error && meta.touched && <span className="is-size-7 has-text-danger">{meta.error}</span>}
                    </div>
                  )}
                </Field>
--- a/src/client/components/ComicDetail/DownloadsPanel.tsx
+++ b/src/client/components/ComicDetail/DownloadsPanel.tsx
@@ -1,5 +1,7 @@
 import React, { useEffect, useContext, ReactElement } from "react";
-import { getBundlesForComic } from "../../actions/airdcpp.actions";
+import {
+  getBundlesForComic,
+} from "../../actions/airdcpp.actions";
 import { useDispatch, useSelector } from "react-redux";
 import { RootState } from "threetwo-ui-typings";
 import { isEmpty, isNil, map } from "lodash";
--- a/src/client/components/ComicDetail/RawFileDetails.tsx
+++ b/src/client/components/ComicDetail/RawFileDetails.tsx
@@ -1,7 +1,7 @@
 import React, { ReactElement } from "react";
 import PropTypes from "prop-types";
 import prettyBytes from "pretty-bytes";
-import { isEmpty } from "lodash";
+import { isUndefined } from "lodash";

 export const RawFileDetails = (props): ReactElement => {
  const { rawFileDetails, inferredMetadata } = props.data;
@@ -34,14 +34,6 @@ export const RawFileDetails = (props): ReactElement => {
                  </span>
                </div>
              </div>
-              <div className="control">
-                <div className="tags has-addons">
-                  <span className="tag">MIME type</span>
-                  <span className="tag is-primary is-light">
-                    {rawFileDetails.mimeType}
-                  </span>
-                </div>
-              </div>
            </div>
          </dd>
        </dl>
@@ -61,7 +53,7 @@ export const RawFileDetails = (props): ReactElement => {
                  </span>
                </div>
              </div>
-              {!isEmpty(inferredMetadata.issue.number) ? (
+              {!isUndefined(inferredMetadata.issue.number) ? (
                <div className="control">
                  <div className="tags has-addons">
                    <span className="tag">Number</span>
@@ -89,7 +81,6 @@ RawFileDetails.propTypes = {
      fileSize: PropTypes.number,
      path: PropTypes.string,
      extension: PropTypes.string,
-      mimeType: PropTypes.string,
      cover: PropTypes.shape({
        filePath: PropTypes.string,
      }),
--- a/src/client/components/Dashboard/PullList.tsx
+++ b/src/client/components/Dashboard/PullList.tsx
@@ -20,7 +20,7 @@ export const PullList = ({ issues }: PullListProps): ReactElement => {
  useEffect(() => {
    dispatch(
      getWeeklyPullList({
-        startDate: "2023-5-25",
+        startDate: "2023-1-25",
        pageSize: "15",
        currentPage: "1",
      }),
@@ -127,7 +127,7 @@ export const PullList = ({ issues }: PullListProps): ReactElement => {
      <Slider {...settings} ref={(c) => (sliderRef = c)}>
        {!isNil(pullList) &&
          pullList &&
-          map(pullList, ({ issue }, idx) => {
+          map(pullList, ({issue}, idx) => {
            return (
              <Card
                key={idx}
@@ -161,4 +161,4 @@ export const PullList = ({ issues }: PullListProps): ReactElement => {
  );
 };

-export default PullList;
+export default PullList;
--- a/src/client/components/Dashboard/RecentlyImported.tsx
+++ b/src/client/components/Dashboard/RecentlyImported.tsx
@@ -83,14 +83,14 @@ export const RecentlyImported = ({
                    {/* Raw file presence  */}
                    {isNil(rawFileDetails) && (
                      <span className="icon custom-icon is-small has-text-danger mr-2">
-                        <img src="/src/client/assets/img/missing-file.svg" />
+                        <img src="/src/client/img/missing-file.svg" />
                      </span>
                    )}
                    {/* ComicInfo.xml presence */}
                    {!isNil(comicInfo) && !isEmpty(comicInfo) && (
                      <span className="icon custom-icon is-small has-text-danger">
                        <img
-                          src="/src/client/assets/img/comicinfoxml.svg"
+                          src="/src/client/img/comicinfoxml.svg"
                          alt={"ComicInfo.xml file detected."}
                        />
                      </span>
@@ -125,7 +125,7 @@ export const RecentlyImported = ({
                    <dd className="is-size-9">
                      <dl>
                        <span className="icon custom-icon">
-                          <img src={`/src/client/assets/img/${icon}`} />
+                          <img src={`/img/${icon}`} />
                        </span>
                      </dl>
                      <dl>
--- a/src/client/components/Dashboard/WantedComicsList.tsx
+++ b/src/client/components/Dashboard/WantedComicsList.tsx
@@ -87,7 +87,7 @@ export const WantedComicsList = ({
                  )}
                  {!isEmpty(locg) && (
                    <span className="icon custom-icon">
-                      <img src="/src/client/assets/img/locglogo.svg" />
+                      <img src="/src/client/img/locglogo.svg" />
                    </span>
                  )}
                  {/* Issue type */}
--- a/src/client/components/Library/LibraryGrid.tsx
+++ b/src/client/components/Library/LibraryGrid.tsx
@@ -73,7 +73,7 @@ export const LibraryGrid = (libraryGridProps: ILibraryGridProps) => {
                <div className="content is-flex is-flex-direction-row">
                  {!isEmpty(sourcedMetadata.comicvine) && (
                    <span className="icon cv-icon is-small">
-                      <img src="/src/client/assets/img/cvlogo.svg" />
+                      <img src="/dist/img/cvlogo.svg" />
                    </span>
                  )}
                  {isNil(rawFileDetails) && (
--- a/src/client/components/Navbar.tsx
+++ b/src/client/components/Navbar.tsx
@@ -85,7 +85,7 @@ const Navbar: React.FunctionComponent = (props) => {
              {downloadProgressTick && <div className="pulsating-circle"></div>}
            </a>
            {!isUndefined(downloadProgressTick) ? (
-              <div className="navbar-dropdown is-right is-boxed">
+              <div className="navbar-dropdown is-right">
                <a className="navbar-item">
                  <DownloadProgressTick data={downloadProgressTick} />
                </a>              </div>
@@ -98,7 +98,7 @@ const Navbar: React.FunctionComponent = (props) => {
                <a className="navbar-link is-arrowless has-text-success">
                  <i className="fa-solid fa-bolt"></i>
                </a>
-                <div className="navbar-dropdown pr-2 pl-2 is-right airdcpp-status is-boxed">
+                <div className="navbar-dropdown pt-4 pr-2 pl-2 is-right airdcpp-status">
                  {/* AirDC++ Session Information */}

                  <p>
@@ -133,7 +133,7 @@ const Navbar: React.FunctionComponent = (props) => {
                <a className="navbar-link is-arrowless has-text-danger">
                  <i className="fa-solid fa-bolt"></i>
                </a>
-                <div className="navbar-dropdown pr-2 pl-2 is-right is-boxed">
+                <div className="navbar-dropdown pr-2 pl-2 is-right">
                  <pre>
                    {JSON.stringify(socketDisconnectionReason, null, 2)}
                  </pre>
--- a/src/client/components/Search.tsx
+++ b/src/client/components/Search.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, ReactElement } from "react";
+import React, { useMemo, useCallback, ReactElement } from "react";
 import { isNil, isEmpty } from "lodash";
 import { IExtractedComicBookCoverFile, RootState } from "threetwo-ui-typings";
 import { importToDB } from "../actions/fileops.actions";
--- a/src/client/components/ServiceStatuses/ServiceStatuses.tsx
+++ b/src/client/components/ServiceStatuses/ServiceStatuses.tsx
@@ -1,25 +0,0 @@
-import React, { ReactElement } from "react";
-import { useDispatch, useSelector } from "react-redux";
-import { useEffect } from "react";
-import { getServiceStatus } from "../../actions/fileops.actions";
-
-export const ServiceStatuses = (): ReactElement => {
-  const serviceStatus = useSelector(
-    (state: RootState) => state.fileOps.libraryServiceStatus,
-  );
-  const dispatch = useDispatch();
-  useEffect(() => {
-    dispatch(getServiceStatus());
-  }, []);
-  return (
-    <div className="is-clearfix">
-      <div className="mt-4">
-        <h3 className="title">Core Services</h3>
-        <h6 className="subtitle has-text-grey-light">
-          Statuses for core services
-        </h6>
-      </div>
-      <pre>{JSON.stringify(serviceStatus, null, 2)}</pre>
-    </div>
-  );
-};
--- a/src/client/components/Settings.tsx
+++ b/src/client/components/Settings.tsx
@@ -2,7 +2,6 @@ import React, { useState, ReactElement } from "react";
 import { AirDCPPSettingsForm } from "./AirDCPPSettings/AirDCPPSettingsForm";
 import { AirDCPPHubsForm } from "./AirDCPPSettings/AirDCPPHubsForm";
 import { SystemSettingsForm } from "./SystemSettings/SystemSettingsForm";
-import { ServiceStatuses } from "./ServiceStatuses/ServiceStatuses";
 import settingsObject from "../constants/settings/settingsMenu.json";
 import { isUndefined, map } from "lodash";

@@ -23,10 +22,6 @@ export const Settings = (props: ISettingsProps): ReactElement => {
        </div>
      ),
    },
-    {
-      id: "core-service",
-      content: <ServiceStatuses />,
-    },
    {
      id: "flushdb",
      content: (
--- a/src/client/components/shared/MetadataPanel.tsx
+++ b/src/client/components/shared/MetadataPanel.tsx
@@ -57,12 +57,6 @@ export const MetadataPanel = (props: IMetadatPanelProps): ReactElement => {
                  >
                    {rawFileDetails.extension}
                  </span>
-                  <span
-                    className="tag is-success is-light has-text-weight-semibold"
-                    style={props.tagsStyle}
-                  >
-                    {rawFileDetails.mimeType}
-                  </span>
                  <span
                    className="tag is-success is-light"
                    style={props.tagsStyle}
--- a/src/client/constants/action-types.ts
+++ b/src/client/constants/action-types.ts
@@ -139,7 +139,4 @@ export const SETTINGS_DB_FLUSH_SUCCESS = "SETTINGS_DB_FLUSH_SUCCESS";
 // Metron Metadata
 export const METRON_DATA_FETCH_SUCCESS = "METRON_DATA_FETCH_SUCCESS";
 export const METRON_DATA_FETCH_IN_PROGRESS = "METRON_DATA_FETCH_IN_PROGRESS";
-export const METRON_DATA_FETCH_ERROR = "METRON_DATA_FETCH_ERROR";
-
-// service health statuses
-export const LIBRARY_SERVICE_HEALTH = "LIBRARY_SERVICE_HEALTH";
+export const METRON_DATA_FETCH_ERROR = "METRON_DATA_FETCH_ERROR";
--- a/src/client/constants/endpoints.ts
+++ b/src/client/constants/endpoints.ts
@@ -8,7 +8,6 @@ export const hostURIBuilder = (options: Record<string, string>): string => {
    options.apiPath
  );
 };
-console.log(import.meta);

 export const CORS_PROXY_SERVER_URI = hostURIBuilder({
  protocol: "http",
--- a/src/client/constants/settings/settingsMenu.json
+++ b/src/client/constants/settings/settingsMenu.json
@@ -57,21 +57,6 @@
  },
  {
    "id": 4,
-    "category": "statuses",
-    "displayName": "Service Status",
-    "children": [
-      {
-        "id": "core-service",
-        "displayName": "Core Services"
-      },
-      {
-        "id": "metadata-service",
-        "displayName": "Metadata Services"
-      }
-    ]
-  },
-  {
-    "id": 5,
    "category": "system",
    "displayName": "System",
    "children": [
@@ -82,7 +67,7 @@
    ]
  },
  {
-    "id": 6,
+    "id": 5,
    "category": "acknowledgments",
    "displayName": "Acknowledgments",
    "children": [
--- a/src/client/reducers/fileops.reducer.ts
+++ b/src/client/reducers/fileops.reducer.ts
@@ -30,8 +30,6 @@ import {
  SS_SEARCH_RESULTS_FETCHED_SPECIAL,
  VOLUMES_FETCHED,
  COMICBOOK_EXTRACTION_SUCCESS,
-  LIBRARY_SERVICE_HEALTH,
-  HEALTH_STATUS_TICK,
 } from "../constants/action-types";
 import { removeLeadingPeriod } from "../shared/utils/formatting.utils";
 import { LIBRARY_SERVICE_HOST } from "../constants/endpoints";
@@ -60,7 +58,6 @@ const initialState = {
  librarySearchResultCount: 0,
  libraryQueueResults: [],
  librarySearchError: {},
-  libraryServiceStatus: {},
 };

 function fileOpsReducer(state = initialState, action) {
@@ -156,13 +153,13 @@ function fileOpsReducer(state = initialState, action) {
    }
    case LS_COVER_EXTRACTED: {
      console.log("BASH", action);
-      if (state.recentComics.length === 5) {
+      if(state.recentComics.length === 5) {
        state.recentComics.pop();
      }
      return {
        ...state,
        librarySearchResultCount: state.librarySearchResultCount + 1,
-        recentComics: [...state.recentComics, action.result.data.importResult],
+        recentComics: [...state.recentComics, action.result.data.importResult]
      };
    }

@@ -274,12 +271,7 @@ function fileOpsReducer(state = initialState, action) {
        SSCallInProgress: false,
      };
    }
-    case LIBRARY_SERVICE_HEALTH: {
-      return {
-        ...state,
-        libraryServiceStatus: action.status,
-      };
-    }
+
    case FILEOPS_STATE_RESET: {
      return {
        ...state,
@@ -291,4 +283,4 @@ function fileOpsReducer(state = initialState, action) {
  }
 }

-export default fileOpsReducer;
+export default fileOpsReducer;
--- a/src/client/stories/MetadataPanel.stories.tsx
+++ b/src/client/stories/MetadataPanel.stories.tsx
@@ -30,20 +30,20 @@ RawFileDetails.args = {
        },
        "inferredMetadata": {
          "issue": {
-            "name": "Batman Annual 02",
+            "name": "Fantastic Four 143",
            "number": 197402,
            "year": "1974",
            "subtitle": ""
          }
        },
        "rawFileDetails": {
-          "name": "Batman Annual 02",
+          "name": "197402 Fantastic Four 143",
          "filePath": "/Users/rishi/work/threetwo-core-service/comics/197402 Fantastic Four 143.cbz",
          "fileSize": 10341074,
          "extension": ".cbz",
          "containedIn": "./userdata/covers/197402 Fantastic Four 143",
          "cover": {
-            "filePath": "userdata/covers/Batman Annual 02/Batman 002_00a.jpg"
+            "filePath": "userdata/covers/197402 Fantastic Four 143/FF143_01.jpg"
          }
        },
        "sourcedMetadata": { "comicInfo": null, "comicvine": { "aliases": [] } },
--- a/vite.config.js
+++ b/vite.config.js
@@ -6,7 +6,6 @@ export default defineConfig({
  publicDir: "public",
  base: "",
  build: "esnext",
-  server: { host: true },
  plugins: [
    nodeResolve({
      // browser: true
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
Rishi Ghan	3fcfe57dd6	Merge branch 'master' of https://github.com/rishighan/threetwo into elasticsearch-upgrade-fix	2023-03-05 23:03:28 -05:00
Rishi Ghan	dd4bf31612	🔧 Fixes for DOMNesting issues on the Downloads page Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>	2023-03-02 00:20:23 -05:00
Rishi Ghan	145a5be9dc	➕ Committing the reducer Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>	2023-03-02 00:12:25 -05:00
Rishi Ghan	a3359a84e3	🔧 Fixed the response in wanted reducer action Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>	2023-03-02 00:12:02 -05:00
Rishi Ghan	10bf19ecdb	🔧 Fixed DOMNesting issues Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>	2023-03-02 00:02:19 -05:00
Rishi Ghan	179e4122d7	#️⃣ Added a key prop to MetadataPanel in global search results Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>	2023-03-01 23:48:57 -05:00
Rishi Ghan	5b1ed2bdb8	🔧 Fixed the response object in reducers and components https://github.com/rishighan/threetwo/issues/64 Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>	2023-03-01 23:40:18 -05:00