Prefetch using Next App router not working with useQuery but works with useSuspenseQuery

export default async function Page({ params: { como }, searchParams: { id } }: Props) {
    const template = id ? await api.mtr.template.get({ templateId: Number(id) }) : undefined;
    
    const ssr = await createSSRHelper();
    void ssr.mtr.getIntegrationPlatforms.prefetch();
    void ssr.mtr.getGenerators.prefetch({ viewingAs: como });

    const dehydratedState = dehydrate(ssr.queryClient);

    return (
        <MtrContextProvider
            values={{
                template,
                isTemplate: true,
                // hasInternalStockResource,
            }}
        >
            <ReactQueryHydrate state={dehydratedState}>
                <InsertMtrTemplatePage />
            </ReactQueryHydrate>
        </MtrContextProvider>
    );
}