Typescript - función de callback de setState

Estoy tratando de agregar tipos al argumento de una función de callback dentro de una función setState que actualiza su valor anterior (ver más abajo). El argumento "previous" tiene que adherirse al tipo "Previous"; sin embargo, al escribir eso, obtengo el siguiente error:

El argumento de tipo '(previous: Previous) => { oneArg: number; anotherArg: number; }[]' no es asignable al parámetro de tipo '[] | { oneArg: number; anotherArg: number; }[]'. El tipo '(previous: Previous) => { oneArg: number; anotherArg: number; }[]' carece de las siguientes propiedades del tipo '{ oneArg: number; anotherArg: number; }[]': pop, push, concat, join, y 28 más.ts(2345)

¿Alguien podría ayudarme?

type Previous = {
  oneArg: number;
  anotherArg: number;
}[] | [];


type Props = {
setState: (arg: { oneArg: number; anotherArg: number }[] | []) => void;
}

function myFunction(someArg: number) {
    props.setState((previous) => {
      return previous.filter((element, index) => {
          return index !== someArg;
        },
      );
    });
  }

Respuesta #1

Descubrí el problema: Básicamente, el tipo de setState debe provenir de React: Dispatch<SetStateAction<Previous>> donde tienes que realizar la siguiente importación (además de importar useState): import { Dispatch, SetStateAction} from 'react';

La función setState entonces no tendrá problema en tomar ya sea un arreglo de objetos (en este ejemplo) o una función de retorno de llamada como argumento.

Además, como señalaba Damian, | [] en la definición de tipo era innecesario, ya que es una posibilidad implícita de { oneArg: number; anotherArg: number; }[]

Al pasar ahora el cursor sobre el argumento 'previous' en la expresión: props.setCart((previous) => {}), TS infiere que 'previous' es de tipo 'Previous'.

Respuesta #2

Creo que necesitas especificar el tipo de previous. por ejemplo, props.setState((previous: Previous) => {

No estoy seguro de por qué has añadido | []

También habría esperado que usaras el tipo que definiste aquí

type Props = {
setState: (arg: Previous) => void;
}

Por simplicidad, me inclinaría a hacer tu tipo:

type Previous = { oneArg: number; anotherArg: number; }

y luego usándolo de la siguiente manera: setState: (arg: Previous[]) => void;