🐂 Support for showing import progress
This commit is contained in:
@@ -23,7 +23,7 @@
|
||||
"@fortawesome/fontawesome-free": "^6.3.0",
|
||||
"@redux-devtools/extension": "^3.2.2",
|
||||
"@rollup/plugin-node-resolve": "^15.0.1",
|
||||
"@tanstack/react-table": "^8.5.11",
|
||||
"@tanstack/react-table": "^8.9.3",
|
||||
"@types/axios": "^0.14.0",
|
||||
"@types/mime-types": "^2.1.0",
|
||||
"@types/react-router-dom": "^5.3.3",
|
||||
|
||||
@@ -127,7 +127,7 @@ export const analyzeLibrary = (issues) => async (dispatch) => {
|
||||
queryObjects,
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
dispatch({
|
||||
type: CV_ISSUES_MATCHES_IN_LIBRARY_FETCHED,
|
||||
matches: foo.data,
|
||||
|
||||
@@ -12,6 +12,7 @@ import {
|
||||
} from "../../actions/fileops.actions";
|
||||
import { getLibraryStatistics } from "../../actions/comicinfo.actions";
|
||||
import { isEmpty, isNil } from "lodash";
|
||||
import Header from "../Header";
|
||||
|
||||
export const Dashboard = (): ReactElement => {
|
||||
const dispatch = useDispatch();
|
||||
@@ -64,6 +65,48 @@ export const Dashboard = (): ReactElement => {
|
||||
<>
|
||||
{/* Pull List */}
|
||||
<PullList issues={recentComics} />
|
||||
<>
|
||||
<div className="content mt-6">
|
||||
<Header headerContent="Import Activity"
|
||||
subHeaderContent="Results aggregated from the last import"
|
||||
iconClassNames="fa-solid fa-file-invoice mr-2" />
|
||||
</div>
|
||||
|
||||
<table className="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th><abbr title="Position">Pos</abbr></th>
|
||||
<th>Team</th>
|
||||
<th><abbr title="Played">Pld</abbr></th>
|
||||
<th><abbr title="Won">W</abbr></th>
|
||||
<th><abbr title="Drawn">D</abbr></th>
|
||||
<th><abbr title="Lost">L</abbr></th>
|
||||
<th><abbr title="Goals for">GF</abbr></th>
|
||||
<th><abbr title="Goals against">GA</abbr></th>
|
||||
<th><abbr title="Goal difference">GD</abbr></th>
|
||||
<th><abbr title="Points">Pts</abbr></th>
|
||||
<th>Qualification or relegation</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>1</th>
|
||||
<td><a href="https://en.wikipedia.org/wiki/Leicester_City_F.C." title="Leicester City F.C.">Leicester City</a> <strong>(C)</strong>
|
||||
</td>
|
||||
<td>38</td>
|
||||
<td>23</td>
|
||||
<td>12</td>
|
||||
<td>3</td>
|
||||
<td>68</td>
|
||||
<td>36</td>
|
||||
<td>+32</td>
|
||||
<td>81</td>
|
||||
<td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</>
|
||||
|
||||
{/* Stats */}
|
||||
{!isEmpty(libraryStatistics) && (
|
||||
@@ -74,8 +117,8 @@ export const Dashboard = (): ReactElement => {
|
||||
<WantedComicsList comics={wantedComics} />
|
||||
)}
|
||||
{/* Recent imports */}
|
||||
<RecentlyImported comicBookCovers={recentComics} />
|
||||
|
||||
<RecentlyImported comicBookCovers={recentComics} />
|
||||
|
||||
{/* Volumes */}
|
||||
{!isEmpty(volumeGroups) && (
|
||||
<VolumeGroups volumeGroups={volumeGroups} />
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { isNil, map } from "lodash";
|
||||
import React, { createRef, ReactElement, useCallback, useEffect } from "react";
|
||||
import Card from "../Carda";
|
||||
import Header from "../Header";
|
||||
import Masonry from "react-masonry-css";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { getWeeklyPullList } from "../../actions/comicinfo.actions";
|
||||
@@ -88,12 +89,9 @@ export const PullList = ({ issues }: PullListProps): ReactElement => {
|
||||
return (
|
||||
<>
|
||||
<div className="content">
|
||||
<h4 className="title is-4">
|
||||
<i className="fa-solid fa-splotch"></i> Discover
|
||||
</h4>
|
||||
<p className="subtitle is-7">
|
||||
Pull List aggregated for the week from League Of Comic Geeks
|
||||
</p>
|
||||
<Header headerContent="Discover"
|
||||
subHeaderContent="Pull List aggregated for the week from League Of Comic Geeks"
|
||||
iconClassNames="fa-solid fa-splotch mr-2"/>
|
||||
<div className="field is-grouped">
|
||||
{/* select week */}
|
||||
<div className="control">
|
||||
|
||||
22
src/client/components/Header.tsx
Normal file
22
src/client/components/Header.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
import React, { ReactElement } from "react";
|
||||
|
||||
type IHeaderProps = {
|
||||
headerContent: string;
|
||||
subHeaderContent: string;
|
||||
iconClassNames: string;
|
||||
}
|
||||
|
||||
export const Header = (props: IHeaderProps): ReactElement => {
|
||||
|
||||
return (<>
|
||||
<h4 className="title is-4">
|
||||
<i className={props.iconClassNames}></i> {props.headerContent}
|
||||
</h4>
|
||||
<p className="subtitle is-7">
|
||||
{props.subHeaderContent}
|
||||
</p>
|
||||
</>)
|
||||
|
||||
}
|
||||
|
||||
export default Header;
|
||||
@@ -62,9 +62,11 @@ const initialState = {
|
||||
librarySearchError: {},
|
||||
libraryServiceStatus: {},
|
||||
};
|
||||
|
||||
function fileOpsReducer(state = initialState, action) {
|
||||
switch (action.type) {
|
||||
case "sessionId":
|
||||
console.log(action);
|
||||
break;
|
||||
case IMS_COMICBOOK_METADATA_FETCHED:
|
||||
return {
|
||||
...state,
|
||||
|
||||
@@ -8,7 +8,7 @@ import { reducers } from "../reducers/index";
|
||||
import { io } from "socket.io-client";
|
||||
import socketIoMiddleware from "redux-socket.io-middleware";
|
||||
import { SOCKET_BASE_URI } from "../constants/endpoints";
|
||||
const socketConnection = io(SOCKET_BASE_URI, { transports: ["websocket"] });
|
||||
const socketConnection = io(SOCKET_BASE_URI, { transports: ["websocket"], withCredentials: true, });
|
||||
|
||||
const { createReduxHistory, routerMiddleware, routerReducer } =
|
||||
createReduxHistoryContext({
|
||||
|
||||
18
yarn.lock
18
yarn.lock
@@ -3294,17 +3294,17 @@
|
||||
"@types/express" "^4.7.0"
|
||||
file-system-cache "^2.0.0"
|
||||
|
||||
"@tanstack/react-table@^8.5.11":
|
||||
version "8.5.11"
|
||||
resolved "https://registry.yarnpkg.com/@tanstack/react-table/-/react-table-8.5.11.tgz#544f551f15412087edfc2df01bed9697aab4651f"
|
||||
integrity sha512-bIegBJ3VPUX3Z7rMnFEnTRCRgPccTsciilQA1ib/pA6M7Qq1boTNPjNjSbEHmBKytaxPrPfcUfzkZLogYtvu3g==
|
||||
"@tanstack/react-table@^8.9.3":
|
||||
version "8.9.3"
|
||||
resolved "https://registry.yarnpkg.com/@tanstack/react-table/-/react-table-8.9.3.tgz#03a52e9e15f65c82a8c697a445c42bfca0c5cfc4"
|
||||
integrity sha512-Ng9rdm3JPoSCi6cVZvANsYnF+UoGVRxflMb270tVj0+LjeT/ZtZ9ckxF6oLPLcKesza6VKBqtdF9mQ+vaz24Aw==
|
||||
dependencies:
|
||||
"@tanstack/table-core" "8.5.11"
|
||||
"@tanstack/table-core" "8.9.3"
|
||||
|
||||
"@tanstack/table-core@8.5.11":
|
||||
version "8.5.11"
|
||||
resolved "https://registry.yarnpkg.com/@tanstack/table-core/-/table-core-8.5.11.tgz#a23178a097df4b0b64bdfa6f79e6d8933e97c7f7"
|
||||
integrity sha512-ZN61ockLaIAiiPbZfMKT2S03nbWx28OHg/nAiDnNfmN4QmAMcdwVajPn2QQwnNVGAr4jS4nbhbYzCcjq8livXQ==
|
||||
"@tanstack/table-core@8.9.3":
|
||||
version "8.9.3"
|
||||
resolved "https://registry.yarnpkg.com/@tanstack/table-core/-/table-core-8.9.3.tgz#991da6b015f6200fdc841c48048bee5e197f6a46"
|
||||
integrity sha512-NpHZBoHTfqyJk0m/s/+CSuAiwtebhYK90mDuf5eylTvgViNOujiaOaxNDxJkQQAsVvHWZftUGAx1EfO1rkKtLg==
|
||||
|
||||
"@testing-library/dom@^8.3.0":
|
||||
version "8.20.0"
|
||||
|
||||
Reference in New Issue
Block a user