My Next.js route file path: src/app/api/tests/[id]/route.ts

import {NextResponse} from "next/server"
export async function GET(
  request: Request,
  {params} : { params: { id: string } }
): Promise<Response> {
  const { id } = params;
  console.log("Test ID:", id);
  return NextResponse.json({ message: id });
}

curl -X GET http://localhost:3000/api/tests/8

Error below:

Error: Route "/api/tests/[id]" used `params.id`. `params` should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis
    at GET (file://C%3A/Users/Owner/Desktop/Oluwaseyi/Software%20Projects/ngoane/src/app/api/tests/%5Bid%5D/route.ts:9:10)      
   7 |   {params} : { params: { id: string } }
   8 | ): Promise<Response> {
>  9 |   const { id } = params;
     |          ^
  10 |   console.log("Test ID:", id);
  11 |   return NextResponse.json({ message: id });
  12 | }
Test ID: 8
 GET /api/tests/8 200 in 2300ms

The route seems to work, retrieves the id from the route, and returns it accordingly, but I can't seem to figure out why I am getting the error that params should be awaited since it is actually a string. Nothing I tried worked. Please help.