I want to create this hook in React (ts)
import { useState, useDeferredValue, useEffect } from "react";type InitialValue<T> = T | (() => T);function getStoredValue<T>(key: string, initialValue: InitialValue<T>) { const savedValue = localStorage.getItem(key); if (savedValue) return JSON.parse(savedValue) as T; // return initialValue instanceof Function ? initialValue() : initialValue; return typeof initialValue === "function" ? initialValue() : initialValue;}export default function useLocalStorage<T>(key: string, _default_value: InitialValue<T>) { const [value, setValue] = useState(() => getStoredValue(key, _default_value)); const deferredValue = useDeferredValue(value); useEffect(() => { if (deferredValue) localStorage.setItem(key, JSON.stringify(deferredValue)); console.log("saved"); }, [deferredValue]); return [value, setValue] as const;}
how can i check for the type of initialValue
in getStoredValue
function
if i use initialValue instanceof Function
it works
but if i use typeof initialValue === "function"
i get this red-underline under initialValue()
that says:
This expression is not callable. Not all constituents of type '(() => T) | (T & Function)' are callable. Type 'T & Function' has no call signatures.ts(2349)
i think to use typeof is better but why i get such a message from typescript