feat: add user centric features

app/search/search-content.tsx

@@ -8,6 +8,7 @@ import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
 import { buildSearchResultUrl } from "@/lib/text-highlight";
+import { KnowledgebaseIndex } from "@/components/knowledgebase-index";
 import {
   Search,
   Loader2,
@@ -329,12 +330,12 @@ function SearchInner() {
         <p className="uppercase tracking-[0.22em] text-xs font-semibold text-muted-foreground">
           Search
         </p>
-        <h1 className="mt-4 font-[family-name:var(--font-title)] font-semibold text-4xl sm:text-5xl leading-tight text-foreground">
+        <h1 className="mt-4 font-[family-name:var(--font-title)] font-semibold text-2xl sm:text-4xl leading-tight text-foreground">
           Find a word, a verse, a name.
         </h1>
         <p className="mt-3 max-w-xl text-base text-muted-foreground leading-relaxed">
-          Typo-tolerant search across every book, letter, lecture, essay,
-          journal, magazine, and glossary entry. Diacritics are ignored, so
+          Smart search across books, letters, lectures, essays,
+          journals and magazines. Diacritics are ignored, so
           &ldquo;Krsna&rdquo; finds &ldquo;Kṛṣṇa.&rdquo;
         </p>
       </section>
@@ -426,10 +427,9 @@ function SearchInner() {
             </div>
           )}
 
-          {/* No query — show editorial empty state with example queries */}
-          {!isLoading && !hasSearched && (
-            <EmptyStateExamples onPick={(q) => setInputValue(q)} />
-          )}
+          {/* No query — render the full Knowledgebase index so the search
+              page doubles as the browsing entry point. */}
+          {!isLoading && !hasSearched && <KnowledgebaseIndex />}
 
           {/* No results */}
           {!isLoading &&
@@ -634,47 +634,6 @@ function ResultCard({ result }: { result: SearchResult }) {
   );
 }
 
-// ---------------------------------------------------------------------------
-// Empty-state example chips
-// ---------------------------------------------------------------------------
-
-const EXAMPLE_QUERIES: { label: string; query: string }[] = [
-  { label: "sarva dharman parityajya", query: "sarva dharman parityajya" },
-  { label: "letter to mukunda", query: "letter to mukunda" },
-  { label: "bhakti yoga", query: "bhakti yoga" },
-  { label: "tulasi", query: "tulasi" },
-  { label: "morning walk los angeles", query: "morning walk los angeles" },
-];
-
-function EmptyStateExamples({ onPick }: { onPick: (q: string) => void }) {
-  return (
-    <div className="py-12 sm:py-16">
-      <p className="text-xs uppercase tracking-[0.2em] font-semibold text-muted-foreground text-center">
-        Try one of these
-      </p>
-      <div className="mt-5 flex flex-wrap items-center justify-center gap-2 max-w-2xl mx-auto">
-        {EXAMPLE_QUERIES.map((ex) => (
-          <button
-            key={ex.query}
-            type="button"
-            onClick={() => onPick(ex.query)}
-            className="rounded-full bg-card ring-1 ring-foreground/10 hover:ring-foreground/30 px-3.5 py-1.5 text-sm font-medium text-foreground transition-all"
-          >
-            {ex.label}
-          </button>
-        ))}
-      </div>
-      <p className="mt-8 text-center text-xs text-muted-foreground">
-        Press{" "}
-        <kbd className="rounded border border-border bg-card px-1.5 py-0.5 text-[0.7rem]">
-          /
-        </kbd>{" "}
-        from any page to jump here.
-      </p>
-    </div>
-  );
-}
-
 // ---------------------------------------------------------------------------
 // Result Meta — varies by collection
 // ---------------------------------------------------------------------------