Best way to handle query params

[cmacdonnacha]

I have the following handler:

const mockCars = [
  {
    id: 718311,
    make: 'ford',
    color: 'red',
  },
  {
    id: 48931,
    make: 'vw',
    color: 'blue',
  },
];

 // GET cars
 rest.get('/cars', (req, res, ctx) => {
   return res(ctx.status(200), ctx.json(mockCars));
 })

But I would like to have a handler to return cars of a specific make (via query params) so I thought something like this would work:

const mockFordCars = [
  {
    id: 718311,
    make: 'ford',
    color: 'red',
  },
];

 // GET ford cars
 rest.get('/cars?make=ford', (req, res, ctx) => {
   return res(ctx.status(200), ctx.json(mockFordCars));
 })

But this throws a warning. Would something like this be ok?

 // GET ford cars
 rest.get('/cars', (req, res, ctx) => {
  const carMake = req.url.searchParams.get('make');
  
  if (make === 'ford') {
     return res(ctx.status(200), ctx.json(mockFordCars));
  }

   return res(ctx.status(200), ctx.json(mockCars));
 })

[kettanaito]

Hi, @cmacdonnacha.

Query parameters shouldn't be present in the request handler URL as they aren't a part of the resource's path. You're handling the query parameters correctly in the last example: create a resource path /cars, access the parameter value via req.url.searchParams, and base your response on that value.

const mockCars = [
  { id: 1, make: 'ford', color: 'red' }
]

res.get('/cars', (req, res, ctx) => {
  const manufacturer = req.url.searchParams.get('make')
  const cars = mockCars.filter(car => car.make === manufacturer)
  
  if (cars.length === 0) {
    return res(ctx.status(404))
  }

  return res(ctx.json(cars))
})

You can also read more about working with URL query parameters and the URLSearchParams](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams) class.

[cmacdonnacha]

Excellent thanks 👍