import * as React from "react"
import {type LayoutChangeEvent, PixelRatio} from "react-native"
import {type SharedValue, useSharedValue} from "react-native-reanimated"

function roundAndReplace(sv: SharedValue<number | null>, v: number) {
    const roundedV = PixelRatio.roundToNearestPixel(v)
    if (roundedV !== sv.get()) sv.set(roundedV)
}

/**
 * A helper hook for providing shared values for onLayout measurements.
 */
export function useLayoutSharedValue<
    T extends number | null = number | null,
    Y extends number | null = number | null,
>(defaultHeight?: T, defaultY?: Y) {
    const heightSharedValue = useSharedValue<number | null>(
        typeof defaultHeight === "number" ? defaultHeight : null
    )
    const ySharedValue = useSharedValue<number | null>(
        typeof defaultY === "number" ? defaultY : null
    )

    const onLayout = React.useCallback((evt: LayoutChangeEvent) => {
        roundAndReplace(heightSharedValue, evt.nativeEvent.layout.height)
        roundAndReplace(ySharedValue, evt.nativeEvent.layout.y)
    }, [])

    return {
        height: heightSharedValue as unknown as SharedValue<
            T extends null ? number | null : number
        >,
        y: ySharedValue as unknown as SharedValue<Y extends null ? number | null : number>,
        onLayout,
    }
}