Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

import React from 'react';

import { useSelector } from 'react-redux';

import { useSelector } from 'react-redux';

import { styled } from '@mui/material';

import { styled } from '@mui/material';

import AlertComponent from './AlertComponent';

import AlertComponent from './AlertComponent';

const NotificationDiv = styled('div')(({ theme }) => ({

const NotificationDiv = styled('div')(({ theme }) => ({

  position: 'fixed',

  position: 'fixed',

  top: '1rem',

  top: '1rem',

  left: '50%',

  left: '50%',

  transform: 'translateX(-50%)',

  transform: 'translateX(-50%)',

  display: 'flex',

  display: 'flex',

  flexDirection: 'column',

  flexDirection: 'column',

  gap: theme.spacing(0.5),

  gap: theme.spacing(0.5),

  justifyContent: 'center',

  justifyContent: 'center',

  alignItems: 'center',

  alignItems: 'center',

  zIndex: 2200

  zIndex: 2200

}));

}));

const NotificationAlert = () => {

const NotificationAlert = () => {

  const notifications = useSelector(({ notification }) => notification.notifications);

  const notifications = useSelector(({ notification }) => notification.notifications);

  return (

  return (

    <NotificationDiv>

    <NotificationDiv>

      {notifications.map((notification) => (

      {notifications.map((notification) => (

        <AlertComponent notification={notification} key={notification.id} />

        <AlertComponent notification={notification} key={notification.id} />

      ))}

      ))}

    </NotificationDiv>

    </NotificationDiv>

  );

  );

};

};

export default NotificationAlert;

export default NotificationAlert;