import type {FunctionComponent} from 'react'
import TaskForm from '@/components/tasks/taskForm'
import {useLocalSearchParams} from 'expo-router'

const Edit: FunctionComponent = () => {
  // De [taskId] in de naam van de file duidt aan dat deze component één parameter verwacht, het taskId.
  // Het is eveneens mogelijk om meerdere parameters te definiëren, in dat geval moet [...params] genoteerd worden
  // in de filename.

  // Via de useLocalSearchParams hook kunnen de route params opgevraagd worden, eventueel worden ook optionele query
  // parameters teruggeven, deze laatste zullen in deze cursus echter niet gebruikt worden.
  // De hook geeft een object terug waarin een property zit met exact dezelfde naam als in de filenaam.
  // Normaalgezien heeft deze property het string-type, in het gevat de spread operator gebruikt is in de filename,
  // wordt echter een array van string teruggegeven.
  const {taskId} = useLocalSearchParams<{taskId: string}>()

  return <TaskForm id={Number(taskId)} />
}

export default Edit
