How to define useState nested array types

How I define types for nested array in UseState array

defined interface –

interface ToyProps {
  car: string | null;
  doll: number | null;
}

interface SettingsProps {
  [key: string]: ToyProps[];
}

state –

const [state, setstate]:SettingsProps = React.useState({
  toys: [
    {
      cars: "car 1",
      doll: "doll 1",
    },
    {
        cars: "car 2",
        doll: "doll 3",
    },
  ],
});

I defined in the above way but I still get a type error

Answer

You’re applying the type to the array, which contains both the state object and the state setter function.

Instead, supply it as a type argument to useState:

const [state, setstate] = React.useState<SettingsProps>({
// −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−^^^^^^^^^^^^^^^
    // ...
});

The type argument drives the return type of useState, which will set the types of state and setstate appropriately.