diff --git a/package.json b/package.json index 68416d0..3da6cdb 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,8 @@ "react-hooks-worker": "^1.0.0", "react-window-dynamic-list": "^2.3.5", "sharp": "^0.28.1", - "socket.io-client": "^4.1.2" + "socket.io-client": "^4.1.2", + "threetwo-ui-typings": "^1.0.1-0" }, "devDependencies": { "@babel/cli": "^7.13.10", diff --git a/src/client/actions/fileops.actions.tsx b/src/client/actions/fileops.actions.tsx index 0056c18..30e8adc 100644 --- a/src/client/actions/fileops.actions.tsx +++ b/src/client/actions/fileops.actions.tsx @@ -1,8 +1,5 @@ import axios from "axios"; -import { - IFolderData, - IExtractedComicBookCoverFile, -} from "../../server/interfaces/folder.interface"; +import { IFolderData, IExtractedComicBookCoverFile } from "threetwo-ui-typings"; import { API_BASE_URI, SOCKET_BASE_URI } from "../constants/endpoints"; import { io } from "socket.io-client"; import { diff --git a/src/client/assets/scss/App.css b/src/client/assets/scss/App.css index 81a5d43..ca27333 100644 --- a/src/client/assets/scss/App.css +++ b/src/client/assets/scss/App.css @@ -16316,50 +16316,23 @@ readers do not read off random characters that represent icons */ white-space: pre-wrap; } +.card-container { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); + column-gap: 0.5em; + row-gap: 1.2em; +} .card-container .card { max-width: 200px; - margin: 0 0 15px 0; } -.card-container .card .is-horizontal { - flex-direction: row; - display: flex; - flex-basis: 50ex; - flex-grow: 0; - flex-shrink: 1; - box-shadow: none; -} -.card-container .card .is-horizontal .card-image { - align-self: center; -} -.card-container .card .is-horizontal .card-image .image { - max-width: 60px; -} -.card-container .card .is-horizontal .card-image .image img { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-top-left-radius: 0.25em; - border-bottom-left-radius: 0.25em; -} -.card-container .card .is-horizontal .card-content { - align-self: center; - flex: 1; - padding-left: 1em; - padding-top: 0; - padding-bottom: 0; - font-size: 0.8em; -} -.card-container .card .is-horizontal .card-content ul li.status { - margin-top: 10px; -} -.card-container .card .is-horizontal .card-content .truncate { - width: 400px; +.card-container .card .truncate { + width: 100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } -.card-container .card .is-horizontal .is-divider { - margin-top: 1.5rem; - margin-bottom: 1rem; +.card-container .card img { + max-width: 200px; } .search-results-container { diff --git a/src/client/assets/scss/App.scss b/src/client/assets/scss/App.scss index fd9872e..f0ae347 100644 --- a/src/client/assets/scss/App.scss +++ b/src/client/assets/scss/App.scss @@ -39,25 +39,27 @@ $border-color: red; white-space: pre-wrap; } } + +.card { + max-width: 200px; + + .truncate { + width: 100px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + img { + max-width: 200px; + } +} .card-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); column-gap: 0.5em; row-gap: 1.2em; - .card { - max-width: 200px; - .truncate { - width: 100px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - - img { - max-width: 200px; - } - } .card { max-width: 200px; margin: 0 0 15px 0; diff --git a/src/client/components/Card.tsx b/src/client/components/Card.tsx index cef84ef..72b94cd 100644 --- a/src/client/components/Card.tsx +++ b/src/client/components/Card.tsx @@ -1,5 +1,5 @@ import * as React from "react"; -import { IExtractedComicBookCoverFile } from "../../server/interfaces/folder.interface"; +import { IExtractedComicBookCoverFile } from "threetwo-ui-typings"; import { removeLeadingPeriod } from "../shared/utils/formatting.utils"; import { isUndefined, isEmpty } from "lodash"; import { Link } from "react-router-dom"; diff --git a/src/client/components/Dashboard.tsx b/src/client/components/Dashboard.tsx index 55abe53..3ac8292 100644 --- a/src/client/components/Dashboard.tsx +++ b/src/client/components/Dashboard.tsx @@ -3,6 +3,7 @@ import { connect } from "react-redux"; import ZeroState from "./ZeroState"; import { RecentlyImported } from "./RecentlyImported"; import { getRecentlyImportedComicBooks } from "../actions/fileops.actions"; +import { isEmpty, isUndefined } from "lodash"; interface IProps { getRecentComics: Function; diff --git a/src/client/components/Import.tsx b/src/client/components/Import.tsx index 05c899c..c31e493 100644 --- a/src/client/components/Import.tsx +++ b/src/client/components/Import.tsx @@ -2,7 +2,7 @@ import * as React from "react"; import { isUndefined } from "lodash"; import { connect } from "react-redux"; import { fetchComicBookMetadata } from "../actions/fileops.actions"; -import { IFolderData } from "../shared/interfaces/comicinfo.interfaces"; +import { IFolderData } from "threetwo-ui-typings"; import { io, Socket } from "socket.io-client"; import { SOCKET_BASE_URI } from "../constants/endpoints"; import DynamicList, { createCache } from "react-window-dynamic-list"; @@ -34,6 +34,15 @@ class Import extends React.Component { }); } + /** + * This initializes a socket.io connection instance with supplied configuration + * + * @return {void} A good string + * + * @example + * + * initiateSocketConnection() + */ public initiateSocketConnection = () => { if (typeof this.props.path !== "undefined") { socket = io(SOCKET_BASE_URI, { @@ -121,7 +130,6 @@ class Import extends React.Component { {!isUndefined(this.state.folderWalkResults) ? (
- {/* */} ; -} - -export interface IComicVineSearchMatch { - description: string; - id: number; - volumes: string; -} -export interface IFolderData { - name: string; - extension: string; - containedIn: string; - isFile: boolean; - isLink: boolean; -} diff --git a/src/client/shared/utils/query.transformer.ts b/src/client/shared/utils/query.transformer.ts index be60bdf..1026180 100644 --- a/src/client/shared/utils/query.transformer.ts +++ b/src/client/shared/utils/query.transformer.ts @@ -25,11 +25,8 @@ SOFTWARE. */ import _ from "lodash"; -import { IFolderData } from "../interfaces/comicinfo.interfaces"; +import { IFolderData } from "threetwo-ui-typings"; import stringSimilarity from "string-similarity"; import { logger } from "../utils/log.utils"; - -export const autoMatcher = (query, matches) => { - -} +export const autoMatcher = (query, matches) => {}; diff --git a/src/server/interfaces/folder.interface.ts b/src/server/interfaces/folder.interface.ts deleted file mode 100644 index 626c391..0000000 --- a/src/server/interfaces/folder.interface.ts +++ /dev/null @@ -1,57 +0,0 @@ -export interface IFolderResponse { - data: Array; -} - -export interface IExtractionOptions { - extractTarget: string; - sourceFolder: string; - targetExtractionFolder: string; - paginationOptions: IPaginationOptions; - extractionMode: string; -} - -export interface IPaginationOptions { - pageLimit: number; - page: number; -} -export interface IComicVineSearchMatch { - description: string; - id: number; - volumes: string; -} -export interface IFolderData { - name: string; - extension: string; - containedIn: string; - isFile: boolean; - isLink: boolean; -} - -export interface IExplodedPathResponse { - exploded: Array; - fileName: string; -} - -export interface IComicBookCoverMetadata { - name: string; - path: string; - containedIn: string; - fileSize: string; - imageHash: string; - dimensions: { - width: string; - height: string; - }; -} - -export interface IExtractedComicBookCoverFile { - name: string; - path: string; - fileSize: number; -} - -export interface IExtractComicBookCoverErrorResponse { - message: string; - errorCode: string; - data: string; -} diff --git a/src/server/route/routes/importComics.routes.ts b/src/server/route/routes/importComics.routes.ts deleted file mode 100644 index 69d8dc0..0000000 --- a/src/server/route/routes/importComics.routes.ts +++ /dev/null @@ -1,5 +0,0 @@ -import router from "../router"; -import { Request, Response } from "express"; -import axios from "axios"; - -export default router; diff --git a/yarn.lock b/yarn.lock index 2d4b6a6..e79dd67 100644 --- a/yarn.lock +++ b/yarn.lock @@ -11901,6 +11901,13 @@ text-table@^0.2.0, text-table@~0.2.0: resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ= +threetwo-ui-typings@^1.0.1-0: + version "1.0.1-0" + resolved "https://registry.yarnpkg.com/threetwo-ui-typings/-/threetwo-ui-typings-1.0.1-0.tgz#7bd3e8703c43458bb0e42dd2bd34b518043d34e7" + integrity sha512-APGV7WTDYsWl+XPNlP6jKIJcd7qNbRDfsmyExKIczrSIka52OU9I7uv+snC5RLEEH6bPjNHSGK5DuCgwTIWn4A== + dependencies: + typescript "^4.3.2" + throat@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/throat/-/throat-5.0.0.tgz#c5199235803aad18754a667d659b5e72ce16764b" @@ -12200,7 +12207,7 @@ typedarray-to-buffer@^3.1.5: dependencies: is-typedarray "^1.0.0" -typescript@^4.2.3: +typescript@^4.2.3, typescript@^4.3.2: version "4.3.2" resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.3.2.tgz#399ab18aac45802d6f2498de5054fcbbe716a805" integrity sha512-zZ4hShnmnoVnAHpVHWpTcxdv7dWP60S2FsydQLV8V5PbS3FifjWFFRiHSWpDJahly88PRyV5teTSLoq4eG7mKw==