feat: display loading ui during search form submission

package.json

@@ -44,4 +44,4 @@
     "typescript": "^5",
     "vitest": "^4.0.18"
   }
-}
+}

server.log

@@ -0,0 +1,25 @@
+
+> github-user-summary@0.1.0 dev
+> next dev
+
+▲ Next.js 16.1.6 (Turbopack)
+- Local:         http://localhost:3000
+- Network:       http://192.168.0.2:3000
+
+✓ Starting...
+Attention: Next.js now collects completely anonymous telemetry regarding usage.
+This information is used to shape Next.js' roadmap and prioritize features.
+You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
+https://nextjs.org/telemetry
+
+✓ Ready in 1107ms
+○ Compiling / ...
+ GET / 200 in 8.9s (compile: 8.5s, render: 444ms)
+ GET / 200 in 91ms (compile: 7ms, render: 84ms)
+[next-auth][warn][NEXTAUTH_URL]
+https://next-auth.js.org/warnings#nextauth_url
+ GET / 200 in 70ms (compile: 6ms, render: 64ms)
+ GET /api/auth/session 200 in 54ms (compile: 38ms, render: 16ms)
+⚠ metadataBase property in metadata export is not set for resolving social open graph or twitter images, using "http://localhost:3000". See https://nextjs.org/docs/app/api-reference/functions/generate-metadata#metadatabase
+[next-auth][warn][NEXTAUTH_URL]
+https://next-auth.js.org/warnings#nextauth_url

src/components/SearchForm.tsx

@@ -1,17 +1,20 @@
 "use client";
 
-import { useState } from "react";
+import { useState, useTransition } from "react";
 import { useRouter } from "next/navigation";
 
 export default function SearchForm() {
   const [username, setUsername] = useState("");
   const router = useRouter();
+  const [isPending, startTransition] = useTransition();
 
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault();
     const trimmed = username.trim();
     if (trimmed) {
-      router.push(`/${encodeURIComponent(trimmed)}`);
+      startTransition(() => {
+        router.push(`/${encodeURIComponent(trimmed)}`);
+      });
     }
   };
 
@@ -28,10 +31,10 @@ export default function SearchForm() {
       />
       <button
         type="submit"
-        disabled={!username.trim()}
+        disabled={!username.trim() || isPending}
         className="rounded-md bg-accent px-5 py-2.5 text-sm font-medium text-white hover:bg-accent-hover disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
       >
-        Search
+        {isPending ? "Loading..." : "Search"}
       </button>
     </form>
   );