AutorÃa | Ultima modificación | Ver Log |
import {axios} from "../../../utils";
import React, { useEffect, useState } from "react";
import Spinner from "../../../shared/loading-spinner/Spinner";
import styles from "./groupMembers.module.scss";
const GroupMembers = (props) => {
const {
url_add_user_to_group,
url_delete,
url_get_contact_group_list,
url_get_contacts_availables_for_group,
url_leave,
} = props.group;
const [members, setMembers] = useState([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
getMembers();
}, []);
const getMembers = async () => {
setLoading(true);
const response = await axios.get(url_get_contact_group_list);
const resData = response.data;
if (!resData.success) {
return (resData);
}
setMembers(resData.data);
setLoading(false);
};
const handleRemoveMember = async (remove_url) => {
setLoading(true);
const response = await axios.post(remove_url);
const resData = response.data;
if (!resData.success) {
return (resData);
}
await getMembers();
setLoading(false);
};
return (
<div className={styles.groupMembers}>
{members.map(({ image, name, url_remove_from_group }) => (
<li className={styles.entity}>
<img src={image} alt="user_image" />
<span className={styles.entityName}>{name}</span>
<div className={styles.entityOptions}>
{url_remove_from_group && (
<i
className={`fa fa-user-times ${styles.danger}`}
onClick={() => handleRemoveMember(url_remove_from_group)}
></i>
)}
</div>
</li>
))}
{loading && (
<div className="spinner-container">
<Spinner />
</div>
)}
</div>
);
};
export default GroupMembers;