frishi/threetwo
1
0
Fork 0
Code Issues 9 Pull Requests 6 Actions Packages Projects Releases 2 Wiki Activity

🔧 Added caching to pull list call to CV

Browse Source
This commit is contained in:
Rishi Ghan
2022-02-13 22:24:16 -08:00
parent ce392ec13e
commit 1fbf677806
12 changed files with 191 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -31,6 +31,7 @@
"@types/socket.io-client": "^3.0.0",
"airdcpp-apisocket": "^2.4.4",
"array-sort-by": "^1.2.1",
"axios-cache-interceptor": "^0.8.8",
"babel-polyfill": "^6.26.0",
"better-docs": "^2.3.2",
"calibre-opds": "^1.0.7",

72
src/client/actions/comicinfo.actions.tsx
View File

@@ -2,7 +2,6 @@ import axios from "axios";
import rateLimiter from "axios-rate-limit";
import qs from "qs";
import { IExtractionOptions } from "threetwo-ui-typings";
import {
CV_SEARCH_SUCCESS,
CV_API_CALL_IN_PROGRESS,
@@ -14,18 +13,48 @@ import {
IMS_COMIC_BOOKS_DB_OBJECTS_FETCHED,
CV_ISSUES_MATCHES_IN_LIBRARY_FETCHED,
CV_ISSUES_FOR_VOLUME_IN_LIBRARY_SUCCESS,
CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS,
CV_WEEKLY_PULLLIST_FETCHED,
} from "../constants/action-types";
import {
COMICVINE_SERVICE_URI,
LIBRARY_SERVICE_BASE_URI,
} from "../constants/endpoints";
import { setupCache } from "axios-cache-interceptor";
// same object, but with updated typings.
const axiosWithCache = setupCache(axios);
const http = rateLimiter(axios.create(), {
maxRequests: 1,
perMilliseconds: 1000,
maxRPS: 1,
});
export const getWeeklyPullList = (options) => async (dispatch) => {
try {
dispatch({
type: CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS,
});
axiosWithCache({
url: `${COMICVINE_SERVICE_URI}/getWeeklyPullList`,
method: "get",
params: {
startDate: "2022-2-9",
endDate: "2022-2-16",
},
}).then((response) => {
dispatch({
type: CV_WEEKLY_PULLLIST_FETCHED,
data: response.data.results,
});
});
} catch (error) {
console.log(error);
}
};
export const comicinfoAPICall = (options) => async (dispatch) => {
try {
dispatch({
@@ -65,27 +94,28 @@ export const comicinfoAPICall = (options) => async (dispatch) => {
});
}
};
export const getIssuesForSeries = (comicObjectID: any) => async (dispatch) => {
dispatch({
type: CV_ISSUES_METADATA_CALL_IN_PROGRESS,
});
dispatch({
type: CV_CLEANUP,
});
export const getIssuesForSeries =
(comicObjectID: string) => async (dispatch) => {
dispatch({
type: CV_ISSUES_METADATA_CALL_IN_PROGRESS,
});
dispatch({
type: CV_CLEANUP,
});
const issues = await axios({
url: `${COMICVINE_SERVICE_URI}/getIssuesForSeries`,
method: "POST",
params: {
comicObjectID,
},
});
const issues = await axios({
url: `${COMICVINE_SERVICE_URI}/getIssuesForSeries`,
method: "POST",
params: {
comicObjectID,
},
});
dispatch({
type: CV_ISSUES_FOR_VOLUME_IN_LIBRARY_SUCCESS,
issues: issues.data,
});
};
dispatch({
type: CV_ISSUES_FOR_VOLUME_IN_LIBRARY_SUCCESS,
issues: issues.data,
});
};
export const analyzeLibrary = (issues) => async (dispatch) => {
dispatch({
@@ -107,7 +137,7 @@ export const analyzeLibrary = (issues) => async (dispatch) => {
queryObjects,
},
});
console.log(foo);
dispatch({
type: CV_ISSUES_MATCHES_IN_LIBRARY_FETCHED,
matches: foo.data,

2
src/client/components/App.tsx
View File

@@ -1,7 +1,7 @@
import React, { ReactElement, useState } from "react";
import { useSelector } from "react-redux";
import { hot } from "react-hot-loader";
import Dashboard from "./Dashboard";
import Dashboard from "./Dashboard/Dashboard";
import Import from "./Import";
import { ComicDetail } from "./ComicDetail";

6
src/client/components/Dashboard.tsx → src/client/components/Dashboard/Dashboard.tsx
View File

@@ -3,7 +3,8 @@ import { useDispatch, useSelector } from "react-redux";
import ZeroState from "./ZeroState";
import { RecentlyImported } from "./RecentlyImported";
import { VolumeGroups } from "./VolumeGroups";
import { getComicBooks } from "../actions/fileops.actions";
import { PullList } from "./PullList";
import { getComicBooks } from "../../actions/fileops.actions";
import { isEmpty, isNil, isUndefined } from "lodash";
export const Dashboard = (): ReactElement => {
@@ -32,6 +33,9 @@ export const Dashboard = (): ReactElement => {
{!isEmpty(recentComics) && !isEmpty(recentComics.docs) ? (
<>
{/* Pull List */}
<PullList issues={recentComics} />
{/* stats */}
<div>
<div className="box stats-palette p-3 column is-one-quarter">

75
src/client/components/Dashboard/PullList.tsx Normal file
View File

@@ -0,0 +1,75 @@
import { isNil, map } from "lodash";
import React, { ReactElement, useEffect } from "react";
import Card from "../Carda";
import Masonry from "react-masonry-css";
import { useDispatch, useSelector } from "react-redux";
import { getWeeklyPullList } from "../../actions/comicinfo.actions";
type PullListProps = {
issues: any;
};
export const PullList = ({ issues }: PullListProps): ReactElement => {
const dispatch = useDispatch();
useEffect(() => {
dispatch(getWeeklyPullList(issues));
}, []);
const pullList = useSelector((state: RootState) => state.comicInfo.pullList);
const breakpointColumnsObj = {
default: 5,
1100: 4,
700: 2,
600: 2,
};
return (
<>
<div className="content">
<h4 className="title is-4">Discover</h4>
<p className="subtitle is-7">
Pull List aggregated for the week from ComicVine
</p>
{/* select week */}
<div className="select is-small">
<select>
<option>Select Week</option>
<option>With options</option>
</select>
</div>
{/* See all pull list issues */}
<button className="button is-small">View all issues</button>
</div>
<Masonry
breakpointCols={breakpointColumnsObj}
className="recent-comics-container"
columnClassName="recent-comics-column"
>
{!isNil(pullList) &&
pullList &&
map(pullList, (issue) => {
return (
<Card
key={issue.id}
orientation={"vertical"}
imageUrl={issue.image.small_url}
hasDetails
title={issue.name}
>
<div className="content">
<div className="control">
<span className="tags has-addons">
<span className="tag is-primary is-light">Date</span>
<span className="tag">{issue.store_date}</span>
</span>
</div>
</div>
</Card>
);
})}
</Masonry>
</>
);
};
export default PullList;

10
src/client/components/RecentlyImported.tsx → src/client/components/Dashboard/RecentlyImported.tsx
View File

@@ -1,12 +1,12 @@
import React, { ReactElement } from "react";
import Card from "./Carda";
import Card from "../Carda";
import { Link } from "react-router-dom";
import ellipsize from "ellipsize";
import { escapePoundSymbol } from "../shared/utils/formatting.utils";
import { escapePoundSymbol } from "../../shared/utils/formatting.utils";
import { isNil, isUndefined, map } from "lodash";
import { detectIssueTypes } from "../shared/utils/tradepaperback.utils";
import { detectIssueTypes } from "../../shared/utils/tradepaperback.utils";
import Masonry from "react-masonry-css";
import { LIBRARY_SERVICE_HOST } from "../constants/endpoints";
import { LIBRARY_SERVICE_HOST } from "../../constants/endpoints";
type RecentlyImportedProps = {
comicBookCovers: any;
@@ -67,7 +67,7 @@ export const RecentlyImported = ({
)}
{/* Raw file presence */}
{isNil(rawFileDetails) && (
<span className="icon custom-icon is-small has-text-danger">
<span className="icon custom-icon is-small has-text-danger mr-2">
<img src="/img/missing-file.svg" />
</span>
)}

3
src/client/components/VolumeGroups.tsx → src/client/components/Dashboard/VolumeGroups.tsx
View File

@@ -3,7 +3,7 @@ import React, { ReactElement, useEffect } from "react";
import { useSelector, useDispatch } from "react-redux";
import ellipsize from "ellipsize";
import { Link } from "react-router-dom";
import { fetchVolumeGroups } from "../actions/fileops.actions";
import { fetchVolumeGroups } from "../../actions/fileops.actions";
import Masonry from "react-masonry-css";
export const VolumeGroups = (): ReactElement => {
@@ -20,7 +20,6 @@ export const VolumeGroups = (): ReactElement => {
const volumeGroups = useSelector(
(state: RootState) => state.fileOps.comicVolumeGroups,
);
console.log(volumeGroups);
return (
<section className="volumes-container mt-4">
<div className="content">

8
src/client/components/ZeroState.tsx → src/client/components/Dashboard/ZeroState.tsx
View File

@@ -1,18 +1,18 @@
import * as React from "react";
interface ZeroStateProps {
header: string;
header: string;
message: string;
}
const ZeroState: React.FunctionComponent<ZeroStateProps> = (props) => {
return (
<article className="message is-info">
<div className="message-body">
<p>{ props.header }</p>
{ props.message }
<p>{props.header}</p>
{props.message}
</div>
</article>
);
};
export default ZeroState;
export default ZeroState;

6
src/client/constants/action-types.ts
View File

@@ -25,6 +25,12 @@ export const IMS_CV_METADATA_IMPORT_FAILED = "IMS_CV_METADATA_IMPORT_FAILED";
export const IMS_RECENT_COMICS_FETCHED = "IMS_RECENT_COMICS_FETCHED";
export const IMS_DATA_FETCH_ERROR = "IMS_DATA_FETCH_ERROR";
// Weekly pull list
export const CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS =
"CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS";
export const CV_WEEKLY_PULLLIST_FETCHED = "CV_WEEKLY_PULLLIST_FETCHED";
export const CV_WEEKLY_PULLLIST_ERROR = "CV_WEEKLY_PULLLIST_ERROR";
// Single or multiple comic book mongo objects
export const IMS_COMIC_BOOK_DB_OBJECT_FETCHED =
"IMS_COMIC_BOOK_DB_OBJECT_FETCHED";

19
src/client/reducers/comicinfo.reducer.js
View File

@@ -1,4 +1,4 @@
import { isEmpty } from "lodash";
import { isEmpty, pull } from "lodash";
import {
CV_API_CALL_IN_PROGRESS,
CV_SEARCH_SUCCESS,
@@ -9,9 +9,12 @@ import {
CV_ISSUES_METADATA_CALL_IN_PROGRESS,
CV_ISSUES_MATCHES_IN_LIBRARY_FETCHED,
CV_ISSUES_FOR_VOLUME_IN_LIBRARY_SUCCESS,
CV_WEEKLY_PULLLIST_FETCHED,
CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS,
} from "../constants/action-types";
const initialState = {
pullList: [],
searchResults: [],
searchQuery: {},
inProgress: false,
@@ -97,6 +100,20 @@ function comicinfoReducer(state = initialState, action) {
...state,
issuesForVolume: updatedState,
};
case CV_WEEKLY_PULLLIST_CALL_IN_PROGRESS:
return {
inProgress: true,
...state,
};
case CV_WEEKLY_PULLLIST_FETCHED: {
console.log(action.data);
return {
...state,
inProgress: false,
pullList: [...action.data],
};
}
default:
return state;
}

1
src/client/reducers/fileops.reducer.ts
View File

@@ -89,7 +89,6 @@ function fileOpsReducer(state = initialState, action) {
};
}
case IMS_COMIC_BOOK_GROUPS_FETCHED: {
console.log(action)
return {
...state,
comicVolumeGroups: action.data,

24
yarn.lock
View File

@@ -2766,6 +2766,15 @@ axe-core@^4.3.5:
resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.3.5.tgz#78d6911ba317a8262bfee292aeafcc1e04b49cc5"
integrity sha512-WKTW1+xAzhMS5dJsxWkliixlO/PqC4VhmO9T4juNYcaTg9jzWiJsou6m5pxWYGfigWbwzJWeFY6z47a+4neRXA==
axios-cache-interceptor@^0.8.8:
version "0.8.8"
resolved "https://registry.yarnpkg.com/axios-cache-interceptor/-/axios-cache-interceptor-0.8.8.tgz#533b617b05a2c9f1602183631651ecbf62cad581"
integrity sha512-1F9Yt2V193dmVTYZn5BqGIi9xe++TTq/2CmAluXaHFVrZ9w/Vf2fp5BEH9q57tOe5l0GCE5+0dvjeGgBzzCBEw==
dependencies:
cache-parser "1.2.0"
fast-defer "^1.1.3"
object-code "^1.0.1"
axios-rate-limit@^1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/axios-rate-limit/-/axios-rate-limit-1.3.0.tgz#03241d24c231c47432dab6e8234cfde819253c2e"
@@ -3459,6 +3468,11 @@ cache-base@^1.0.1:
union-value "^1.0.0"
unset-value "^1.0.0"
cache-parser@1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/cache-parser/-/cache-parser-1.2.0.tgz#42cad5decefb079232b87baf8489cc78925e6d68"
integrity sha512-ExJkjMrEu+tG95DBSgk9UZwhKzTSTpvNu5dawNkGpubj3AUBih92gN5NJbGSbqHo6ZDR8nJ0jxT7t3t4FkofGQ==
cacheable-request@^2.1.1:
version "2.1.4"
resolved "https://registry.yarnpkg.com/cacheable-request/-/cacheable-request-2.1.4.tgz#0d808801b6342ad33c91df9d0b44dc09b91e5c3d"
@@ -5643,6 +5657,11 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
fast-defer@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/fast-defer/-/fast-defer-1.1.3.tgz#6f558e10c2fb796daa283978726283e6918594c0"
integrity sha512-nQejwC+FxKmCnRVzuQssIHsDWPNm6WAEogd5GXOCe9gBMtSoaZtxcuYaEQnz5H0+sDJvPJbllNitBepMqiL/6g==
fast-diff@^1.1.2:
version "1.2.0"
resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.2.0.tgz#73ee11982d86caaf7959828d519cfe927fac5f03"
@@ -9580,6 +9599,11 @@ object-assign@^4, object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
integrity sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=
object-code@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/object-code/-/object-code-1.0.1.tgz#57a6243fde3b47f0093fd71d5883e3335a297706"
integrity sha512-zt/mZJvjm3nyMH9BMcrV/NYgPrqKwno0sx2bdqD4juT2EWa7wxDPn5nQnYMIsfz4pIIDh6gupQ5bMJ+tTy1Kqw==
object-copy@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/object-copy/-/object-copy-0.1.0.tgz#7e7d858b781bd7c991a41ba975ed3812754e998c"