📆 Added timestamp for last CV scrape application

package.json

@@ -35,6 +35,7 @@
     "better-docs": "^2.3.2",
     "calibre-opds": "^1.0.7",
     "comlink-loader": "^2.0.0",
+    "dayjs": "^1.10.6",
     "ellipsize": "^0.1.0",
     "event-stream": "^4.0.1",
     "express": "^4.17.1",

src/client/components/ComicDetail.tsx

@@ -1,6 +1,5 @@
 import React, { useState, useEffect, useCallback, ReactElement } from "react";
 import { useParams } from "react-router-dom";
-import axios from "axios";
 import Card from "./Card";
 import MatchResult from "./MatchResult";
 import ComicVineSearchForm from "./ComicVineSearchForm";
@@ -12,12 +11,22 @@ import { IExtractedComicBookCoverFile, RootState } from "threetwo-ui-typings";
 import { fetchComicVineMatches } from "../actions/fileops.actions";
 import { getComicBookDetailById } from "../actions/comicinfo.actions";
 import { Drawer, Divider } from "antd";
+import * as dayjs from "dayjs";
 const prettyBytes = require("pretty-bytes");
 import "antd/dist/antd.css";
 
 import { useDispatch, useSelector } from "react-redux";
 
 type ComicDetailProps = {};
+/**
+ * Component for displaying the metadata for a comic in greater detail.
+ *
+ * @component
+ * @example
+ * return (
+ *   <ComicDetail/>
+ * )
+ */
 
 export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
   const [page, setPage] = useState(1);
@@ -69,7 +78,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
                 <div className="content comic-detail">
                   <dl>
                     <dt>
-                      <h6> Raw File Details</h6>
+                    Raw File Details
                     </dt>
                     <dd>{comicBookDetailData.rawFileDetails.containedIn}</dd>
                     <dd>
@@ -87,9 +96,13 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
                   <div className="content comic-detail">
                     <Divider />
                     <dl>
-                      <dt>
-                        <h6>ComicVine Metadata</h6>
-                      </dt>
+                      <dt>ComicVine Metadata</dt>
+                      <dd className="is-size-7">
+                        Last scraped on{" "}
+                        {dayjs(comicBookDetailData.updatedAt).format(
+                          "MMM D YYYY [at] h:mm a",
+                        )}
+                      </dd>
                       <dd>
                         <h6>
                           {comicBookDetailData.sourcedMetadata.comicvine.name}

src/client/components/Navbar.tsx

@@ -50,6 +50,9 @@ const Navbar: React.FunctionComponent = (props) => {
           <Link to="/library" className="navbar-item">
             Library
           </Link>
+          <Link to="/library" className="navbar-item">
+            Search
+          </Link>
           <div className="navbar-item has-dropdown is-hoverable">
             <a
               className="navbar-link  is-active"

yarn.lock

@@ -4438,7 +4438,7 @@ dateformat@^4.5.1:
   resolved "https://registry.yarnpkg.com/dateformat/-/dateformat-4.5.1.tgz#c20e7a9ca77d147906b6dc2261a8be0a5bd2173c"
   integrity sha512-OD0TZ+B7yP7ZgpJf5K2DIbj3FZvFvxgFUuaqA/V5zTjAtAAXZ1E8bktHxmAGs4x5b7PflqA9LeQ84Og7wYtF7Q==
 
-dayjs@1.x:
+dayjs@1.x, dayjs@^1.10.6:
   version "1.10.6"
   resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.10.6.tgz#288b2aa82f2d8418a6c9d4df5898c0737ad02a63"
   integrity sha512-AztC/IOW4L1Q41A86phW5Thhcrco3xuAA+YX/BLpLWWjRcTj5TOt/QImBLmCKlrF7u7k47arTnOyL6GnbG8Hvw==