<Miqdad> fix bug & add category

1 files changed, 31 insertions, 16 deletions

diff --git a/src/pages/searchkey/[slug].jsx b/src/pages/searchkey/[slug].jsx
index 3ebf6469..4a6923ff 100644
--- a/src/pages/searchkey/[slug].jsx
+++ b/src/pages/searchkey/[slug].jsx
@@ -3,9 +3,11 @@ import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';
 import Seo from '@/core/components/Seo';
 import dynamic from 'next/dynamic';
-import { getNameFromSlug } from '@/core/utils/slug';
 import { capitalizeEachWord } from '../../utils/capializeFIrstWord';
 
+// ✅ Breadcrumb = default export
+import Breadcrumb from '@/lib/category/components/Breadcrumb';
+
 const BasicLayout = dynamic(() =>
   import('@/core/components/layouts/BasicLayout')
 );
@@ -15,20 +17,19 @@ const ProductSearch = dynamic(() =>
 
 export default function FindPage() {
   const route = useRouter();
+
   const [result, setResult] = useState(null);
   const [query, setQuery] = useState(null);
+  const [categoryId, setCategoryId] = useState(null);
 
   const slugRaw = route.query.slug || null;
-  console.log(slugRaw);
-
-  // const cleanKey = slugRaw ? getNameFromSlug(slugRaw) : '';
-  // console.log(cleanKey);
   const readableSlug = capitalizeEachWord(slugRaw);
 
-  const getSearchKeyData = async (clean) => {
+  // 🔹 Fetch searchkey dari Solr
+  const getSearchKeyData = async (slug) => {
     try {
       const res = await axios(
-        `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/searchkey?url=${clean}&from=searchkey`
+        `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/searchkey?url=${slug}&from=searchkey`
       );
 
       setResult(res?.data?.response?.docs?.[0] || null);
@@ -37,21 +38,31 @@ export default function FindPage() {
     }
   };
 
+  // 🔹 Trigger fetch saat slug siap
   useEffect(() => {
-    if (!route.isReady) return;
-    if (!slugRaw) return;
-
+    if (!route.isReady || !slugRaw) return;
     getSearchKeyData(slugRaw);
   }, [route.isReady, slugRaw]);
 
+  // 🔹 Ambil product_ids + categoryId dari Solr
   useEffect(() => {
-    if (result) {
-      const ids = result.product_ids_is || [];
+    if (!result) return;
 
-      setQuery({
-        ids: ids.join(','),
-        from: 'searchkey',
-      });
+    // product search
+    const ids = result.product_ids_is || [];
+    setQuery({
+      ids: ids.join(','),
+      from: 'searchkey',
+    });
+
+    // breadcrumb category
+    const catId =
+      result.category_id_i ||
+      result.public_categ_id_i ||
+      (result.category_ids_is && result.category_ids_is[0]);
+
+    if (catId) {
+      setCategoryId(catId);
     }
   }, [result]);
 
@@ -69,6 +80,10 @@ export default function FindPage() {
         canonical={`${process.env.NEXT_PUBLIC_SELF_HOST}${route.asPath}`}
       />
 
+      {/* ✅ Breadcrumb (auto fetch via component) */}
+      {categoryId && <Breadcrumb categoryId={categoryId} />}
+
+      {/* ✅ Product result */}
       {query && <ProductSearch query={query} prefixUrl={route.asPath} />}
     </BasicLayout>
   );