Async Server Component TypeScript Error

[deep forge]

I'm trying to troubleshoot some issues with supabase call not working in server component (i'm using typescript), this issue might be linked... Not sure... At wits end.

Next says As a temporary workaround, you can add {/* @ts-expect-error Async Server Component */} above the component to disable type checking for it.

Where exactly should I place it ? An example of how to use this {/* @ts-expect-error Async Server Component */} would be super appreciated.

import supabase from "@/utils/supabase";

{
/* @ts-expect-error Async Server Component */
}
export default async function Materials() {
const { data } = await supabase.from("materials").select();
return <pre>{JSON.stringify(data, null, 2)}</pre>;
}

[sly tide]

You use it when you call the component like here in the playground app:
https://github.com/vercel/app-playground/blob/3177b840cfd3ddbb2f1ff40cc89d8130657a2d5a/app/streaming/node/product/[id]/page.tsx#L25

[deep forge]

I had a look at that, not sure how to relate it to my code:

import supabase from "@/utils/supabase";

export default async function Materials() {
const { data } = await supabase.from("materials").select();
return <pre>{JSON.stringify(data, null, 2)}</pre>;
}

How would I use it with the code above? It's a page.tsx , it's not called by anything yet, just browse to the route.