web: fix search debounce and client/server boundary

web/src/app/sok/page.tsx

@@ -1,10 +1,10 @@
-import { graphql } from "@/gql";
 import { getClient } from "@/app/client";
 import {
-  SearchContainer,
   type SearchResult,
-} from "@/components/search/SearchContainer";
-import { Suspense } from "react";
+  SearchResults,
+} from "@/components/search/SearchResults";
+import { SearchShell } from "@/components/search/SearchShell";
+import { graphql } from "@/gql";
 
 // TODO: seo metadata?
 
@@ -69,9 +69,9 @@ export default async function Page({
 
   return (
     <main className="site-main" id="main">
-      <Suspense key={query}>
-        <SearchContainer query={query ?? ""} results={results} />
-      </Suspense>
+      <SearchShell initialQuery={query ?? ""}>
+        {query ? <SearchResults results={results} /> : null}
+      </SearchShell>
     </main>
   );
 }