Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 2173 Rev 3584
Línea 1... Línea 1...
1 
import React, { useEffect } from 'react'
 1 
import React, { useEffect } from 'react';
2 
import { useDispatch } from 'react-redux'
 2 
import { useDispatch } from 'react-redux';
3 
import { Alert } from 'react-bootstrap'
 - 
 
4 
import { styled } from '@mui/material'
 3 
import { Alert, styled } from '@mui/material';
Línea 5... Línea 4...
5 
 
 4 
 
Línea 6... Línea 5...
6 
import { removeNotification } from '@app/redux/notification/notification.actions'
 5 
import { removeNotification } from '@app/redux/notification/notification.actions';
7 
 
 6 
 
8 
const AlertContainer = styled(Alert)`
 7 
const AlertContainer = styled(Alert)`
9 
  &.alert {
 8 
  &.alert {
Línea 34... Línea 33...
34 
    }
 33 
    }
35 
    100% {
 34 
    100% {
36 
      opacity: 0;
 35 
      opacity: 0;
37 
    }
 36 
    }
38 
  }
 37 
  }
39 
`
 38 
`;
40 
const AlertComponent = ({ notification }) => {
 39 
const AlertComponent = ({ notification }) => {
41 
  const { id, style, msg } = notification
 40 
  const { id, style, msg } = notification;
42 
  const dispatch = useDispatch()
 41 
  const dispatch = useDispatch();
- 
 
 42 
  const severity = style === 'danger' ? 'error' : style;
- 
 
 43 
  const color = style === 'danger' ? 'error' : style;
Línea 43... Línea 44...
43 
 
 44 
 
Línea 44... Línea 45...
44 
  let closeTimeOut = null
 45 
  let closeTimeOut = null;
45 
 
 46 
 
46 
  useEffect(() => {
 47 
  useEffect(() => {
47 
    closeTimeOut = setTimeout(() => {
 48 
    closeTimeOut = setTimeout(() => {
Línea 48... Línea 49...
48 
      dispatch(removeNotification(id))
 49 
      dispatch(removeNotification(id));
49 
    }, 3000)
 50 
    }, 3000);
50 
 
 51 
 
51 
    return () => {
 52 
    return () => {
Línea 52... Línea 53...
52 
      clearTimeout(closeTimeOut)
 53 
      clearTimeout(closeTimeOut);
53 
    }
 54 
    };
54 
  }, [])
 55 
  }, []);
55 
 
 56 
 
56 
  return (
 57 
  return (
57 
    <AlertContainer variant={style} className='alert' transition>
 58 
    <AlertContainer variant='filled' severity={severity} color={color}>
Línea 58... Línea 59...
58 
      <p>{msg}</p>
 59 
      {msg}