Rev 3694 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
import React from 'react';
import { useNavigate } from 'react-router-dom';
import { Box, IconButton, Typography } from '@mui/material';
import NavigateBefore from '@mui/icons-material/NavigateBefore';
export default function PageHeader({ title = '', goBack = false, action = () => null }) {
const navigate = useNavigate();
const navigateBefore = () => navigate(-1);
return (
<Box
sx={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
gap: 2,
marginBottom: 1,
paddingX: 1
}}
>
<Box
sx={{
display: 'flex',
alignItems: 'center',
gap: ({ spacing }) => spacing(0.5)
}}
>
{goBack && (
<IconButton onClick={navigateBefore}>
<NavigateBefore />
</IconButton>
)}
<Typography variant='h1'>{title}</Typography>
</Box>
{action()}
</Box>
);
}