Changing the build system to Vite (#62)

* 🔧 Updated date for PullList on Dashboard * ⚡️ Added Vite config and removed useless files * 👷🏽 Updated build command * ❌ Removed useless deps * 🔧 Cleaned up package.json and bumped airdcpp-apisocket * 🔧 Updated some packages and deps * ⬆️ Bumped some deps * 🔧 Fixed typo in package.json * 🔧 Fix for broken paths https://github.com/rishighan/threetwo/issues/63 * 🔧 Fixed broken path and npm script Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com> --------- Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>
2023-03-01 23:31:22 -05:00
parent b12849efda
commit 2d61fa1436
19 changed files with 1276 additions and 9373 deletions
--- a/src/client/actions/fileops.actions.tsx
+++ b/src/client/actions/fileops.actions.tsx
@@ -307,7 +307,7 @@ export const searchIssue = (query, options) => async (dispatch) => {
    case "globalSearchBar":
      dispatch({
        type: SS_SEARCH_RESULTS_FETCHED_SPECIAL,
-        data: response.data.body,
+        data: response.data.hits,
      });
      break;

--- a/src/client/assets/scss/App.scss
+++ b/src/client/assets/scss/App.scss
@@ -1,8 +1,8 @@
-@import "../../../../node_modules/bulma/bulma.sass";
-$fa-font-path: "~@fortawesome/fontawesome-free/webfonts";
-@import "../../../../node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss";
-@import "../../../../node_modules/@fortawesome/fontawesome-free/scss/regular.scss";
-@import "../../../../node_modules/@fortawesome/fontawesome-free/scss/solid.scss";
+@import "/node_modules/bulma/bulma.sass";
+$fa-font-path: "/node_modules/@fortawesome/fontawesome-free/webfonts";
+@import "/node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss";
+@import "/node_modules/@fortawesome/fontawesome-free/scss/regular.scss";
+@import "/node_modules/@fortawesome/fontawesome-free/scss/solid.scss";
 $bg-color: yellow;
 $border-color: red;

--- a/src/client/components/ComicDetail/AcquisitionPanel.tsx
+++ b/src/client/components/ComicDetail/AcquisitionPanel.tsx
@@ -167,7 +167,7 @@ export const AcquisitionPanel = (
                        }
                      >
                        <span className="icon is-small">
-                          <img src="/img/airdcpp_logo.svg" />
+                          <img src="/src/client/assets/img/airdcpp_logo.svg" />
                        </span>
                        <span className="airdcpp-text">Search on AirDC++</span>
                      </button>
--- 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: "2022-12-25",
+        startDate: "2023-1-25",
        pageSize: "15",
        currentPage: "1",
      }),
--- 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="/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="/img/comicinfoxml.svg"
+                          src="/src/client/img/comicinfoxml.svg"
                          alt={"ComicInfo.xml file detected."}
                        />
                      </span>
@@ -99,8 +99,8 @@ export const RecentlyImported = ({
                    {isComicBookMetadataAvailable && (
                      <span className="icon custom-icon">
                        <img
-                          src="/img/cvlogo.svg"
-                          alt={"ComicInfo.xml file detected."}
+                          src="/src/client/assets/img/cvlogo.svg"
+                          alt={"ComicVine metadata detected."}
                        />
                      </span>
                    )}
--- a/src/client/components/Dashboard/WantedComicsList.tsx
+++ b/src/client/components/Dashboard/WantedComicsList.tsx
@@ -82,12 +82,12 @@ export const WantedComicsList = ({
                  {/* comicVine metadata presence */}
                  {isComicBookMetadataAvailable && (
                    <span className="icon custom-icon">
-                      <img src="/img/cvlogo.svg" />
+                      <img src="/src/client/assets/img/cvlogo.svg" />
                    </span>
                  )}
                  {!isEmpty(locg) && (
                    <span className="icon custom-icon">
-                      <img src="/img/locglogo.svg" />
+                      <img src="/src/client/img/locglogo.svg" />
                    </span>
                  )}
                  {/* Issue type */}
--- a/src/client/components/GlobalSearchBar/SearchBar.tsx
+++ b/src/client/components/GlobalSearchBar/SearchBar.tsx
@@ -31,7 +31,7 @@ export const SearchBar = (data: ISearchBarProps): ReactElement => {
              from: 0,
            },
            type: "volumeName",
-            trigger: "globalSearchBar"
+            trigger: "globalSearchBar",
          },
        ),
      );
@@ -51,7 +51,6 @@ export const SearchBar = (data: ISearchBarProps): ReactElement => {
          <i className="fa-solid fa-magnifying-glass"></i>
        </span>
      </div>
-
      {!isEmpty(searchResults) ? (
        <div
          className="columns box is-multiline"
--- a/src/client/components/Navbar.tsx
+++ b/src/client/components/Navbar.tsx
@@ -25,7 +25,7 @@ const Navbar: React.FunctionComponent = (props) => {
      <div className="navbar-brand">
        <Link to="/" className="navbar-item">
          <img
-            src="/img/threetwo.svg"
+            src="/src/client/assets/img/threetwo.svg"
            alt="ThreeTwo! A comic book curator"
            width="112"
            height="28"
--- a/src/client/constants/endpoints.ts
+++ b/src/client/constants/endpoints.ts
@@ -11,68 +11,68 @@ export const hostURIBuilder = (options: Record<string, string>): string => {

 export const CORS_PROXY_SERVER_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "8050",
  apiPath: "/",
 });

 export const COMICVINE_SERVICE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3080",
  apiPath: "/api/comicvine",
 });

 export const METRON_SERVICE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3080",
  apiPath: "/api/metron",
 });

 export const API_BASE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "8050",
  apiPath: "/api",
 });

 export const LIBRARY_SERVICE_HOST = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3000",
  apiPath: ``,
 });
 export const LIBRARY_SERVICE_BASE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3000",
  apiPath: "/api/library",
 });
 export const SEARCH_SERVICE_BASE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3000",
  apiPath: "/api/search",
 });

 export const SETTINGS_SERVICE_BASE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3000",
  apiPath: "/api/settings",
 });

 export const IMAGETRANSFORMATION_SERVICE_BASE_URI = hostURIBuilder({
  protocol: "http",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3000",
  apiPath: "/api/imagetransformation",
 });

 export const SOCKET_BASE_URI = hostURIBuilder({
  protocol: "ws",
-  host: process.env.UNDERLYING_HOSTNAME || "localhost",
+  host: import.meta.env.UNDERLYING_HOSTNAME || "localhost",
  port: "3001",
  apiPath: `/`,
 });
--- a/src/client/reducers/fileops.reducer.ts
+++ b/src/client/reducers/fileops.reducer.ts
@@ -233,7 +233,7 @@ function fileOpsReducer(state = initialState, action) {
    case SS_SEARCH_RESULTS_FETCHED_SPECIAL: {
      const foo = [];
      if (!isUndefined(action.data.hits)) {
-        map(action.data.hits.hits, ({ _source }) => {
+        map(action.data.hits, ({ _source }) => {
          foo.push(_source);
        });
      }
--- a/src/funding.yml
+++ b/src/funding.yml
@@ -1 +0,0 @@
-github: [rishighan]
--- a/src/server/index.ts
+++ b/src/server/index.ts
@@ -30,12 +30,12 @@ app.use(bodyParser.urlencoded({ extended: true }));
 // REGISTER ROUTES
 // all of the routes will be prefixed with /api
 const routes: Router[] = Object.values(router);
-app.use("/api", routes);
+// app.use("/api", routes);

 // Send index.html on root request
-app.use(express.static("dist"));
-app.use(express.static("public"));
+// app.use(express.static("dist"));
+// app.use(express.static("public"));

-app.listen(port);
+// app.listen(port);

-console.log(`Server is listening on ${port}`);
+// console.log(`Server is listening on ${port}`);