ParsersCommunity
Effect Schema Parsers
Use Effect Schema to parse and serialize URL state.
Effect is a popular TypeScript framework, with its own schema validation library: Effect Schema
Effect Schemas have the unique property of encoding two way transformations between different types. This makes them a perfect fit for using in a nuqs parser.
import { createParser } from 'nuqs'
import { Schema, Either, Equal } from 'effect'
function createSchemaParser<T, E extends string>(schema: Schema.Schema<T, E>) {
const encoder = Schema.encodeUnknownEither(schema);
const decoder = Schema.decodeUnknownEither(schema);
return createParser({
parse: (queryValue) => {
const result = decoder(queryValue);
return Either.getOrNull(result);
},
serialize: (value) => {
const result = encoder(value);
return Either.getOrThrowWith(
result,
(cause) =>
new Error(`Failed to encode value: ${value}`, {
cause,
}),
);
},
eq: (a, b) => Equal.equals(a, b),
});
}Example
import { Schema } from 'effect'
class User extends Schema.Class<User>('User')({
name: Schema.String,
age: Schema.Positive
}) {}
const ToBase64UrlEncodedJson = Schema.compose(Schema.StringFromBase64Url, Schema.parseJson())
const schema = Schema.compose(ToBase64UrlEncodedJson, User)
const parser = createSchemaParser(schema).withDefault(new User({ name: 'John Vim', age: 25 }))
const [user, setUser] = useQueryState('user', parser)