🕵🏼‍♀️ TPB, Mini-series, GN detection WIP

src/client/components/ComicDetail.tsx

@@ -19,7 +19,7 @@ import {
   getComicBookDetailById,
   extractComicArchive,
 } from "../actions/comicinfo.actions";
-import { detectTradePaperbacks } from "../shared/utils/tradepaperback.utils";
+import { detectIssueTypes } from "../shared/utils/tradepaperback.utils";
 import dayjs from "dayjs";
 const prettyBytes = require("pretty-bytes");
 import { DnD } from "./DnD";
@@ -398,8 +398,8 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
         <dd>{props.data.number}</dd>
         <dd>
           <div className="field is-grouped is-grouped-multiline">
-            {!isEmpty(
-              detectTradePaperbacks(
+            {!isUndefined(
+              detectIssueTypes(
                 comicBookDetailData.sourcedMetadata.comicvine.volumeInformation
                   .description,
               ),
@@ -407,7 +407,14 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
               <div className="control">
                 <div className="tags has-addons">
                   <span className="tag is-light">Detected Type</span>
-                  <span className="tag is-warning">Trade Paperback</span>
+                  <span className="tag is-warning">
+                    {
+                      detectIssueTypes(
+                        comicBookDetailData.sourcedMetadata.comicvine
+                          .volumeInformation.description,
+                      ).displayName
+                    }
+                  </span>
                 </div>
               </div>
             ) : (

src/client/components/LibraryGrid.tsx

@@ -13,7 +13,7 @@ import { getComicBooks } from "../actions/fileops.actions";
 import { isNil, isEmpty } from "lodash";
 import Masonry from "react-masonry-css";
 import Card from "./Carda";
-import { detectTradePaperbacks } from "../shared/utils/tradepaperback.utils";
+import { detectIssueTypes } from "../shared/utils/tradepaperback.utils";
 import { Link } from "react-router-dom";
 
 interface ILibraryGridProps {}
@@ -81,7 +81,7 @@ export const LibraryGrid = (libraryGridProps: ILibraryGridProps) => {
                   )}
                   {!isNil(sourcedMetadata.comicvine) &&
                   !isEmpty(
-                    detectTradePaperbacks(
+                    detectIssueTypes(
                       sourcedMetadata.comicvine.volumeInformation.description,
                     ),
                   ) ? (

src/client/components/RecentlyImported.tsx

@@ -6,8 +6,8 @@ import {
   removeLeadingPeriod,
   escapePoundSymbol,
 } from "../shared/utils/formatting.utils";
-import { isEmpty, isNil, map } from "lodash";
-import { detectTradePaperbacks } from "../shared/utils/tradepaperback.utils";
+import { isNil, isUndefined, map } from "lodash";
+import { detectIssueTypes } from "../shared/utils/tradepaperback.utils";
 import Masonry from "react-masonry-css";
 
 type RecentlyImportedProps = {
@@ -71,13 +71,20 @@ export const RecentlyImported = ({
                       <i className="fas fa-adjust" />
                     </span>
                   )}
-                  {!isNil(sourcedMetadata.comicvine) &&
-                  !isEmpty(
-                    detectTradePaperbacks(
+                  {!isUndefined(sourcedMetadata.comicvine) &&
+                  !isNil(
+                    detectIssueTypes(
                       sourcedMetadata.comicvine.volumeInformation.description,
                     ),
                   ) ? (
-                    <span className="tag is-warning">TPB</span>
+                    <span className="tag is-warning">
+                      {
+                        detectIssueTypes(
+                          sourcedMetadata.comicvine.volumeInformation
+                            .description,
+                        ).displayName
+                      }
+                    </span>
                   ) : null}
                 </div>
               </Card>

src/client/shared/utils/tradepaperback.utils.ts

@@ -1,13 +1,29 @@
-import { compact } from "lodash";
+import { flatten, compact, map, isEmpty } from "lodash";
 
-export const detectTradePaperbacks = (deck): any => {
-  const paperback = [
-    /((trade)?\s?(paperback)|(tpb))/gim, // https://regex101.com/r/FhuowT/1
-    /(hard\s?cover)\s?(collect((ion)|(ed)|(ing)))/gim, //https://regex101.com/r/eFJVRM/1
+export const detectIssueTypes = (deck: string): any => {
+  const issueTypeMatchers = [
+    {
+      regex: [
+        /((trade)?\s?(paperback)|(tpb))/gim, // https://regex101.com/r/FhuowT/1
+        /(hard\s?cover)\s?(collect((ion)|(ed)|(ing)))/gim, //https://regex101.com/r/eFJVRM/1
+      ],
+      displayName: "Trade Paperback",
+    },
+    { regex: [/mini\Wseries/gim], displayName: "Mini-Series" },
   ];
-  const miniSeries = [/mini\Wseries/gim];
 
-  const matches = paperback
+  const matches = map(issueTypeMatchers, (matcher) => {
+    return getIssueTypeDisplayName(deck, matcher.regex, matcher.displayName);
+  });
+  return compact(matches)[0];
+};
+
+const getIssueTypeDisplayName = (
+  deck: string,
+  regexPattern: RegExp[],
+  displayName: string,
+) => {
+  const matches = [...regexPattern]
     .map((regex) => {
       return deck.match(regex);
     })
@@ -16,6 +32,8 @@ export const detectTradePaperbacks = (deck): any => {
         return item;
       }
     });
-  // console.log(compact(matches));
-  return compact(matches);
+  const results = flatten(compact(matches));
+  if (!isEmpty(results)) {
+    return { displayName, results };
+  }
 };