diff --git a/package.json b/package.json
index cfe1aa2..e9a2a32 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,6 @@
     "axios-simple-cache-adapter": "^1.1.0",
     "babel-polyfill": "^6.26.0",
     "better-docs": "^2.3.2",
-    "calibre-opds": "^1.0.7",
     "comlink-loader": "^2.0.0",
     "compromise": "^13.11.3",
     "compromise-dates": "^2.2.1",
@@ -51,11 +50,11 @@
     "jsdoc": "^3.6.7",
     "opds-extra": "^3.0.9",
     "pretty-bytes": "^5.6.0",
-    "react": "^18.0.0",
+    "react": "^18.1.0",
     "react-collapsible": "^2.8.3",
     "react-comic-viewer": "^0.3.5",
     "react-datepicker": "^4.5.0",
-    "react-dom": "^18.0.0",
+    "react-dom": "^18.1.0",
     "react-fast-compare": "^3.2.0",
     "react-final-form": "^6.5.3",
     "react-final-form-arrays": "^3.1.3",
@@ -68,7 +67,7 @@
     "react-redux": "^7.2.6",
     "react-router": "^6.2.2",
     "react-router-dom": "^6.2.2",
-    "react-select": "^5.2.1",
+    "react-select": "^5.3.2",
     "react-select-async-paginate": "^0.6.1",
     "react-slick": "^0.28.1",
     "react-sliding-pane": "^7.0.0",
@@ -88,7 +87,6 @@
     "voca": "^1.4.0",
     "websocket": "^1.0.34",
     "ws": "^7.5.3",
-    "ws-calibre": "https://github.com/bluelovers/ws-calibre",
     "xml2js": "^0.4.23",
     "xregexp": "^5.0.2"
   },
diff --git a/src/client/components/Navbar.tsx b/src/client/components/Navbar.tsx
index 353abc5..4d4a389 100644
--- a/src/client/components/Navbar.tsx
+++ b/src/client/components/Navbar.tsx
@@ -1,7 +1,44 @@
-import React from "react";
+import React, { ReactElement } from "react";
 import { Link } from "react-router-dom";
+import Select, {
+  components,
+  DropdownIndicatorProps,
+  IndicatorSeparatorProps,
+} from "react-select";
 
 const Navbar: React.FunctionComponent = (props) => {
+  const DropdownIndicator = (
+    props: DropdownIndicatorProps<ColourOption, true>,
+  ) => {
+    return (
+      <components.DropdownIndicator {...props}>
+        <></>
+      </components.DropdownIndicator>
+    );
+  };
+
+  const IndicatorSeparator = ({
+    innerProps,
+  }: IndicatorSeparatorProps<ColourOption, true>) => {
+    return <></>;
+  };
+
+  const searchPlaceholder = (): ReactElement => (
+    <>
+      Search Library... <i className="fa-solid fa-magnifying-glass is-pulled-right mt-1"></i>
+    </>
+  );
+
+  const customStyles = {
+    control: () => ({
+      width: 250,
+      marginTop: 0,
+      border: "1px solid #CCC",
+      height: 40,
+      borderRadius: 8,
+    }),
+  };
+
   return (
     <nav className="navbar is-fixed-top">
       <div className="navbar-brand">
@@ -51,8 +88,24 @@ const Navbar: React.FunctionComponent = (props) => {
             Downloads
           </Link>
 
+          <Select
+            className="basic-single mt-2"
+            classNamePrefix="select"
+            styles={customStyles}
+            components={{ DropdownIndicator, IndicatorSeparator }}
+            placeholder={searchPlaceholder()}
+            // defaultValue={colourOptions[0]}
+            // isDisabled={isDisabled}
+            // isLoading={isLoading}
+            isClearable={true}
+            // isRtl={isRtl}
+            // isSearchable={isSearchable}
+            name="color"
+            // options={colourOptions}
+          />
+
           <Link to="/search" className="navbar-item">
-            Search
+            Search ComicVine
           </Link>
           <div className="navbar-item has-dropdown is-hoverable">
             <a
diff --git a/yarn.lock b/yarn.lock
index 7132567..fa340b2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1142,7 +1142,7 @@
     "@emotion/weak-memoize" "^0.2.5"
     hoist-non-react-statics "^3.3.1"
 
-"@emotion/react@^11.1.1":
+"@emotion/react@^11.8.1":
   version "11.9.0"
   resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.9.0.tgz#b6d42b1db3bd7511e7a7c4151dc8bc82e14593b8"
   integrity sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==
@@ -3667,17 +3667,6 @@ cacheable-request@^2.1.1:
     normalize-url "2.0.1"
     responselike "1.0.2"
 
-calibre-opds@^1.0.7:
-  version "1.0.8"
-  resolved "https://registry.yarnpkg.com/calibre-opds/-/calibre-opds-1.0.8.tgz#6a341cf973abd3d36b406cda97a159575a59fe29"
-  integrity sha512-WvgHzB9obvTPweDJcAjLUAKJDlJf6qMKuEfz5GLVeFBWIBleMxYRdwJLiKyemjymoZwTZdJEIIkh96Bk1CWxqw==
-  dependencies:
-    bluebird "^3.7.2"
-    opds-extra "^3.0.9"
-    ta-json-x "^2.5.3"
-    ts-type "^1.2.36"
-    tslib "^2.3.0"
-
 call-bind@^1.0.0, call-bind@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
@@ -10828,13 +10817,13 @@ react-docgen@^5.4.0:
     node-dir "^0.1.10"
     strip-indent "^3.0.0"
 
-react-dom@^18.0.0:
-  version "18.0.0"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.0.0.tgz#26b88534f8f1dbb80853e1eabe752f24100d8023"
-  integrity sha512-XqX7uzmFo0pUceWFCt7Gff6IyIMzFUn7QMZrbrQfGxtaxXZIcGQzoNpRLE3fQLnS4XzLLPMZX2T9TRcSrasicw==
+react-dom@^18.1.0:
+  version "18.1.0"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.1.0.tgz#7f6dd84b706408adde05e1df575b3a024d7e8a2f"
+  integrity sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==
   dependencies:
     loose-envify "^1.1.0"
-    scheduler "^0.21.0"
+    scheduler "^0.22.0"
 
 react-fast-compare@^3.0.1, react-fast-compare@^3.2.0:
   version "3.2.0"
@@ -11013,14 +11002,14 @@ react-select-async-paginate@^0.6.1:
     react-is-mounted-hook "^1.1.2"
     sleep-promise "^9.1.0"
 
-react-select@^5.2.1:
-  version "5.3.0"
-  resolved "https://registry.yarnpkg.com/react-select/-/react-select-5.3.0.tgz#dc77c1f95e1037ec4cb01c5e5d6272d80be8d3f6"
-  integrity sha512-GM6Fbv1+X+kb3e5Fc4oNeyOJkCIesY/D4NBiReKlGY4RxoeztFYm3J0KREgwMaIKQqwTiuLqTlpUBY3SYw5goQ==
+react-select@^5.3.2:
+  version "5.3.2"
+  resolved "https://registry.yarnpkg.com/react-select/-/react-select-5.3.2.tgz#ecee0d5c59ed4acb7f567f7de3c75a488d93dacb"
+  integrity sha512-W6Irh7U6Ha7p5uQQ2ZnemoCQ8mcfgOtHfw3wuMzG6FAu0P+CYicgofSLOq97BhjMx8jS+h+wwWdCBeVVZ9VqlQ==
   dependencies:
     "@babel/runtime" "^7.12.0"
     "@emotion/cache" "^11.4.0"
-    "@emotion/react" "^11.1.1"
+    "@emotion/react" "^11.8.1"
     "@types/react-transition-group" "^4.4.0"
     memoize-one "^5.0.0"
     prop-types "^15.6.0"
@@ -11102,10 +11091,10 @@ react-window@^1.8.5:
     "@babel/runtime" "^7.0.0"
     memoize-one ">=3.1.1 <6"
 
-react@^18.0.0:
-  version "18.0.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-18.0.0.tgz#b468736d1f4a5891f38585ba8e8fb29f91c3cb96"
-  integrity sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==
+react@^18.1.0:
+  version "18.1.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-18.1.0.tgz#6f8620382decb17fdc5cc223a115e2adbf104890"
+  integrity sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==
   dependencies:
     loose-envify "^1.1.0"
 
@@ -11665,10 +11654,10 @@ saxes@^5.0.1:
   dependencies:
     xmlchars "^2.2.0"
 
-scheduler@^0.21.0:
-  version "0.21.0"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.21.0.tgz#6fd2532ff5a6d877b6edb12f00d8ab7e8f308820"
-  integrity sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==
+scheduler@^0.22.0:
+  version "0.22.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.22.0.tgz#83a5d63594edf074add9a7198b1bae76c3db01b8"
+  integrity sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==
   dependencies:
     loose-envify "^1.1.0"
 
@@ -12944,14 +12933,6 @@ ts-map@^1.0.3:
   resolved "https://registry.yarnpkg.com/ts-map/-/ts-map-1.0.3.tgz#1c4d218dec813d2103b7e04e4bcf348e1471c1ff"
   integrity sha512-vDWbsl26LIcPGmDpoVzjEP6+hvHZkBkLW7JpvwbCv/5IYPJlsbzCVXY3wsCeAxAUeTclNOUZxnLdGh3VBD/J6w==
 
-ts-type@^1.2.36:
-  version "1.2.40"
-  resolved "https://registry.yarnpkg.com/ts-type/-/ts-type-1.2.40.tgz#db3ceb95281567fe72591b9a904488e85c5b74fe"
-  integrity sha512-Ux5e7Frys5pX7w8gYchEd0KfhG1H5puXOQC8yOBgMJ1aEwDSypeHLwxIUpKjecni1IGwtLI3JrxCVZaQO9JKmw==
-  dependencies:
-    tslib "^2.3.0"
-    typedarray-dts "^1.0.0"
-
 tsconfig-paths@^3.14.1:
   version "3.14.1"
   resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz#ba0734599e8ea36c862798e920bcf163277b137a"
@@ -13084,11 +13065,6 @@ type@^2.5.0:
   resolved "https://registry.yarnpkg.com/type/-/type-2.6.0.tgz#3ca6099af5981d36ca86b78442973694278a219f"
   integrity sha512-eiDBDOmkih5pMbo9OqsqPRGMljLodLcwd5XD5JbtNB0o89xZAwynY9EdCDsJU7LtcVCClu9DvM7/0Ep1hYX3EQ==
 
-typedarray-dts@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/typedarray-dts/-/typedarray-dts-1.0.0.tgz#9dec9811386dbfba964c295c2606cf9a6b982d06"
-  integrity sha512-Ka0DBegjuV9IPYFT1h0Qqk5U4pccebNIJCGl8C5uU7xtOs+jpJvKGAY4fHGK25hTmXZOEUl9Cnsg5cS6K/b5DA==
-
 typedarray-to-buffer@^3.1.5:
   version "3.1.5"
   resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080"
@@ -13854,10 +13830,6 @@ write-file-atomic@^3.0.0, write-file-atomic@^3.0.3:
     signal-exit "^3.0.2"
     typedarray-to-buffer "^3.1.5"
 
-"ws-calibre@https://github.com/bluelovers/ws-calibre":
-  version "1.0.0"
-  resolved "https://github.com/bluelovers/ws-calibre#5e8e4355f9feed5e9642730d2ce06322d8dda6ae"
-
 ws@^7.3.1, ws@^7.4.6, ws@^7.5.3:
   version "7.5.7"
   resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.7.tgz#9e0ac77ee50af70d58326ecff7e85eb3fa375e67"