import { useZocksDispatch, useZocksStore } from '../../app/hooks'
import { selectCurrentMediaDeviceId } from '../../store'
import { setSelectedMediaDevice } from '../../store/mediaDevice/mediaDeviceSlice'
import { useCallback } from 'react'

export const useSelectMediaDevice = (deviceKind: MediaDeviceKind) => {
  const dispatch = useZocksDispatch()
  const selectedMediaDeviceId = useZocksStore((state) => selectCurrentMediaDeviceId(state, deviceKind))

  const selectMediaDevice = useCallback(
    (deviceId: string | null) => dispatch(setSelectedMediaDevice({ kind: deviceKind, deviceId })),
    [dispatch, deviceKind]
  )

  return {
    selectedMediaDeviceId,
    selectMediaDevice,
  }
}
