Utility Types (Solution)

You can find the solution here.

Solution

We can start by making a type that omits accountId.

type UserProps = Omit<UserModel, "accountId">;

If we hover over it, we'll see:

type UserProps = {
  displayName: string;
  isVerified: boolean;
};

Boom. That did the trick. Alternatively, we could do something like this:

type AlternateUserProps = Pick<UserModel, "displayName" | "isVerified">;

Same result.

Copying Props

We can create a type for props out of the prop type of another component—even if we don't have direct access to the type itself.

React.ComponentProps<typeof CurrentUser>

Where Are We Now?

  • examples/30-utility-types-solution
  • projects/utility-types-exercise on the utility-types-solution branch
  • CodeSandbox