Enable typedRoutes and update Next.js

Author: max-programming

next-env.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
+/// <reference path="./.next/types/routes.d.ts" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

next.config.mjs

@@ -8,6 +8,7 @@ const __dirname = path.dirname(__filename);
 /**@type {import('next').NextConfig}*/
 const config = {
   reactStrictMode: true,
+  typedRoutes: true,
   experimental: {
     viewTransition: true
   },

package.json

@@ -29,11 +29,11 @@
     "dotenv-cli": "^10.0.0",
     "drizzle-orm": "^0.44.6",
     "eslint": "^9.32.0",
-    "eslint-config-next": "^15.4.5",
+    "eslint-config-next": "^15.5.4",
     "framer-motion": "^12.23.12",
     "jotai": "^2.12.5",
     "lucide-react": "^0.536.0",
-    "next": "^15.4.5",
+    "next": "^15.5.4",
     "next-auth": "5.0.0-beta.29",
     "next-cloudinary": "^6.16.0",
     "next-seo": "^6.8.0",

pnpm-lock.yaml

@@ -32,13 +32,13 @@ export function Hero() {
   function handleSearch(e: React.FormEvent) {
     e.preventDefault();
     const formData = new FormData(e.target as HTMLFormElement);
-    let chosenLanguages = selected;
+    const chosenLanguages = [...selected];
 
     // Fallback: if no checkbox selected, use the single input value
     if (chosenLanguages.length === 0) {
       const typed = String(formData.get('search') || '').trim();
       if (typed) {
-        chosenLanguages = [typed];
+        chosenLanguages.push(typed);
       }
     }
 

src/app/(public)/_components/hero.tsx

@@ -26,20 +26,20 @@ export function SearchForm() {
   }
 
   function onSubmit({ searchQuery }: FormValues) {
+    if (!pathname.startsWith('/repos')) return;
+
+    const reposPathname = pathname as `/repos/${string}`;
     const trimmedQuery = searchQuery.trim();
     if (trimmedQuery !== '') {
       const sp = new URLSearchParams(searchParams);
       sp.set('q', trimmedQuery);
-      router.push(`${pathname}?${sp.toString()}`);
+      router.push(`${reposPathname}?${sp.toString()}`);
     }
   }
 
   return (
     <div className="w-full">
-      <form
-        className="w-full form-control"
-        onSubmit={handleSubmit(onSubmit)}
-      >
+      <form className="w-full form-control" onSubmit={handleSubmit(onSubmit)}>
         <div className="relative">
           <input
             placeholder="Search"