Fixed search result image issue

SU-SWS · Dec 10, 2024 · c228c0c · c228c0c
1 parent 7bc4b9a
commit c228c0c
Show file tree

Hide file tree

Showing 3 changed files with 228 additions and 238 deletions.
diff --git a/package.json b/package.json
@@ -20,9 +20,9 @@
     "@next/third-parties": "15.0.4",
     "@tailwindcss/container-queries": "^0.1.1",
     "@types/node": "^22.10.1",
-    "@types/react": "^19.0.0",
-    "@types/react-dom": "19.0.0",
-    "algoliasearch": "5.15.0",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "19.0.2",
+    "algoliasearch": "5.16.0",
     "autoprefixer": "^10.4.20",
     "clsx": "^2.1.1",
     "decanter": "^7.3.0",
@@ -39,8 +39,8 @@
     "react": "19.0.0",
     "react-dom": "19.0.0",
     "react-focus-lock": "^2.13.2",
-    "react-instantsearch": "^7.13.8",
-    "react-instantsearch-nextjs": "^0.3.18",
+    "react-instantsearch": "^7.13.9",
+    "react-instantsearch-nextjs": "^0.3.20",
     "react-slick": "^0.30.2",
     "react-tiny-oembed": "^1.1.0",
     "sharp": "^0.33.5",
@@ -78,7 +78,7 @@
     "storybook": "^8.4.7",
     "storybook-addon-module-mock": "^1.3.4",
     "tsconfig-paths-webpack-plugin": "^4.2.0",
-    "typescript-eslint": "8.17.0"
+    "typescript-eslint": "8.18.0"
   },
   "packageManager": "yarn@4.5.1",
   "resolutions": {

diff --git a/src/components/algolia-search/hits/sup-book.tsx b/src/components/algolia-search/hits/sup-book.tsx
@@ -38,8 +38,8 @@ const SupBookHit = ({hit}: {hit: HitType<BookHit>}) => {
             </Link>
           </H3>
 
-          {hit.summary && <p className="card-paragraph mb-8">{hit.summary}</p>}
-          {hit.html && !hit.summary && (
+          {hit.book_subtitle && <div className="card-paragraph mb-8">{hit.book_subtitle}</div>}
+          {hit.html && !hit.book_subtitle && (
             <p className="card-paragraph mb-8">
               {/* @ts-expect-error React types don't match the library. */}
               <Snippet hit={hit} attribute="html" />
@@ -49,22 +49,23 @@ const SupBookHit = ({hit}: {hit: HitType<BookHit>}) => {
           {hit.book_authors && <div className="text-18">{hit.book_authors}</div>}
           {hit.book_published_year && <div className="text-18">{hit.book_published_year}</div>}
         </div>
-
-        <Link
-          href={url}
-          aria-hidden
-          tabIndex={-1}
-          prefetch={false}
-          className={twMerge(
-            "relative mx-auto shrink-0 @2xl:mr-0",
-            clsx({
-              "aspect-[2/3] w-[150px]": hit.book_type === "book",
-              "aspect-[4/3] h-[150px]": hit.book_type === "digital_project",
-            })
-          )}
-        >
-          <Image className="object-cover" src={imageUrl} alt="" fill sizes="300px" />
-        </Link>
+        <div className="mx-auto flex shrink-0 items-center @2xl:mr-0">
+          <Link
+            href={url}
+            aria-hidden
+            tabIndex={-1}
+            prefetch={false}
+            className={twMerge(
+              "relative block",
+              clsx({
+                "aspect-[2/3] w-[150px]": hit.book_type === "book",
+                "aspect-[4/3] h-[150px]": hit.book_type !== "book",
+              })
+            )}
+          >
+            <Image className="object-cover" src={imageUrl} alt="" fill sizes="300px" />
+          </Link>
+        </div>
       </div>
     </article>
   )