⚙️Ubah Menu (Navbar)

Menu navigasi pada aplikasi frontend ini terdapat 2 bagian yaitu bagian landing page (halaman depan) dan juga bagian panel (halaman setelah login/bagian dashboard).

Ubah Menu Navigasi di Landing Page

1. Buka folder frontend\src\landing\components\App

2. Lalu akan muncul file bernama Navbar.js lalu buka file tersebut

3. Cari potongan kode seperti dibawah

<div className={classOne} id="navbarSupportedContent">
    <ul className="navbar-nav">
        <li className="nav-item">
            <NavLink
                exact
                to={`${process.env.PUBLIC_URL}/`}
                activeClassName="active"
                onClick={() => setCollapsed(true)}
                className="nav-link"
            > Beranda </NavLink>
        </li>

        <li className="nav-item">
            <NavLink
                exact
                to={`${process.env.PUBLIC_URL}/pelatihan`}
                activeClassName="active"
                onClick={() => setCollapsed(true)}
                className="nav-link"
            > Pelatihan </NavLink>
        </li>
        //Menu lainnya
    </ul>
</div>

1. Ubah potongan kode tersebut sesuai dengan menu yang diinginkan.

Ubah Menu Navigasi di Panel / Dashboard Pengguna

1. Buka folder frontend\src\admin\layout\menu

2. Buka dan edit file MenuData.js

3. Menu navigasi pada dashboard ini menggunakan generator, sehingga data menu pada file MenuData.js berbentuk array. Contoh potongan kode:

{
    icon: "layers-fill",
    text: "Dataset",
    active: false,
    link: "/admin/datasets",
    role: ["admin.datasets.view"],
    subMenu: [
        // Menu Lainnya
    ],
},

Catatan:

icon = bentuk icon yang akan tampil pada navbar

text = teks pada sebuah menu

active = untuk menandai bahwa menu aktif atau tidak (berisikan true / false dengan nilai default false)

link = suatu alamat jika menu tersebut di klik

role = merupakan hak akses untuk menampilkan sebuah menu (role harus sama dengan yang ada di backend)

subMenu = merupakan sebuah menu turunan