const loadedDate = fuel?.date
    ? parse(fuel.date, 'dd-MM-yyyy', new Date())
    : undefined

  const [errors, setErrors] = useState<string[] | undefined>(undefined)
  const [driverId, setDriverId] = useState<string | undefined>(fuel?.driverId)
  const [value, setValue] = useState<number | string>(fuel?.value || '')
  const [date, setDate] = useState<Date | undefined>(loadedDate)

  const closeRef = useRef<ElementRef<'button'>>(null)

  const onSubmit = async (id: string | null) => {
    if (!date) {
      setErrors(['Data inválida.'])
      return
    }

    const dto = {
      date: format(date, 'dd-MM-yyyy'),
      truckId: truckId!,
      driverId: driverId!,
      value: Number(value)
    }

    const response = await saveOrUpdate(dto, id)

    if (response?.type === 'success') {
      toaster.send(response)
      closeRef.current?.click()
    }
  }

  const submitFn = fuel
    ? onSubmit.bind(null, fuel.id)
    : onSubmit.bind(null, null)

  return (
        <form action={submitFn}>
          <div className='flex flex-col gap-3'>
            <Label>Data</Label>
            <DatePicker className='w-full' date={date} onSelect={setDate} />

            <Label>Motorista</Label>
            <Combobox
              className='min-w-full'
              value={driverId}
              onSelect={setDriverId}
              items={driversItems}
              searchPlaceholder='Pesquisar motorista...'
              noResultsMsg='Nenhum motorista encontrado'
              selectItemMsg='Selecione um motorista'
            />

            // Truck input here

            <Label htmlFor='value'>Valor</Label>
            <MoneyInput
              className='w-full'
              name='value'
              placeholder='Valor do abastecimento'
              value={value}
              setValue={setValue}
            />
          </div>
// Other