Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot obtain slugs in api routes while using Typescript #1766

Open
6 tasks done
setterst opened this issue Jul 28, 2024 · 1 comment
Open
6 tasks done

Cannot obtain slugs in api routes while using Typescript #1766

setterst opened this issue Jul 28, 2024 · 1 comment

Comments

@setterst
Copy link

setterst commented Jul 28, 2024

Checklist

Description

Following the NextJS documentation for app router Dynamic Route Segments, the Typescript compiler will produce build errors when executing next build.

Switching the route file to compile in JavaScript, route slug is populated as expected.

Reproduction

file: /app/api/test/[slug]/route.ts
route: /api/test/aaaaa

expect TypeScript to compile and the slug parameter to be populated with 'aaaaa'

import { withApiAuthRequired } from '@auth0/nextjs-auth0';
import { NextRequest, NextResponse } from 'next/server';

interface GetParams {
  params: { slug: string };
}

export const GET = withApiAuthRequired(async (req: NextRequest, params: GetParams) => {
  console.log(params);
  return NextResponse.json({});
});

Additional context

No response

nextjs-auth0 version

3.5.0

Next.js version

14.2.5

Node.js version

22.4.1

@andrinheusser
Copy link

The same problems exists for Pages. I created a fix for pages in #1764 , should be easy to extend this to api routes.

However, I'm not sure this is an issue that should be fixed in code. You should be validating user input anyway, so i settled on an approach like this:

eg. using zod

export default withPageAuthRequired(async function OrderPage({
  searchParams: unsafeSearchParams,
  params: unsafeParams,
}) {
  const { timerange } = z
    .object({ timerange: timerangeSchema })
    .parse(unsafeParams);
  const sParams = orderSearchParamsSchema.parse(unsafeSearchParams);

  [...]

}

The problem remains that the situation right now is far from ideal: People using Typescript will follow the docs and encounter errors.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants