From e9b4f44fd6e9b95a373e9c0c199f9e0313809b0b Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Thu, 22 Dec 2022 01:07:27 -0800
Subject: [PATCH] Update searching

---
 components/CharacterResult/index.scss | 2 +-
 components/Input/index.scss           | 8 ++++++++
 components/Input/index.tsx            | 3 ++-
 components/JobSkillResult/index.scss  | 2 +-
 components/SearchModal/index.tsx      | 4 ++--
 components/SummonResult/index.scss    | 2 +-
 components/WeaponResult/index.scss    | 2 +-
 7 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/components/CharacterResult/index.scss b/components/CharacterResult/index.scss
index 3850d5e2..b247ab9d 100644
--- a/components/CharacterResult/index.scss
+++ b/components/CharacterResult/index.scss
@@ -28,7 +28,7 @@
     gap: $unit-half;
 
     h5 {
-      color: var(--text-secondary);
+      color: var(--text-tertiary);
       display: inline-block;
       font-size: $font-medium;
       font-weight: $medium;
diff --git a/components/Input/index.scss b/components/Input/index.scss
index 013f4a74..21fe24d8 100644
--- a/components/Input/index.scss
+++ b/components/Input/index.scss
@@ -7,6 +7,14 @@
   display: block;
   padding: $unit-2x;
   width: 100%;
+
+  &.Bound {
+    background-color: var(--input-bound-bg);
+
+    &:hover {
+      background-color: var(--input-bound-bg-hover);
+    }
+  }
 }
 
 .InputError {
diff --git a/components/Input/index.tsx b/components/Input/index.tsx
index 27d21315..23beb955 100644
--- a/components/Input/index.tsx
+++ b/components/Input/index.tsx
@@ -16,11 +16,12 @@ const Input = React.forwardRef<HTMLInputElement, Props>(function input(
   forwardedRef
 ) {
   const classes = classNames({ Input: true }, props.className)
+  const { value, ...inputProps } = props
 
   return (
     <label className="Label" htmlFor={props.name}>
       <input
-        {...props}
+        {...inputProps}
         autoComplete="off"
         className={classes}
         defaultValue={props.value || ''}
diff --git a/components/JobSkillResult/index.scss b/components/JobSkillResult/index.scss
index a2cc2cdf..b558483c 100644
--- a/components/JobSkillResult/index.scss
+++ b/components/JobSkillResult/index.scss
@@ -56,7 +56,7 @@
     }
 
     h5 {
-      color: var(--text-secondary);
+      color: var(--text-tertiary);
       display: inline-block;
       font-size: $font-medium;
       font-weight: $medium;
diff --git a/components/SearchModal/index.tsx b/components/SearchModal/index.tsx
index 638b223b..9b5912de 100644
--- a/components/SearchModal/index.tsx
+++ b/components/SearchModal/index.tsx
@@ -89,7 +89,7 @@ const SearchModal = (props: Props) => {
         setRecordCount(response.data.meta.count)
 
         if (replace) {
-          replaceResults(response.data.count, response.data.results)
+          replaceResults(response.data.meta.count, response.data.results)
         } else {
           appendResults(response.data.results)
         }
@@ -330,7 +330,7 @@ const SearchModal = (props: Props) => {
           <div id="Bar">
             <Input
               autoComplete="off"
-              className="Search"
+              className="Search Bound"
               name="query"
               placeholder={props.placeholderText}
               ref={searchInput}
diff --git a/components/SummonResult/index.scss b/components/SummonResult/index.scss
index 11b51c2d..69de7ce4 100644
--- a/components/SummonResult/index.scss
+++ b/components/SummonResult/index.scss
@@ -28,7 +28,7 @@
     gap: $unit-half;
 
     h5 {
-      color: var(--text-secondary);
+      color: var(--text-tertiary);
       display: inline-block;
       font-size: $font-medium;
       font-weight: $medium;
diff --git a/components/WeaponResult/index.scss b/components/WeaponResult/index.scss
index 43017a54..c67efcc9 100644
--- a/components/WeaponResult/index.scss
+++ b/components/WeaponResult/index.scss
@@ -28,7 +28,7 @@
     gap: $unit-half;
 
     h5 {
-      color: var(--text-secondary);
+      color: var(--text-tertiary);
       display: inline-block;
       font-size: $font-medium;
       font-weight: $medium;