Simplified value change trace hook for debugging purposes

useTraceUpdate.ts

const useTraceUpdate = <T extends Record<string, unknown>>(props: T) => {
    const prev = useRef(props);
    useEffect(() => {
        const changedProps = Object.entries(props).reduce(
            (ps, [k, v]) => {
                if (prev.current[k] !== v) {
                    ps[k] = [prev.current[k], v];
                }
                return ps;
            },
            {} as Record<string, unknown>
        );
        if (Object.keys(changedProps).length > 0) {
            console.log('Changed props:', changedProps);
        }
        prev.current = props;
    });
};