import { PermissionDeniedScreen } from 'src/components/common/PermissionDeniedScreen'
import { StoryCaptureView } from 'src/components/story/StoryCaptureView'
import { StoryPreviewView } from 'src/components/story/StoryPreviewView'
import { StoryUploadingView } from 'src/components/story/StoryUploadingView'
import { PlaybackScope } from 'src/hooks/playback/PlaybackScope'
import { useRequirePixelfed } from 'src/hooks/useRequirePixelfed'
import { useStoryCompose } from 'src/hooks/useStoryCompose'

export default function StoryCompose() {
  return (
    <PlaybackScope name="story:compose">
      <StoryComposeInner />
    </PlaybackScope>
  )
}

function StoryComposeInner() {
  // Mastodon Pass Phase 4 §5.3 — Stories are Pixelfed-only.
  useRequirePixelfed()
  const s = useStoryCompose()

  if (!s.cameraPerm) return null
  if (!s.cameraPerm.granted) {
    return (
      <PermissionDeniedScreen
        kind="camera"
        dark
        title="Camera access is off"
        body="Stories need your camera to capture photos and video."
        onRetry={() => s.requestCameraPerm()}
        onCancel={s.cancel}
      />
    )
  }

  if (s.phase === 'preview' && s.captured) {
    return (
      <StoryPreviewView
        captured={s.captured}
        onRetake={s.resetCapture}
        onPublish={s.publish}
      />
    )
  }

  if (s.phase === 'uploading') {
    return <StoryUploadingView />
  }

  return (
    <StoryCaptureView
      cameraRef={s.cameraRef}
      facing={s.facing}
      flash={s.flash}
      isRecording={s.isRecording}
      ringProgress={s.ringProgress}
      onClose={s.cancel}
      onToggleFlash={s.toggleFlash}
      onToggleFacing={s.toggleFacing}
      onPickFromLibrary={s.pickFromLibrary}
      onTakePhoto={s.takePhoto}
      onStartRecording={s.startRecording}
      onStopRecording={s.stopRecording}
    />
  )
}
