lucent-laravel/front/js/svelte/Navbar.svelte

<script>
    import Avatar from "./account/Avatar.svelte";
    import NavbarMenu from "./NavbarMenu.svelte";
    import {getContext} from "svelte";

    export let schema;
    const channel = getContext("channel");
    const user = getContext("user");

    function buildWebsite(e) {
        e.preventDefault();

        axios.post(channel.lucentUrl + "/build").then(response => {
            window.location.href = channel.lucentUrl + "/build-report"
        })

    }
</script>

<nav class="lx-nav">

    <div>

    </div>
    <div>
        <a class="nav-item" href="{channel.lucentUrl}">{channel.name}</a>
        <a class="nav-item" href="{channel.lucentUrl}/members">Members</a>

        {#if channel.generateCommand}
            <button on:click={buildWebsite} class="btn btn-outline-primary btn-sm">Build website</button>
        {/if}
    </div>
    <div>
        <a class="nav-item" href="{channel.lucentUrl}/profile">
            <Avatar side="28" name={user.name}/>
        </a>
    </div>


</nav>

<div class="offcanvas offcanvas-start show border-0 bg-light-subtle" style="padding-top:36px " data-bs-scroll="true"
     data-bs-backdrop="false"
     tabindex="-1" aria-labelledby="offcanvasScrollingLabel">
    <!--        <div class="offcanvas-header">-->
    <!--            <h5 class="offcanvas-title" id="offcanvasScrollingLabel">Content</h5>-->
    <!--        </div>-->
    <div class="offcanvas-body">

        <div class="accordion" id="accordionPanelsStayOpenExample">
            <div class="accordion-item">
                <h2 class="accordion-header" id="panelsStayOpen-headingOne">
                    <button class="accordion-button" type="button" data-bs-toggle="collapse"
                            data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="true"
                            aria-controls="panelsStayOpen-collapseOne">
                        Main
                    </button>
                </h2>
                <div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse show"
                     aria-labelledby="panelsStayOpen-headingOne">
                    <div class="accordion-body">
                        <NavbarMenu
                                schemas={ channel.schemas.filter((sc) => sc.isEntry)}
                                schema={schema}
                        />
                    </div>
                </div>
            </div>
            <div class="accordion-item">
                <h2 class="accordion-header" id="panelsStayOpen-headingTwo">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
                            data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false"
                            aria-controls="panelsStayOpen-collapseTwo">
                        Other
                    </button>
                </h2>
                <div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse"
                     aria-labelledby="panelsStayOpen-headingTwo">
                    <div class="accordion-body">
                        <NavbarMenu
                                schemas={ channel.schemas.filter((sc) => !sc.isEntry)}
                                schema={schema}
                        />
                    </div>
                </div>
            </div>


        </div>
    </div>
</div>