src/components/layout/index.tsx

import type {ComponentChildren} from "preact";
import style from "./style.module.scss"
import {Settings} from "preact-feather"
import {Route, routes} from "../../utils/route";

export function Layout(props: {
    breadcrumbs: string,
    title: string,
    setRoute: (route: Route) => void,
    children: ComponentChildren
}) {
    return(
        <div>
            <nav className={style.breadcrumbs}>
                {props.breadcrumbs}
                <div className={style.actions}>
                    <a href="#" title="Paramètres" onClick={e => {
                        e.preventDefault();
                        props.setRoute(routes.settings);
                    }}>
                        <Settings size={18}/>
                    </a>
                </div>
            </nav>
            <h2>{props.title}</h2>
            {props.children}
        </div>
    )
}