Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */

import React from 'react'

import { useDispatch } from 'react-redux'

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

import { axios } from '../../../../utils'

const GroupInfo = ({

    group_uuid = '',

    image = '',

    name = '',

    accessibility = '',

    total_members = '',

    link_inmail = '',

    link_accept = '',

    link_cancel = '',

    link_request = '',

    link_leave = '',

    onComplete = function () { }

}) => {

    const dispatch = useDispatch()

    const handleGroupActions = (url) => {

        axios.post(url)

            .then(({ data }) => {

                if (!data.success) {

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

                    return

                }

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

                onComplete()

            })

            .catch(err => console.log('>>: err > ', err))

    }

    return (

        <div className="user_profile border-gray overflow-hidden m-0 p-1 mb-2">

            <div className="user-pro-img">

                <img

                    src={`/storage/type/group/code/${group_uuid}/${image ? `filename/${image}` : ""}`}

                    alt="profile-image"

                />

            </div>

            <div className="user_pro_status">

                <h1 className="font-weight-bold" style={{ fontSize: '1.5rem' }} >{name}</h1>

                <ul className="flw-status">

                    <div className="container horizontal-list">

                        <div className="row ">

                            {link_inmail &&

                                <a

                                    href={link_inmail}

                                    className="btn btn-primary"

                                >

                                    Contactar con el Administrador

                                </a>

                            }

                            <div className="members_count">

                                <b style={{ fontSize: '1rem' }} >{total_members}</b>

                                <p>Miembros</p>

                            </div>

                            {link_accept &&

                                <button

                                    onClick={() => handleGroupActions(link_accept)}

                                    className="btn btn-primary"

                                >

                                    Aceptar invitacion

                                </button>

                            }

                            {link_cancel &&

                                <button

                                    onClick={() => handleGroupActions(link_cancel)}

                                    className="btn btn-primary"

                                >

                                    Cancelar invitacion

                                </button>

                            }

                            {(!link_request && link_leave) &&

                                <button

                                    onClick={() => handleGroupActions(link_leave)}

                                    className="btn btn-primary"

                                >

                                    Abandonar grupo

                                </button>

                            }

                            {link_request &&

                                <button

                                    onClick={() => handleGroupActions(link_request)}

                                    className="btn btn-primary"

                                >

                                    {accessibility === 'Auto unirse' ? 'Unirse' : 'Solicitar membresia'}

                                </button>

                            }

                        </div>

                    </div>

                </ul>

            </div>

        </div>

    )

}

export default GroupInfo