Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import { useNavigate, useParams } from 'react-router-dom'
import { useDispatch } from 'react-redux'

import { useFetch, useGoals } from '@hooks'
import { editGoal } from '@services/habits/goals'
import { addNotification } from '@store/notification/notification.actions'

import PageHeader from '@components/common/page-header'
import GoalForm from '@components/habits/goals/goal-form'
import LoadingWrapper from '@components/common/loading-wrapper'

export default function EditGoalPage() {
  const { id } = useParams()
  const navigate = useNavigate()
  const dispatch = useDispatch()

  const { addUrl, updateGoal, getGoalById } = useGoals()
  const currentGoal = getGoalById(id)

  const { data: goalValues, isLoading } = useFetch(
    currentGoal?.actions.link_edit
  )
  const { data: habits } = useFetch(addUrl)
  const habitsValues = Object.entries(habits).map(([value, name]) => ({
    value,
    name
  }))

  const onSubmit = async (goal) => {
    try {
      const response = await editGoal(currentGoal?.actions.link_edit, goal)
      updateGoal(response.data)
      dispatch(addNotification({ style: 'success', msg: response.message }))
      navigate('/habits/goals')
    } catch (error) {
      dispatch(addNotification({ style: 'danger', msg: error.message }))
    }
  }

  return (
    <>
      <PageHeader title='Editar Meta' goBack />
      <LoadingWrapper loading={isLoading}>
        <GoalForm
          onSubmit={onSubmit}
          habits={habitsValues}
          values={{
            ...goalValues,
            start_date: new Date(goalValues.start_date + 'T00:00:00'),
            end_date: new Date(goalValues.end_date + 'T00:00:00')
          }}
        />
      </LoadingWrapper>
    </>
  )
}