Mutability 12 exercises

Using a Type Helper to Create Read-only Properties

In this exercise, we have a handleSearchParams function. This function consumes a search object that consists of several potential search parameters. These parameters include:

type SearchParams = {
q?: string;
page?: number;
pageSize?: number;
sort?: string;
order?: "asc" | "desc

Loading exercise


00:00 We have a handleSearchParams function, which takes in a search object of potential search params. We have, I've seen a bunch of these before. We have Q, which might be like a query, a page, page size, sort and order. And all of these are, first of all, all optional.

00:17 But we also want them to be read-only, because it does not make sense for you to be able to mutate these since they come from the URL. They're going to be a source of truth up there. So we should really have like a bunch of different errors down here telling us they should not be able to modify read-only, right? So all of these should not be able to be mutated.

00:37 Now, of course, we could go up and sort of add read-only onto all of these. That's nice. But there is a type helper that can help us out, which can apply itself to search params and make sure that all of the properties are read-only. Good luck in trying to find it.