Proyectos de Subversion LeadersLinked - SPA

import React from 'react';
import { Link, useResolvedPath, Outlet } from 'react-router-dom';
import { useSelector } from 'react-redux';
import { Grid } from '@mui/material';

import Widget from '@app/components/UI/Widget';
import TitleSection from '@components/UI/TitleSection';

export default function AccountSettingLayout() {
  const { defaultNetwork } = useSelector(({ auth }) => auth);
  const { pathname } = useResolvedPath('');

  return (
    <>
      <TitleSection title='Configuración de la cuenta' />

      <Grid container spacing={1}>
        <Grid size={{ xs: 12, md: 4 }}>
          <Widget>
            <Widget.Body>
              <div
                style={{
                  display: 'flex',
                  flexDirection: 'column',
                  gap: '0.5rem'
                }}
              >
                <Link to={pathname}>Básica</Link>
                <Link to={`${pathname}/notifications`}>Notificaciones</Link>
                <Link to={`${pathname}/change-password`}>Cambiar clave</Link>
                <Link to={`${pathname}/change-image`}>Cambiar imagen</Link>
                <Link to={`${pathname}/location`}>Ubicación</Link>
                {defaultNetwork === 'y' && (
                  <>
                    <Link to={`${pathname}/privacy`}>Privacidad</Link>

                    {/*  <Link to={`${pathname}/social-networks`}>Redes Sociales</Link> */}

                    <Link to={`${pathname}/close-account`}>Cerrar cuenta</Link>
                  </>
                )}
              </div>
            </Widget.Body>
          </Widget>
        </Grid>

        <Grid size={{ xs: 12, md: 8 }}>
          <Outlet />
        </Grid>
      </Grid>
    </>
  );
}