import {useShopActions} from '../../internal/useShopActions'

import {LongPressDetector} from './long-press-detector'

export function ContentMonitor({
  publicId,
  children,
}: {
  publicId?: string
  children: React.ReactNode
}) {
  const {showFeedbackSheet} = useShopActions()

  return (
    <LongPressDetector
      onLongPress={() => {
        if (!publicId) return

        showFeedbackSheet({publicId})
      }}
    >
      {children}
    </LongPressDetector>
  )
}