From 71bad167ab30d045c6587e5742fafe11ef2d0a26 Mon Sep 17 00:00:00 2001
From: Rishi Ghan <rishi.ghan@gmail.com>
Date: Thu, 29 Dec 2022 15:55:33 -0800
Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=94=A7=20Library=20zero=20state=20(#5?=
 =?UTF-8?q?2)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 🔧 Refactoring uncompression methods on client-side

* ✏️ Refactoring

* 👁️ Updates to the comic viewer

* 🖼️ Added screenshots from December 2022

* ✏️ Fixed typo in README

* 🏗️ Massive refactor around archive uncompression for reading/analysis

* 🔧 Tweaked state vars for reading and analysis

* 🏗️ Refactor to support DC++ and socket.io integration

This refactor covers the following workflows:

1. Adding a comic from LOCG or ComicVine adds it to the wanted list
2. Downloading that comic from DC++ correctly adds download metadata to the corresponding comic object in mongo
3. Successful download triggers automatic import to library and cover extraction, metadata application

From ddef87ea293cd0a702f2863cb866dc96a4c215c9 Mon Sep 17 00:00:00 2001
From: Rishi Ghan <rishi.ghan@gmail.com>
Date: Fri, 30 Dec 2022 22:39:38 -0800
Subject: [PATCH 2/2] AirDC++ Connection Status  (#53)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 🔧 Fixed empty library state with explanation

* ⚡️ Added a status indicator for the AirDC++ socket connection
---
 .../components/Dashboard/RecentlyImported.tsx |  2 --
 src/client/components/Library/Library.tsx     | 23 ++++++++++++++++---
 src/client/components/Navbar.tsx              |  8 +++++++
 src/client/context/AirDCPPSocket.tsx          |  5 ++--
 4 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/src/client/components/Dashboard/RecentlyImported.tsx b/src/client/components/Dashboard/RecentlyImported.tsx
index 8b64b50..8516b14 100644
--- a/src/client/components/Dashboard/RecentlyImported.tsx
+++ b/src/client/components/Dashboard/RecentlyImported.tsx
@@ -51,7 +51,6 @@ export const RecentlyImported = ({
             },
             idx,
           ) => {
-            console.log(comicvine);
             const { issueName, url } = determineCoverFile({
               rawFileDetails,
               comicvine,
@@ -63,7 +62,6 @@ export const RecentlyImported = ({
               comicInfo,
               locg,
             });
-            console.log(name);
             const isComicBookMetadataAvailable =
               !isUndefined(comicvine) &&
               !isUndefined(comicvine.volumeInformation);
diff --git a/src/client/components/Library/Library.tsx b/src/client/components/Library/Library.tsx
index 107023f..0366e80 100644
--- a/src/client/components/Library/Library.tsx
+++ b/src/client/components/Library/Library.tsx
@@ -208,14 +208,13 @@ export const Library = (): ReactElement => {
   // ImportStatus.propTypes = {
   //   value: PropTypes.bool.isRequired,
   // };
-
   return (
     <section className="container">
       <div className="section">
         <div className="header-area">
           <h1 className="title">Library</h1>
         </div>
-        {!isUndefined(searchResults.hits) && (
+        {!isEmpty(searchResults) ? (
           <div>
             <div className="library">
               <T2Table
@@ -230,7 +229,25 @@ export const Library = (): ReactElement => {
               />
             </div>
           </div>
-        )}
+        ): <div className="columns">
+          <div className="column is-two-thirds">
+            <article className="message is-link">
+              <div className="message-body">
+                No comics were found in the library, Elasticsearch reports no
+                indices. Try importing a few comics into the library and come
+                back.
+              </div>
+            </article>
+            <pre>
+              {!isUndefined(searchError.data) &&
+                JSON.stringify(
+                  searchError.data.meta.body.error.root_cause,
+                  null,
+                  4,
+                )}
+            </pre>
+          </div>
+        </div> }
       </div>
     </section>
   );
diff --git a/src/client/components/Navbar.tsx b/src/client/components/Navbar.tsx
index c7c6999..db66d98 100644
--- a/src/client/components/Navbar.tsx
+++ b/src/client/components/Navbar.tsx
@@ -84,6 +84,14 @@ const Navbar: React.FunctionComponent = (props) => {
               </div>
             ) : null}
           </div>
+          {/* AirDC++ socket connection status */}
+          <div className="navbar-item has-dropdown is-hoverable">
+            <a className="navbar-link is-arrowless">
+              <i className="fa-solid fa-bolt"></i>
+            </a>
+          </div>
+          
+          
           <div className="navbar-item has-dropdown is-hoverable is-mega">
             <div className="navbar-link flex">Blog</div>
             <div id="blogDropdown" className="navbar-dropdown">
diff --git a/src/client/context/AirDCPPSocket.tsx b/src/client/context/AirDCPPSocket.tsx
index d7fbe9f..a0f30e4 100644
--- a/src/client/context/AirDCPPSocket.tsx
+++ b/src/client/context/AirDCPPSocket.tsx
@@ -12,7 +12,7 @@ const AirDCPPSocketContextProvider = ({ children }) => {
       airDCPPState: {
         settings: settingsObject,
         socket: {},
-        socketConnectionInformation: {},
+        socketConectionInformation: {},
       },
     });
   };
@@ -55,7 +55,6 @@ const AirDCPPSocketContextProvider = ({ children }) => {
       protocol: `${host.protocol}`,
       hostname: `${host.hostname}:${host.port}`,
     });
-
     const socketConnectionInformation = await initializedAirDCPPSocket.connect(
       `${host.username}`,
       `${host.password}`,
@@ -80,7 +79,7 @@ const AirDCPPSocketContextProvider = ({ children }) => {
 };
 const AirDCPPSocketContext = createContext({
   airDCPPState: {},
-  saveSettings: () => {},
+  saveSettings: () => { },
 });
 
 export { AirDCPPSocketContext, AirDCPPSocketContextProvider };