Rename .use to .useQuery (or ./^use[A-Z].*/)

[MoOx]

In short: having to call a function just named use doesn't strictly respect React rules of hooks. The eslint plugin is yelling since it's testing using /^use[A-Z0-9].*$/. I don't expect React team to change their isHookName method for rescript relay use case so first, I am trying to ask for a change here. Is this something possible?

I like to run rules of hooks plugin on my code to avoid issue with hooks deps etc and using rescript relay make it difficult because it's creating unwanted errors.

[zth]

Hey @MoOx! I would like to support this somehow, but I'm not really fond of changing the .use name. Maybe we could find a way to emit suppression comments in the output or similar instead?

[MoOx]

Instead of changing, could we create an alias ? Could be straight forward :)

[zth]

You mean having both use and useQuery? I wouldn't want that because it'd be confusing that both were called the same thing.

However, this all happens in the PPX, so maybe one way is to add config to the PPX itself, so you can do something like hookNames: full | shortened, defaulting to shortened (which is what they are now). That config would be in bsconfig I guess.

[MoOx]

Any way to allow a longer name is good to me. I was thinking about the simpler approach to avoid to much code and maintenance but if you prefer a different road that works for me :) Why do you want to keep this .use name very short by the way ?

[zth]

It's a conscious decision that you should be able to rely on the hooks here being "define your Relay module, and then use it". Given how modules are defined, I think it'd be semantically redundant to have Query.useQuery etc, when you're already writing "Query".

Same goes for anything I do with hooks in ReScript but outside of Relay as well - since it's almost always coming from a module, ModuleName.use() feels a lot better than extending the name with something irrelevant just to satisfy eslint.

Is it not possible to just turn off that naming rule?

[zth]

Also, full disclosure - I'm not likely to work on this anytime soon, but I'd be happy to review and/or help guide if you're interested in taking a stab at it.

[cometkim]

I don't think this is related to rules of hooks, use is actually valid in that rule.

https://github.com/facebook/react/blob/main/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js#L18-L20

However, I think MyQuery.useMyQuery instead MyQuery.use maybe helpful when the query module opened in the scope.

[MoOx]

No, it’s not valid. A capital letter is required :)

[zth]

@MoOx seems it's our lucky day 😆 The ESLint rule seems to allow use if you put it in an experimental mode, now that React is releasing their own use hook 😄 .

https://github.com/facebook/react/blob/main/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js

Closing this optimistically as that's hopefully the solution.