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>
    )
}