Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 4641 | Rev 4652 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 4641 Rev 4645
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React from 'react'
 2 
import React, { useState } from 'react'
3 
import { axios } from '../../../../../utils'
 3 
import { axios } from '../../../../../utils'
4 
import { addNotification } from '../../../../../redux/notification/notification.actions'
 4 
import { addNotification } from '../../../../../redux/notification/notification.actions'
5 
import Avatar from '../../../../../shared/Avatar/Avatar'
 5 
import Avatar from '../../../../../shared/Avatar/Avatar'
6 
import { useDispatch } from 'react-redux'
 6 
import { useDispatch } from 'react-redux'
- 
 
 7 
import CoverModal from '../../../../../shared/profile/edit/cover-section/CoverModal'
- 
 
 8 
import { profileTypes } from '../../../../../shared/profile/Profile.types'
- 
 
 9 
import EditIcon from '@mui/icons-material/EditOutlined'
Línea 7... Línea 10...
7 
 
 10 
 
8 
const GroupActions = ({ cover, groupId, name, image, groupType, linkInmail, actionLinks, accessibility }) => {
 - 
 
- 
 
 11 
const GroupActions = ({ cover, groupId, name, image, groupType, linkInmail, actionLinks, accessibility, imageProfileCover }) => {
- 
 
 12 
    const [modalToShow, setModalToShow] = useState(null)
9 
 
 13 
    const [coverImg, setCoverImg] = useState({ path: `/storage/type/group-cover/code/${groupId}/${cover ? `filename/${cover}` : ""}` })
- 
 
 14 
    const dispatch = useDispatch();
- 
 
 15 
    const PATH = window.location.pathname
- 
 
 16 
 
Línea 10... Línea 17...
10 
    const dispatch = useDispatch();
 17 
    const closeModal = () => setModalToShow(null)
11 
 
 18 
 
12 
    const handleActionLink = (url) => {
 19 
    const handleActionLink = (url) => {
13 
        axios.post(url)
 20 
        axios.post(url)
Línea 20... Línea 27...
20 
            })
 27 
            })
21 
            .catch(err => console.log('>>: err > ', err))
 28 
            .catch(err => console.log('>>: err > ', err))
22 
    }
 29 
    }
Línea 23... Línea 30...
23 
 
 30 
 
24 
    return (
 - 
 
25 
        <div className="group__actions">
 - 
 
26 
            <div className="group__actions-cover">
 - 
 
27 
                <img src={`/storage/type/group-cover/code/${groupId}/${cover ? `filename/${cover}` : ""}`} alt='Profile cover' className='sidebar__cover' />
 31 
    return (
28 
            </div>
 32 
        <>
29 
            <div className="group__actions-body">
 - 
 
30 
                <Avatar imageUrl={`/storage/type/group/code/${groupId}/${image ? `filename/${image}` : ""}`} size='xl' name={name} />
 - 
 
31 
                <h1>{name}</h1>
 - 
 
32 
                <span>{groupType}</span>
 33 
            <div className="group__actions">
33 
                <div className="row" style={{ gap: '.5rem' }}>
 - 
 
34 
                    {linkInmail &&
 34 
                <div className="group__actions-cover">
35 
                        <a href={linkInmail} className="button btn btn-primary">
 - 
 
36 
                            Contactar con el Administrador
 - 
 
37 
                        </a>
 - 
 
38 
                    }
 - 
 
39 
                    {actionLinks?.link_accept &&
 - 
 
40 
                        <button
 - 
 
41 
                            onClick={() => handleActionLink(actionLinks?.link_accept)}
 - 
 
42 
                            className="button btn btn-primary"
 - 
 
43 
                        >
 - 
 
44 
                            Aceptar invitacion
 - 
 
45 
                        </button>
 - 
 
46 
                    }
 - 
 
47 
                    {actionLinks?.link_cancel &&
 - 
 
48 
                        <button
 - 
 
49 
                            onClick={() => handleActionLink(actionLinks?.link_cancel)}
 - 
 
50 
                            className="button btn btn-secondary"
 - 
 
51 
                        >
 - 
 
52 
                            Cancelar invitacion
 - 
 
53 
                        </button>
 - 
 
54 
                    }
 35 
                    <img src={coverImg.path} alt='Profile cover' className='sidebar__cover' />
55 
                    {actionLinks?.link_leave &&
 - 
 
56 
                        <button
 - 
 
57 
                            onClick={() => handleActionLink(actionLinks?.link_leave)}
 36 
                    {PATH.includes('edit') &&
58 
                            className="button btn btn-secondary"
 - 
 
59 
                        >
 - 
 
60 
                            Abandonar grupo
 37 
                        <button className='button-icon cover__edit-btn' onClick={() => setModalToShow('cover')}>
61 
                        </button>
 - 
 
62 
                    }
 - 
 
63 
                    {actionLinks?.link_request &&
 - 
 
64 
                        <button
 - 
 
65 
                            onClick={() => handleActionLink(actionLinks?.link_request)}
 - 
 
66 
                            className="button btn btn-primary"
 - 
 
67 
                        >
 - 
 
68 
                            {accessibility === 'Auto unirse' ? 'Unirse' : 'Solicitar membresia'}
 38 
                            <EditIcon />
69 
                        </button>
 39 
                        </button>
70 
                    }
 40 
                    }
- 
 
 41 
                </div>
- 
 
 42 
                <div className="group__actions-body">
- 
 
 43 
                    <Avatar imageUrl={`/storage/type/group/code/${groupId}/${image ? `filename/${image}` : ""}`} size='xl' name={name} />
- 
 
 44 
                    <h1>{name}</h1>
- 
 
 45 
                    <span>{groupType}</span>
- 
 
 46 
                    <div className="row" style={{ gap: '.5rem' }}>
- 
 
 47 
                        {linkInmail &&
- 
 
 48 
                            <a href={linkInmail} className="button btn btn-primary">
- 
 
 49 
                                Contactar con el Administrador
- 
 
 50 
                            </a>
- 
 
 51 
                        }
- 
 
 52 
                        {actionLinks?.link_accept &&
- 
 
 53 
                            <button
- 
 
 54 
                                onClick={() => handleActionLink(actionLinks?.link_accept)}
- 
 
 55 
                                className="button btn btn-primary"
- 
 
 56 
                            >
- 
 
 57 
                                Aceptar invitacion
- 
 
 58 
                            </button>
- 
 
 59 
                        }
- 
 
 60 
                        {actionLinks?.link_cancel &&
- 
 
 61 
                            <button
- 
 
 62 
                                onClick={() => handleActionLink(actionLinks?.link_cancel)}
- 
 
 63 
                                className="button btn btn-secondary"
- 
 
 64 
                            >
- 
 
 65 
                                Cancelar invitacion
- 
 
 66 
                            </button>
- 
 
 67 
                        }
- 
 
 68 
                        {actionLinks?.link_leave &&
- 
 
 69 
                            <button
- 
 
 70 
                                onClick={() => handleActionLink(actionLinks?.link_leave)}
- 
 
 71 
                                className="button btn btn-secondary"
- 
 
 72 
                            >
- 
 
 73 
                                Abandonar grupo
- 
 
 74 
                            </button>
- 
 
 75 
                        }
- 
 
 76 
                        {actionLinks?.link_request &&
- 
 
 77 
                            <button
- 
 
 78 
                                onClick={() => handleActionLink(actionLinks?.link_request)}
- 
 
 79 
                                className="button btn btn-primary"
- 
 
 80 
                            >
- 
 
 81 
                                {accessibility === 'Auto unirse' ? 'Unirse' : 'Solicitar membresia'}
- 
 
 82 
                            </button>
- 
 
 83 
                        }
- 
 
 84 
                    </div>
71 
                </div>
 85 
                </div>
- 
 
 86 
            </div>
- 
 
 87 
            <CoverModal
- 
 
 88 
                isModalOpen={modalToShow === 'cover'}
- 
 
 89 
                coverType={profileTypes.GROUP}
- 
 
 90 
                groupId={groupId}
- 
 
 91 
                handleCoverSectionModalOpen={() => closeModal()}
- 
 
 92 
                imageSizeCover={imageProfileCover}
- 
 
 93 
                setCoverImg={(newImage) => setCoverImg(newImage)}
72 
            </div>
 94 
            />
73 
        </div>
 95 
        </>
74 
    )
 96 
    )
Línea 75... Línea 97...
75 
}
 97 
}
76 
 
 98