Proyectos de Subversion LeadersLinked - SPA

import React, { useMemo, useState } from 'react'

import { useNavigate } from 'react-router-dom'

import { useDispatch, useSelector } from 'react-redux'

import { axios } from '@app/utils'

import { addNotification } from '@app/redux/notification/notification.actions'

import { showReportModal } from '@app/redux/report/report.actions'

import { fetchFeeds } from '@app/redux/feed/feed.actions'

import Widget from '@components/UI/Widget'

import Options from '@components/UI/Option'

import ConfirmModal from '@components/modals/ConfirmModal'

export default function FeedHeader({ id }) {

  const [showConfirmModal, setShowConfirmModal] = useState(false)

  const labels = useSelector(({ intl }) => intl.labels)

  const navigate = useNavigate()

  const dispatch = useDispatch()

  const { timelineUrl, currentPage } = useSelector(({ feed }) => feed)

  const {

    feed_delete_url: deleteUrl,

    feed_abuse_report_url: reportUrl,

    owner_image: image,

    owner_name: name,

    owner_time_elapse: timeElapse,

    owner_url: profileUrl

  } = useSelector(({ feed }) => feed.feeds.byId[id])

  const deleteFeed = async () => {

    try {

      const response = await axios.post(deleteUrl)

      const { data, success } = response.data

      if (!success) {

        throw new Error('Ha ocurrido un error al eliminar la publicación')

      }

      dispatch(deleteFeed(id))

      dispatch(addNotification({ style: 'success', msg: data }))

      toggleConfirm()

    } catch (error) {

      dispatch(addNotification({ style: 'danger', msg: error.message }))

    }

  }

  const reportFeed = () =>

    dispatch(

      showReportModal({

        type: 'publicación',

        reportUrl,

        onComplete: () => dispatch(fetchFeeds(timelineUrl, currentPage))

      })

    )

  const toggleConfirm = () => setShowConfirmModal(!showConfirmModal)

  const options = useMemo(() => {

    const defaultOptions = []

    if (deleteUrl) {

      defaultOptions.push({ action: toggleConfirm, label: labels.delete })

    }

    if (reportUrl) {

      defaultOptions.push({

        action: () => reportFeed(reportUrl),

        label: 'Reportar'

      })

    }

    return defaultOptions

  }, [deleteUrl, reportUrl])

  return (

    <>

      <Widget.Header

        avatar={image}

        title={name}

        onClick={() => navigate(profileUrl)}

        subheader={timeElapse}

        renderAction={() =>

          options.length ? <Options options={options} right='.5rem' /> : null

        }

      />

      <ConfirmModal

        show={showConfirmModal}

        onClose={toggleConfirm}

        onAccept={deleteFeed}

      />

    </>

  )

}