CODEWITHSUNDEEP
reactjsnext.jsrecoiljs
Noob
Noob

Reputation: 1024

React Recoil "Argument of type 'any[]' is not assignable to parameter of type 'never[]"?

I'm following the React Recoil Todo List tutorial, but for some reason their are type errors when following the tutorial and I'm unsure how to satisfy them correctly.

Here is the code:

export const todoListAtom = atom({
  key: 'todoListAtom',
  default: [],
});


export function TodoItem({item}: {item: TodoItem}) {
  const [todoList, setTodoList] = useRecoilState(todoListAtom);
  const index = todoList.findIndex((listItem) => listItem === item);

  const editItemText = ({target: {value}}) => {
    const newList = replaceItemAtIndex(todoList, index, {
      ...item,
      text: value,
    });

    setTodoList(newList);
  };

The type of setTodoList is:

const setTodoList: (valOrUpdater: never[] | ((currVal: never[]) => never[])) => void

enter image description here

Upvotes: 0

Views: 1695

Answers (1)

jsejcksn
jsejcksn

Reputation: 33748

I think that this is what you're looking for. Some of your code is missing, so I created stand-ins for the missing parts:

TS Playground

import {atom, useRecoilState} from 'recoil';

type TodoItem = {
  text: string;
};

function replaceItemAtIndex <T>(array: T[], index: number, newValue: T): T[] {
  return array.map((value, i) => i === index ? newValue : value);
}

export const todoListAtom = atom<TodoItem[]>({
  key: 'todoListAtom',
  default: [],
});

export function TodoItem({item}: {item: TodoItem}) {
  const [todoList, setTodoList] = useRecoilState(todoListAtom);
  const index = todoList.findIndex((listItem) => listItem === item);

  const editItemText = ({target: {value}}: {target: {value: string}}) => {
    const newList = replaceItemAtIndex(todoList, index, {
      ...item,
      text: value,
    });

    setTodoList(newList);
  };

  // ...
}

Upvotes: 1

Related Questions