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={2}>
        <Grid item 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 item sx={12} md={8}>
          <Outlet />
        </Grid>
      </Grid>
    </>
  )
}