Rev 3694 | Ir a la última revisión | 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'
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>
)
}