From 0af513da89726c537125d5c1315de5ee08878e6e Mon Sep 17 00:00:00 2001
From: tejaspanchall <tejaspanchal127@gmail.com>
Date: Thu, 5 Jun 2025 17:56:55 +0530
Subject: [PATCH] updated search on landing page

---
 .env.example     |  3 ++-
 next.config.js   |  9 +++++++--
 src/app/page.jsx | 50 ++++++++++++++++++++++++++++++++----------------
 src/lib/api.js   |  2 +-
 4 files changed, 43 insertions(+), 21 deletions(-)

diff --git a/.env.example b/.env.example
index e979aac..c556dbc 100644
--- a/.env.example
+++ b/.env.example
@@ -1 +1,2 @@
-ANIWATCH_API = your animwatch-api key
\ No newline at end of file
+# Your AniWatch API URL - replace with your own API endpoint
+ANIWATCH_API=https://your-api-url.com
\ No newline at end of file
diff --git a/next.config.js b/next.config.js
index 54b5db7..539b60d 100644
--- a/next.config.js
+++ b/next.config.js
@@ -34,14 +34,19 @@ const nextConfig = {
   },
   serverExternalPackages: ['puppeteer-core'],
   async rewrites() {
+    // Get the API URL from environment variable or use default
+    const apiUrl = process.env.ANIWATCH_API;
+    // Extract the base URL without the /api/v2/hianime path
+    const baseUrl = apiUrl.replace('/api/v2/hianime', '');
+    
     return [
       {
         source: '/api/v2/hianime/:path*',
-        destination: 'https://justaniwatchapi.vercel.app/api/v2/hianime/:path*'
+        destination: `${apiUrl}/:path*`
       },
       {
         source: '/api/anime/:path*',
-        destination: 'https://justaniwatchapi.vercel.app/api/v2/hianime/anime/:path*'
+        destination: `${apiUrl}/anime/:path*`
       }
     ]
   },
diff --git a/src/app/page.jsx b/src/app/page.jsx
index 91ecefd..5cffa8d 100644
--- a/src/app/page.jsx
+++ b/src/app/page.jsx
@@ -30,6 +30,7 @@ export default function LandingPage() {
       if (searchQuery.trim().length > 2) {
         try {
           const suggestions = await fetchSearchSuggestions(searchQuery);
+          // Update to use the same format as home page search
           setSearchSuggestions(suggestions || []);
           setShowSuggestions(true);
         } catch (error) {
@@ -70,14 +71,16 @@ export default function LandingPage() {
   const handleSearch = (e) => {
     e.preventDefault();
     if (searchQuery.trim()) {
-      router.push(`/search/${searchQuery}`);
+      router.push(`/search?q=${encodeURIComponent(searchQuery)}`);
       setSearchQuery('');
       setShowSuggestions(false);
     }
   };
 
-  const handleSuggestionClick = (title) => {
-    router.push(`/search/${title}`);
+  const handleSuggestionClick = (suggestion) => {
+    // Updated to handle object-based suggestions
+    const query = suggestion.title || suggestion;
+    router.push(`/search?q=${encodeURIComponent(query)}`);
     setSearchQuery('');
     setShowSuggestions(false);
   };
@@ -184,10 +187,32 @@ export default function LandingPage() {
                 {searchSuggestions.map((suggestion, index) => (
                   <div 
                     key={index} 
-                    className="px-4 py-3 text-sm text-white hover:bg-[var(--hover)] cursor-pointer transition-colors duration-200"
+                    className="px-4 py-3 text-sm text-white hover:bg-[var(--hover)] cursor-pointer transition-colors duration-200 flex items-center gap-3"
                     onClick={() => handleSuggestionClick(suggestion)}
                   >
-                    {suggestion}
+                    {suggestion.image && (
+                      <div className="w-8 h-12 flex-shrink-0 overflow-hidden rounded-sm">
+                        <Image 
+                          src={suggestion.image} 
+                          alt={suggestion.title || "Anime"} 
+                          width={32} 
+                          height={48}
+                          className="object-cover w-full h-full"
+                          unoptimized
+                        />
+                      </div>
+                    )}
+                    <div className="flex-1 text-left">
+                      <p className="font-medium leading-tight">{suggestion.title || suggestion}</p>
+                      {suggestion.jname && (
+                        <p className="text-xs text-[var(--text-muted)]">{suggestion.jname}</p>
+                      )}
+                    </div>
+                    {suggestion.type && (
+                      <span className="text-[10px] bg-[var(--border)] px-2 py-1 rounded-full text-[var(--text-muted)]">
+                        {suggestion.type}
+                      </span>
+                    )}
                   </div>
                 ))}
               </div>
@@ -259,14 +284,7 @@ export default function LandingPage() {
                 }`}
               >
                 <div className="p-3 sm:p-4 border-t border-[var(--border)]">
-                  <ul className="text-[var(--text-muted)] space-y-2 sm:space-y-3 list-disc pl-5 text-left text-sm sm:text-base">
-                    <li><span className="font-medium text-white">Content library:</span> Our extensive database ensures you can find almost everything here.</li>
-                    <li><span className="font-medium text-white">Streaming experience:</span> We have top of the line streaming servers. You can simply choose one that is fast for you.</li>
-                    <li><span className="font-medium text-white">Quality/Resolution:</span> All our video files are encoded in highest possible resolution. We also have quality setting function that allows every user to enjoy streaming regardless of their internet speed.</li>
-                    <li><span className="font-medium text-white">Updates:</span> Our content is updated hourly, so you will get update as fast as possible.</li>
-                    <li><span className="font-medium text-white">User interface:</span> We focus on the simple and easy to use, so you will feel the life is easier here. We also have almost every feature that other anime streaming sites have, but not the opposite.</li>
-                    <li><span className="font-medium text-white">Device compatibility:</span> JustAnime works fine on both desktop and mobile devices, even with old browsers, so you can enjoy your anime anywhere you want.</li>
-                  </ul>
+                  <p className="text-[var(--text-muted)] text-left text-sm sm:text-base">JustAnime offers the best user experience for anime streaming with fast loading speeds, a beautiful interface, no intrusive ads, large content library, HD quality, and weekly updates. Our clean design and extensive features set us apart from other platforms.</p>
                 </div>
               </div>
             </div>
@@ -277,7 +295,7 @@ export default function LandingPage() {
                 className="w-full flex justify-between items-center p-3 sm:p-4 text-left hover:bg-opacity-90 transition-colors" 
                 onClick={() => toggleFAQ(2)}
               >
-                <h3 className="text-base sm:text-lg md:text-xl font-semibold text-white pr-2">Why should I choose JustAnime?</h3>
+                <h3 className="text-base sm:text-lg md:text-xl font-semibold text-white pr-2">How do I request an anime?</h3>
                 <svg 
                   className={`w-4 h-4 sm:w-5 sm:h-5 flex-shrink-0 transform transition-transform duration-300 ease-out ${openFAQ === 2 ? 'rotate-180' : ''}`} 
                   fill="none" 
@@ -294,9 +312,7 @@ export default function LandingPage() {
                 }`}
               >
                 <div className="p-3 sm:p-4 border-t border-[var(--border)]">
-                  <p className="text-[var(--text-muted)] text-left text-sm sm:text-base">
-                    If you want a good and safe place to watch anime online for free, give JustAnime a try, and if you like what we provide, please help us by sharing JustAnime to your friends and do not forget to bookmark our site.
-                  </p>
+                  <p className="text-[var(--text-muted)] text-left text-sm sm:text-base">You can request anime by visiting our Discord community or using the contact form. Our team aims to fulfill requests quickly based on availability.</p>
                 </div>
               </div>
             </div>
diff --git a/src/lib/api.js b/src/lib/api.js
index 7d12b17..1f8be12 100644
--- a/src/lib/api.js
+++ b/src/lib/api.js
@@ -1,7 +1,7 @@
 // Use absolute URL for server components and relative URL for client components
 const isServer = typeof window === 'undefined';
 const API_BASE_URL = isServer 
-  ? "https://justaniwatchapi.vercel.app/api/v2/hianime" // Use absolute URL for server-side
+  ? process.env.ANIWATCH_API // Use environment variable with fallback
   : "/api/v2/hianime"; // Use relative URL for client-side
 
 // Common headers for all API requests