From ac497964b036ed30fdd40a74a08604a483a58619 Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Fri, 6 Jun 2025 10:04:44 -0700
Subject: [PATCH] Implement algolia logo

---
 packages/skin-database/app/SearchLogo.tsx | 43 +++++++++++++++--------
 1 file changed, 28 insertions(+), 15 deletions(-)

diff --git a/packages/skin-database/app/SearchLogo.tsx b/packages/skin-database/app/SearchLogo.tsx
index eb43b440..91934435 100644
--- a/packages/skin-database/app/SearchLogo.tsx
+++ b/packages/skin-database/app/SearchLogo.tsx
@@ -1,19 +1,32 @@
 "use client";
-// import { useWindowSize } from "../../skin-museum-client/src/hooks";
-// import AlgoliaLogo from "../../skin-museum-client/src/searchByAlgoliaDarkbBackground.svg";
-// import algoliaLogoSmallUrl from "../../skin-museum-client/src/searchByAlgoliaSmall.png";
+import { useWindowSize } from "../../skin-museum-client/src/hooks";
+import AlgoliaLogo from "../../skin-museum-client/src/searchByAlgoliaDarkbBackground.svg";
+import algoliaLogoSmallUrl from "../../skin-museum-client/src/searchByAlgoliaSmall.png";
 
 export default function SearchLogo() {
-  return null;
-  // const { windowWidth } = useWindowSize();
-  // if (windowWidth > 500) {
-  //   return <AlgoliaLogo.ReactComponent />;
-  // }
-  // return (
-  //   <img
-  //     alt="Search by Algolia"
-  //     style={{ width: 25, height: 25, paddingTop: 4 }}
-  //     src={algoliaLogoSmallUrl}
-  //   />
-  // );
+  const { windowWidth } = useWindowSize();
+  if (windowWidth > 500) {
+    return (
+      <img
+        alt="Search by Algolia"
+        style={{
+          width: AlgoliaLogo.width,
+          height: AlgoliaLogo.height,
+          paddingTop: 4,
+        }}
+        src={AlgoliaLogo.src}
+      />
+    );
+  }
+  return (
+    <img
+      alt="Search by Algolia"
+      style={{
+        width: 25,
+        height: 25,
+        paddingTop: 4,
+      }}
+      src={algoliaLogoSmallUrl.src}
+    />
+  );
 }