Repository: pmndrs/zustand
File: tests/basic.test.tsx (TypeScript)

Code before:
      </div>
    )
  }

  // Set an equality checker that always returns false to always re-render.
  const { findByText, rerender } = render(
    <Component equalityFn={() => false} />
  )

  // This will cause a re-render due to the equality checker.
  act(() => setState({ value: 0 }))
  await findByText('renderCount: 2, value: 0')

  // Set an equality checker that always returns true to never re-render.
  rerender(<Component equalityFn={() => true} />)

  // This will NOT cause a re-render due to the equality checker.
  act(() => setState({ value: 1 }))
  await findByText('renderCount: 3, value: 0')
})

it('can call useStore with progressively more arguments', async () => {
  type State = { value: number }
  type Props = {
    selector?: StateSelector<State, number>
    equalityFn?: EqualityChecker<State>
  }

  const useStore = create<State>(() => ({ value: 0 }))
  const { setState } = useStore

  let renderCount = 0
  function Component({ selector, equalityFn }: Props) {
    const value = useStore(selector as any, equalityFn)
    return (
      <div>
        renderCount: {++renderCount}, value: {JSON.stringify(value)}
      </div>
    )
  }

  // Render with no args.
  const { findByText, rerender } = render(<Component />)
  await findByText('renderCount: 1, value: {"value":0}')

  // Render with selector.
  rerender(<Component selector={(s) => s.value} />)
  await findByText('renderCount: 2, value: 0')

  // Render with selector and equality checker.
  rerender(

Review comment (suggestion):
```suggestion
    equalityFn?: EqualityChecker<number>
```
This should reflect real types of the usage. There could be more precise types with union but they can't be properly inferred anyway though.

Code after:
      </div>
    )
  }

  // Set an equality checker that always returns false to always re-render.
  const { findByText, rerender } = render(
    <Component equalityFn={() => false} />
  )

  // This will cause a re-render due to the equality checker.
  act(() => setState({ value: 0 }))
  await findByText('renderCount: 2, value: 0')

  // Set an equality checker that always returns true to never re-render.
  rerender(<Component equalityFn={() => true} />)

  // This will NOT cause a re-render due to the equality checker.
  act(() => setState({ value: 1 }))
  await findByText('renderCount: 3, value: 0')
})

it('can call useStore with progressively more arguments', async () => {
  type State = { value: number }
  type Props = {
    selector?: StateSelector<State, number>
    equalityFn?: EqualityChecker<number>
  }

  const useStore = create<State>(() => ({ value: 0 }))
  const { setState } = useStore

  let renderCount = 0
  function Component({ selector, equalityFn }: Props) {
    const value = useStore(selector as any, equalityFn)
    return (
      <div>
        renderCount: {++renderCount}, value: {JSON.stringify(value)}
      </div>
    )
  }

  // Render with no args.
  const { findByText, rerender } = render(<Component />)
  await findByText('renderCount: 1, value: {"value":0}')

  // Render with selector.
  rerender(<Component selector={(s) => s.value} />)
  await findByText('renderCount: 2, value: 0')

  // Render with selector and equality checker.
  rerender(