How to type parseAsArrayOf

[giannif]

It looks like parseAsArrayOf<T>(parseAsString) should return T[] but it doesn't seem to work in practice. It's string[]. Is using parseAsString the wrong argument?

I can make my own parser to define a type,

type Letter = 'A' | 'B'
const letterParse = createParser({
    parse: (query: string) => query as Letter,
    serialize: (value: Letter) => value,
})

but it seems like that is the intent of the generic in parseAsArrayOf<T>

[franky47]

parseArrayOf will return an array of the type returned by the item parser passed in argument, so if you pass it parseAsString, it will return an array of strings.

Looks like what you are trying to do is make sure a particular string conforms to a set of literals, like 'A' or 'B'. For this, I would recommend updating your custom parser to check at runtime that the incoming query string value actually matches those literals, as blindly type-casting it breaks type-safety assumptions.

const letters = ['A', 'B'] as const
type Letter = typeof letters[number] // 'A' | 'B'
function isLetter(input: string): input is Letter {
  // Ok to type-cast here because we're narrowing
  return letters.includes(input as Letter)
}
const letterParser = createParser({
  parse: query => {
    if (!isLetter(query)) {
      return null
    }
    return query
  },
  serialize: value => value
})

Or, using a schema library like Zod:

import { createParser } from 'nuqs'
import { z } from 'zod'

const letterSchema = z.union([z.literal('A'), z.literal('B')])

const letterParser = createParser({
  parse: query => {
    const result = letterSchema.safeParse(query)
    if (result.success) {
      return result.data
    } else {
      return null
    }
  },
  serialize: value => value
})

[giannif]

Thanks, yeah I already have validation set up. Using a type predicate is a good way to check as well.

I was thrown off by ItemType here. Seemed liked that was supposed to create a parser that returned an array with the ItemType. Actually still not sure what the generic is for if the Parser determines the type

parseAsArrayOf<ItemType>(itemParser: Parser<ItemType>)

[franky47]

Since the Parser argument type is generic, its generic argument type needs to be passed from the function definition itself. Essentially, this is for inference only, and not supposed to be a user-defined type.

While we're on the topic of validation, I just opened an RFC for Zod support, if you don't mind taking a look: #446