import {AuthGate} from '@/components/auth-gate'
import {PagedVirtualListScreen} from '@/components/paged-virtual-list-screen'
import {TrailRow} from '@/components/trail-list'
import {useAuth} from '@/stores/auth'
import {trailsList} from '@/stores/trails'

export default function TrailsScreen() {
  return (
    <AuthGate>
      <TrailsScreenInner />
    </AuthGate>
  )
}

function TrailsScreenInner() {
  const user = useAuth((s) => s.user)
  return (
    <PagedVirtualListScreen
      resource={trailsList}
      renderItem={(trail) => (
        <TrailRow trail={trail} currentUserId={user?.id} />
      )}
      emptyMessage="No trails yet"
    />
  )
}
