Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3596 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3596 Rev 3719
Línea 1... Línea 1...
1 
import React, { useState } from 'react';
 1 
import React, { useState } from 'react';
2 
import { useNavigate } from 'react-router-dom';
 2 
import { useNavigate } from 'react-router-dom';
3 
import { useDispatch } from 'react-redux';
 3 
import { useDispatch } from 'react-redux';
4 
import { Box, Button } from '@mui/material';
 4 
import { Box, Button } from '@mui/material';
5 
 
 5 
 
6 
import { getOnRoom } from '@services/onRoom';
 6 
import { getOnRoom } from '@services/onRoom';
7 
import { addNotification } from '@store/notification/notification.actions';
 7 
import { addNotification } from '@store/notification/notification.actions';
8 
import colors from '@styles/config/colors';
 8 
import colors from '@styles/config/colors';
9 
 
 9 
 
10 
import Spinner from '@components/UI/Spinner';
 10 
import Spinner from '@components/UI/Spinner';
11 
 
 11 
 
12 
export default function AppsNavigation() {
 12 
export default function AppsNavigation() {
13 
  const [loading, setLoading] = useState(false);
 13 
  const [loading, setLoading] = useState(false);
14 
  const dispatch = useDispatch();
 14 
  const dispatch = useDispatch();
15 
  const navigate = useNavigate();
 15 
  const navigate = useNavigate();
16 
 
 16 
 
17 
  const handleOnRoom = async () => {
 17 
  const handleOnRoom = async () => {
18 
    try {
 18 
    try {
19 
      setLoading(true);
 19 
      setLoading(true);
20 
      const onRoomUrl = await getOnRoom();
 20 
      const onRoomUrl = await getOnRoom();
21 
      window.open(onRoomUrl, '_blank');
 21 
      window.open(onRoomUrl, '_blank');
22 
    } catch (error) {
 22 
    } catch (error) {
23 
      dispatch(addNotification({ style: 'danger', msg: error.message }));
 23 
      dispatch(addNotification({ style: 'danger', msg: error.message }));
24 
    } finally {
 24 
    } finally {
25 
      setLoading(false);
 25 
      setLoading(false);
26 
    }
 26 
    }
27 
  };
 27 
  };
28 
 
 28 
 
29 
  return (
 29 
  return (
30 
    <Box
 30 
    <Box
31 
      sx={{
 31 
      sx={{
32 
        position: 'fixed',
 32 
        position: 'fixed',
33 
        top: 0,
 33 
        top: 0,
34 
        left: 0,
 34 
        left: 0,
35 
        height: '100vh',
 35 
        height: '100vh',
36 
        width: '100%',
 36 
        width: '100%',
37 
        backgroundColor: colors.main,
 37 
        backgroundColor: colors.main,
38 
        zIndex: 999,
 38 
        zIndex: 999,
39 
        display: 'flex',
 39 
        display: 'flex',
40 
        flexDirection: 'column',
 40 
        flexDirection: 'column',
41 
        placeContent: 'center',
 41 
        placeContent: 'center',
42 
        gap: '0.5rem',
 42 
        gap: '0.5rem',
43 
        padding: '1rem'
 43 
        padding: '1rem'
44 
      }}
 44 
      }}
45 
    >
 45 
    >
46 
      {loading && <Spinner absolute />}
 46 
      {loading && <Spinner absolute />}
47 
      <Button color='primary' onClick={() => navigate('/microlearning')}>
 47 
      <Button color='primary' onClick={() => navigate('/microlearning')}>
48 
        Micro Aprendizaje
 48 
        Micro Aprendizaje
49 
      </Button>
 49 
      </Button>
50 
      <Button color='primary' onClick={handleOnRoom}>
 50 
      <Button color='primary' onClick={handleOnRoom}>
51 
        On room
 51 
        On room
52 
      </Button>
 52 
      </Button>
53 
      <Button color='primary' onClick={() => navigate('/habits')}>
 53 
      <Button color='primary' onClick={() => navigate('/habits')}>
54 
        Hábitos y competencias
 54 
        Hábitos y competencias
55 
      </Button>
 55 
      </Button>
56 
      <Button color='primary' onClick={() => navigate('/dashboard')}>
 56 
      <Button color='primary' onClick={() => navigate('/dashboard')}>
57 
        Ir al inicio
 57 
        Ir al inicio
58 
      </Button>
 58 
      </Button>
59 
    </Box>
 59 
    </Box>
60 
  );
 60 
  );
61 
}
 61 
}