hooks.macro
hooks.macro copied to clipboard
Create a generic form
If someone writes a useCoolMemo
hook which has a similar signature of useMemo
, there should be a generic macro which gives access to the inputs array. A proposed syntax is:
import { auto } from 'hooks.macro';
useCoolMemo(someOtherArg, ...auto(() => x * y));
Which could become:
useCoolMemo(someOtherArg, ...[
() => x * y,
[x, y]
]);
Special cases
We could also treat some special cases in a different way for performance reasons.
Array destructuring
const [ impl, inputs ] = auto(() => x * y);
Becomes:
const impl = () => x * y;
const inputs = [x, y];
Arguments spread
useSomething(...auto(() => x * y));
Becomes:
useSomething(() => x * y, [x, y]);
I think a "keyword" could be kind of cool too. Another thing to consider is that some hooks accept more than one function. We need to gather some function signatures of hooks in the wild to determine the best approach.
import { auto } from 'hooks.macro'
customHook(() => {
foo()
bar()
}, () => {
baz()
}, auto)
customHook(() => {
foo()
bar()
}, () => {
baz()
}, [foo, bar, baz])
I have taken a look at how hooks in the wild and this was a more common use case than having all dependencies in one array:
useCustomHook(funcA, depsA, funcB, depsB)
Maybe a more specific macros would be better? (as this is hard generalize)
import { injectAfterEach, injectAfterAll, skip } from 'hooks.macro'
injectAfterEach(useCustomHook(funcA, funcB, skip(cleanup)))
What do you think? Alternately, auto()
could just collect dependencies for the preceeding function as in useCustomHook(funcA, auto, funcB, auto)
.