|
|
@ -1,21 +1,21 @@ |
|
|
|
import styled from "styled-components"; |
|
|
|
import styled from 'styled-components' |
|
|
|
import { useSelector, useDispatch } from "react-redux"; |
|
|
|
import { useSelector, useDispatch } from 'react-redux' |
|
|
|
// components
|
|
|
|
// components
|
|
|
|
import Snackbar from "components/commons/Snackbar"; |
|
|
|
import Snackbar from 'components/commons/Snackbar' |
|
|
|
// lib
|
|
|
|
// lib
|
|
|
|
import zIndex from "lib/styles/zIndex"; |
|
|
|
import zIndex from 'lib/styles/zIndex' |
|
|
|
import media from "lib/styles/media"; |
|
|
|
import media from 'lib/styles/media' |
|
|
|
// slices
|
|
|
|
// slices
|
|
|
|
import { deleteSnackbar } from "slices/snackbar"; |
|
|
|
import { deleteSnackbar } from 'slices/snackbar' |
|
|
|
// types
|
|
|
|
// types
|
|
|
|
import { RootState } from "slices"; |
|
|
|
import { RootState } from 'slices' |
|
|
|
import { SnackbarState } from "slices/snackbar"; |
|
|
|
import { SnackbarState } from 'slices/snackbar' |
|
|
|
|
|
|
|
|
|
|
|
const SnackbarWrapper = () => { |
|
|
|
|
|
|
|
|
|
|
|
const SnackbarWrapper = ()=> { |
|
|
|
const dispatch = useDispatch(); |
|
|
|
const dispatch = useDispatch(); |
|
|
|
const snackbar = useSelector<RootState, SnackbarState>( |
|
|
|
const snackbar = useSelector<RootState, SnackbarState>(state => state.snackbar); |
|
|
|
(state) => state.snackbar |
|
|
|
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const onClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => { |
|
|
|
const onClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => { |
|
|
|
if (e) { |
|
|
|
if (e) { |
|
|
@ -25,14 +25,15 @@ const SnackbarWrapper = () => { |
|
|
|
dispatch(deleteSnackbar()); |
|
|
|
dispatch(deleteSnackbar()); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<Container> |
|
|
|
<Container> |
|
|
|
{snackbar.text !== "" && ( |
|
|
|
{snackbar.text !== '' && <Snackbar onClick={onClick}
|
|
|
|
<Snackbar onClick={onClick} text={snackbar.text} type={snackbar.type} /> |
|
|
|
text={snackbar.text}
|
|
|
|
)} |
|
|
|
type={snackbar.type} />} |
|
|
|
</Container> |
|
|
|
</Container> |
|
|
|
); |
|
|
|
); |
|
|
|
}; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const Container = styled.div` |
|
|
|
const Container = styled.div` |
|
|
|
position: fixed; |
|
|
|
position: fixed; |
|
|
@ -52,4 +53,4 @@ const Container = styled.div` |
|
|
|
} |
|
|
|
} |
|
|
|
`;
|
|
|
|
`;
|
|
|
|
|
|
|
|
|
|
|
|
export default SnackbarWrapper; |
|
|
|
export default SnackbarWrapper |