diff options
Diffstat (limited to 'src/frontend/app/components/layout/Header.tsx')
| -rw-r--r-- | src/frontend/app/components/layout/Header.tsx | 28 |
1 files changed, 26 insertions, 2 deletions
diff --git a/src/frontend/app/components/layout/Header.tsx b/src/frontend/app/components/layout/Header.tsx index 8235636..4378e59 100644 --- a/src/frontend/app/components/layout/Header.tsx +++ b/src/frontend/app/components/layout/Header.tsx @@ -1,4 +1,6 @@ -import { Menu } from "lucide-react"; +import { ArrowLeft, Menu } from "lucide-react"; +import { Link } from "react-router"; +import { usePageTitleContext } from "~/contexts/PageTitleContext"; import "./Header.css"; interface HeaderProps { @@ -12,10 +14,32 @@ export const Header: React.FC<HeaderProps> = ({ onMenuClick, className = "", }) => { + const { onBack, backTo, titleNode } = usePageTitleContext(); + return ( <header className={`app-header ${className}`}> <div className="app-header__left"> - <h1 className="app-header__title">{title}</h1> + {backTo && ( + <Link + className="app-header__menu-btn" + to={backTo} + aria-label="Atrás" + style={{ marginRight: "8px" }} + > + <ArrowLeft size={24} /> + </Link> + )} + {!backTo && onBack && ( + <button + className="app-header__menu-btn" + onClick={onBack} + aria-label="Atrás" + style={{ marginRight: "8px" }} + > + <ArrowLeft size={24} /> + </button> + )} + {titleNode ? titleNode : <h1 className="app-header__title">{title}</h1>} </div> <div className="app-header__right"> <button |
