12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 |
- import Stack from '@mui/material/Stack';
- import IconButton from '@mui/material/IconButton';
- import SearchIcon from '@mui/icons-material/Search';
- import PhoneIcon from '@mui/icons-material/Phone';
- import { makeStyles } from '@material-ui/core'
- import { useDispatch } from 'react-redux';
- import { useState,useRef } from 'react';
- import MenuList from './MenuList'
- import DeleteModal from './DeleteModal';
- import CallModal from './CallModal';
- import { actionRightIsOpen } from '../../../../../redux/control/action'
- const useStyles = makeStyles({
- container: {
- marginLeft: 20,
- display: 'flex',
- alignContent: 'center',
- alignItems:'center'
- },
- })
- interface IButtons {
- setIsSomeSelected: React.Dispatch<React.SetStateAction<boolean>>,
- }
- const Buttons = ({setIsSomeSelected}:IButtons) => {
- const classes = useStyles()
- const dispatch = useDispatch()
- const shareRef = useRef<any>(null)
- const videoRef = useRef<any>(null)
- const [modalDelete, setModalDelete] = useState<boolean>(false)
- const [modalCall, setModalCall] = useState<boolean>(true)
- const handleOpenSearch = (e: any) => {
- e.stopPropagation()
- dispatch(actionRightIsOpen('search'))
- }
- const handleStartCall = (e: any) => {
- e.stopPropagation()
- setModalCall(true)
- }
- return (
- <Stack className={classes.container} direction="row">
- <IconButton onClick={handleOpenSearch} aria-label="delete" size="medium">
- <SearchIcon fontSize='medium'/>
- </IconButton>
- <IconButton onClick={handleStartCall} aria-label="delete" size="medium">
- <PhoneIcon fontSize='medium'/>
- </IconButton>
- <MenuList setModalDelete={setModalDelete} setIsSomeSelected={setIsSomeSelected}/>
- {modalDelete && <DeleteModal setModalDelete={setModalDelete} />}
- {modalCall && <CallModal setModalCall={setModalCall} shareRef={shareRef} videoRef={videoRef}/>}
- </Stack>
- );
- }
- export default Buttons
|