Confused over `rescriptbr/react-query` mutation callbacks

,
1

Is anyone using this library, or have some examples other than the query example on Github? Specifically mutations.

I’m trying to use queryClient.invalidateQueries and queryClient.setQueryData but finding it difficult. When something errors the compiler subsequently explains every function as type props = {} until they compile making it harder to debug.

Rough outline:

let queryClient = ReactQuery.useQueryClient()

let deleteTodoRequest = (id: int): Js.Promise.t<array<todo>> => ...

let deleteTodoMutation = ReactQuery.useMutation({
    mutationFn: deleteTodoRequest,
    mutationKey: ["todos"],
    onSuccess: (todos: array<todo>) => 
        queryClient.invalidateQueries(/* this is where I get confused */),
})

This is probably just my unfamiliarity with Rescript, which when consuming third party dependencies is not an easy thing.

2

Explaining every function as props = {} sounds like a location bug in the compiler. Any chance you could create a minimal reproduction for that?

3

Hello, sorry for the late reply.

Edit: For this happening in all functions, I can’t reliably replicate it in a reproduction :confused:

The easiest way to replicate it is by creating a simple component:

@react.component
let make = (~text: string) => {
  <div> {text->React.string} </div>
}

And then hovering over the prop from caller:

<Component text={"Hello World"}/>

rescript-vscode reads the component as:

React.component<Component.props<string>>
 
type React.component<'props> = Jsx.component<'props>
Go to: Type definition

type Component.props<'text> = {text: 'text}
Go to: Type definition

But the prop as:

type props = {}`

I’d happily write an issue for the compiler repo if wanted :slight_smile: