🔧 Various fixes

src/client/components/AcquisitionPanel.tsx

@@ -110,8 +110,8 @@ export const AcquisitionPanel = (
         )}
       </div>
       {/* AirDC++ results */}
-      <div>
-        {!isNil(airDCPPSearchResults) && !isEmpty(airDCPPSearchResults) && (
+      <div className="columns">
+        {!isNil(airDCPPSearchResults) && !isEmpty(airDCPPSearchResults) ? (
           <table className="table is-striped">
             <thead>
               <tr>
@@ -182,6 +182,17 @@ export const AcquisitionPanel = (
               })}
             </tbody>
           </table>
+        ) : (
+          <div className="column is-three-fifths">
+            <article className="message is-info">
+              <div className="message-body is-size-6 is-family-secondary">
+                Searching via <strong>AirDC++</strong> is still in{" "}
+                <strong>alpha</strong>. Some searches may take arbitrarily long,
+                or may not work at all. Searches from <code>ADCS</code> hubs are more
+                reliable than <code>NMDCS</code> ones.
+              </div>
+            </article>
+          </div>
         )}
       </div>
     </>

src/client/components/Carda.tsx

@@ -32,7 +32,9 @@ const renderCard = (props): ReactElement => {
               </div>
               {props.hasDetails && (
                 <div className="card-content">
-                  {isNil(props.title) ? "No Name" : props.title}
+                  <div className="card-title is-size-6 is-family-secondary">
+                    {isNil(props.title) ? "No Name" : props.title}
+                  </div>
                   {props.children}
                 </div>
               )}

src/client/components/ComicDetail.tsx

@@ -16,6 +16,7 @@ import { isEmpty, isUndefined, isNil } from "lodash";
 import { RootState } from "threetwo-ui-typings";
 import { fetchComicVineMatches } from "../actions/fileops.actions";
 import { getComicBookDetailById } from "../actions/comicinfo.actions";
+import { detectTradePaperbacks } from "../shared/utils/tradepaperback.utils";
 import dayjs from "dayjs";
 const prettyBytes = require("pretty-bytes");
 
@@ -115,11 +116,17 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
                   </span>
                 </dd>
                 <dd>
-                  Total issues in this volume:{" "}
+                  Total issues in this volume:
                   {
                     comicBookDetailData.sourcedMetadata.comicvine
                       .volumeInformation.count_of_issues
                   }
+                  {JSON.stringify(
+                    detectTradePaperbacks(
+                      comicBookDetailData.sourcedMetadata.comicvine
+                        .volumeInformation.description,
+                    ),
+                  )}
                 </dd>
               </dl>
             </div>
@@ -274,6 +281,9 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
     }),
   };
 
+  // Determine which cover image to use:
+  // 1. from the locally imported, non-CV-scraped version, or
+  // 2. from the CV-scraped version
   let imagePath = "";
   let comicBookTitle = "";
   if (!isNil(comicBookDetailData.rawFileDetails)) {

src/client/components/RecentlyImported.tsx

@@ -39,7 +39,16 @@ export const RecentlyImported = ({
           imageUrl={imagePath}
           hasDetails
           title={comicName ? titleElement : null}
-        ></Card>
+        >
+          {!isNil(sourcedMetadata.comicvine) && (
+            <div className="content is-flex is-flex-direction-row">
+              <span className="icon cv-icon is-small">
+                <img src="/dist/img/cvlogo.svg" />
+              </span>
+              <i className="fas fa-paper-plane is-small has-text-warning has-text-light"></i>
+            </div>
+          )}
+        </Card>
       );
     })}
   </section>