Rev 3694 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
import React from 'react';
import { useNavigate } from 'react-router-dom';
import Add from '@mui/icons-material/Add';
import NavigateBefore from '@mui/icons-material/NavigateBefore';
import { Button, styled, Typography, Box, IconButton } from '@mui/material';
const Header = styled('div')(() => ({
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center'
}));
export function PageHeader({ title = '', labelAdd = 'Agregar', goBack = false, onAdd }) {
const navigate = useNavigate();
return (
<Header>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
{goBack && (
<IconButton onClick={() => navigate(-1)}>
<NavigateBefore />
</IconButton>
)}
<Typography variant='h1'>{title}</Typography>
</Box>
{onAdd && (
<Button variant='contained' startIcon={<Add />} onClick={onAdd}>
{labelAdd}
</Button>
)}
</Header>
);
}