59 lines
2.1 KiB
JavaScript

import React, { useState } from 'react';
import styles from './style.module.scss';
import logo from '../../img/homePage/downArrow.png';
import { Container, Grid, Button, Typography } from '@mui/material';
import { column } from 'stylis';
import arrow from '../../img/homePage/downArrow.png';
const TableMeets = ({ events }) => {
const [isOpenMap, setIsOpenMap] = useState({});
const toggleDropdown = (eventId) => {
setIsOpenMap((prevIsOpenMap) => ({
...prevIsOpenMap,
[eventId]: !prevIsOpenMap[eventId]
}));
};
return (
// <Container className={styles.meeting__container}>
// <Grid sx={{display: 'flex', flexDirection: 'column'}} container className={styles.meeting__cards}>
// {events.map((event) => (
// <Grid item key={event.id}>
// <Container className={styles.meeting__card}>
// <Typography className={styles.date}>{event.date}</Typography>
// <Typography className={styles.time}>{event.time}</Typography>
// <Typography className={styles.title}>{event.title}</Typography>
// <Button className={styles.meeting__button} onClick={() => toggleDropdown(event.id)}>
// <img src={logo} alt="Logo" />
// </Button>
// <li key={event.id}>
// <div className={styles.meeting__card}>
// <span className={styles.date}>{event.date}</span>
// <span className={styles.time}>{event.time}</span>
// <span className={styles.title}>{event.title}</span>
// <div className={styles.meeting__button} onClick={() => toggleDropdown(event.id)}><img className={styles.meeting__arrow} src={arrow} ></img></div>
// {isOpenMap[event.id] && (
// <Container>
// <Typography>{event.speaker}</Typography>
// <img src={event.avatar} alt={event.speaker} />
// <Typography>{event.description}</Typography>
// </Container>
// )}
// </Container>
// </Grid>
// ))}
// </Grid>
// </Container>
<></>
);
};
export default TableMeets;