import { DependencyList, useMemo, useState } from "react";
import { Equal, Expect } from "../helpers/type-utils";
const useCustomState = <TValue>(initial: TValue) => {
const [value, set] = useState<TValue>(initial);
return {
value,
set,
useComputed: <TFactoryReturn>(
factory: (value: TValue) => TFactoryReturn,
deps?: DependencyList
) => {
return useMemo(() => {
return factory(value);
}, [value, ...(deps || [])]);
},
};
};
const Component = () => {
const arrayOfNums = useCustomState([1, 2, 3, 4, 5, 6, 7, 8]);
const reversedAsString = arrayOfNums.useComputed((nums) =>
Array.from(nums).reverse().map(String)
);
type test = Expect<Equal<typeof reversedAsString, string[]>>;
};
- Typescript Inferring Arguments Curried Reacttypescript inferring arguments curried typescript inferring literal basic components typescript arguments passing function compare typescript arguments typescript workspace monorepo react typescript component strongly react react typescript inference fixing typescript component generics react typescript strongly render react react typescript examples useful