Proyectos de Subversion LeadersLinked - SPA

import React from "react";
import { useNavigate } from "react-router-dom";
import { Avatar, Button, Typography } from "@mui/material";
import { useDispatch } from "react-redux";
import parse from "html-react-parser";

import { axios } from "@app/utils";
import { addNotification } from "@app/redux/notification/notification.actions";

import Widget from "@components/UI/Widget";

export default function CompanyWidget({
  company: {
    cover,
    name,
    image,
    overview,
    link_contact,
    link_unfollow,
    link_follow,
    link_request,
    link_accept,
    link_cancel,
    link_reject,
    link_leave,
  },
  refetch = () => {},
}) {
  const dispatch = useDispatch();
  const navigate = useNavigate();

  const handleButtonAction = async (link) => {
    const response = await axios.post(link);
    const { success, data } = response.data;
    if (success) {
      dispatch(addNotification({ style: "success", msg: data }));
      refetch();
    } else {
      dispatch(
        addNotification({ style: "danger", msg: "ha ocurrido un error" })
      );
    }
  };

  return (
    <Widget>
      <Widget.Media height={150} src={cover} />

      <Widget.Body>
        <Avatar
          src={image}
          alt={name}
          sx={{ mt: "-40px", width: "80px", height: "80px" }}
        />
        <Typography variant="h2">{name}</Typography>
        <Typography variant="body1">{parse(overview ?? "")}</Typography>
      </Widget.Body>

      <Widget.Actions>
        {link_contact && (
          <Button color="primary" onClick={() => navigate(link_contact)}>
            Mensaje
          </Button>
        )}
        {link_unfollow && (
          <Button
            color="secondary"
            onClick={() => handleButtonAction(link_unfollow)}
          >
            Dejar de seguir
          </Button>
        )}
        {link_follow && (
          <Button
            color="primary"
            onClick={() => handleButtonAction(link_follow)}
          >
            Seguir
          </Button>
        )}
        {link_request && link_unfollow && (
          <Button
            color="secondary"
            onClick={() => handleButtonAction(link_request)}
          >
            ¿Trabaja en esta empresa?
          </Button>
        )}
        {link_accept && (
          <Button
            color="primary"
            onClick={() => handleButtonAction(link_accept)}
          >
            Aceptar
          </Button>
        )}
        {link_cancel && (
          <Button color="info" onClick={() => handleButtonAction(link_cancel)}>
            Cancelar
          </Button>
        )}
        {link_reject && (
          <Button color="info" onClick={() => handleButtonAction(link_reject)}>
            Rechazar
          </Button>
        )}
        {link_leave && (
          <Button
            color="secondary"
            onClick={() => handleButtonAction(link_leave)}
          >
            Abandonar esta empresa
          </Button>
        )}
      </Widget.Actions>
    </Widget>
  );
}