React Global State - 조언을 구합니다

import { useState, Dispatch, SetStateAction, useEffect, useId } from "react";

type Setter<T> = Dispatch<SetStateAction<T>> | ((value: T) => void)

/**
 * Create a pod with default value
 * @param value 
 * @returns usePod, value, updater
 */
export function createPod<T>(value: T) {
    const pod = {
        value: value
    };

    const setters: { [key in string]: Setter<T> } = {};

    const updater = (value: T) => {
        pod.value = value;
        for (let key in setters) {
            if (!setters.hasOwnProperty(key)) return;
            setters[key](value);
        }
    }

    const usePod = () => {
        const [value, setValue] = useState(pod.value);
        const key = useId()
        useEffect(() => {
            setters[key] = setValue;
            return () => {
                delete setters[key];
            }
        }, [])

        return [value, updater] as const
    }
    return [usePod, pod.value, updater] as const;
}