[Feature request] type definition for next method

[TERADA-DANTE]

Hello beloved contributors :) Good day.

I have a feature request.

Here's my scenario. I am using strict typescript in next.js with next-connect let's say there's a API logic

index.ts

export default nextConnect<NextApiRequest, NextApiResponse>({
  onError(error, req, res, next) {},
  onNoMatch(req, res) {},
}).use((req, res, next) => {})
.get(myGetFunction)

It's not a problem at this moment.

But when it comes to Divide and Conqure, things can go like this.

index.ts

import handler from './handler.ts'
export default handler.get(myGetFunction)

handler.ts

export default nextConnect<NextApiRequest, NextApiResponse>({
  onError(error, req, res, next) {},
  onNoMatch(req, res) {},
}).use((req, res, next) => {});

Still, It's not a problem.

but What if someone wants to divide after .use((req, res, next) => {}) ?

For example,

handler.ts

export default nextConnect<NextApiRequest, NextApiResponse>({
  onError(error, req, res, next) {},
  onNoMatch(req, res) {},
}).use(middleware);

middleware.ts

export default function middleware((res: NextApiRequest ,req: NextApiResponse, next: any)){}

And here comes the problem.

Since next.js doesn't support type for next, I have to set the type of next as any or Function.

as of now, strict typescript doesn't allow any, I use Function.

Is there any correct way to set the type of next? otherwise, It would be great to add type for next in next-connect as feature

[hoangvvo]

Hey @TERADA-DANTE,

This is the type of the next function https://github.com/hoangvvo/next-connect/blob/master/src/index.d.ts#L4. If you want to use it, it just needs to be exported from there (care to create a PR?). But at the same time, it is really to just type it out too:

export default function middleware((res: NextApiRequest ,req: NextApiResponse, next: (err?: Error) => void)){}

[TERADA-DANTE]

@hoangvvo Hi! Thanks for lovely answer. Yup. Specifying the function is quite acceptable.

As a perspective of convention, Making a type for next is a bit progressive since NextApiRequest and NextApiResponse comes from "next".

Maybe I should wait for the official type of next from vercel.

[TERADA-DANTE]

@hoangvvo Sorry for reopen issue. I just want to ask a small thing. what is the err?: Error in next?

I have issued like below

// in middleware
export default function middleware(
  req: NextApiRequest,
  res: NextApiResponse,
  next: (error?: Error) => void
) {
  next(new Error('what is this?'));
}

// methods.js

const methods = {
  get: async (req: NextApiRequest, res: NextApiResponse) => {
    console.log(req);
    ...
  },
};

but I couldn't find any error in req.

What is the role of err in next function?

[hoangvvo]

That is for you to optionally pass in an error:

next(err)

This will call onError with that error.