App Global Search

Menyetel Pencarian Utama pada Navbar

  1. Setel Global Search Url di Aplikasi Console Developer pada menu Role yang memungkinkan pengaturan pencarian berbeda untuk setiap role. Pastikan Url bisa diakses dengan metode GET. misal: "http://domaincontoh.id/search".

  2. Jika Url sudah di setel, ketika pencarian pada navbar di ketik (misal "abc") maka aplikasi akan langsung melakukan request ke url yang kamu setel tersebut dengan tambahan argument sesuai value yang diketik seperti ini: "http://domaincontoh.id/search?query=abc".

  3. Struktur respon data dari url harus berupa array yang memiliki group key "groupTitle", dan array item nya dengan kunci "data". kunci wajib dalam array "data" adalah "title". Contoh struktur datanya seperti ini:

[
    {
        "groupTitle": 'Category 1',
        "data": [
            {
                "title": "Search Result 1",
                "link": "/dyn_pages/dashboard",
                "icon": "fontAwesome:hashtag",
                "text_right": "10:50"
            },
            {
                "title": "Search Result 2",
                "subtitle": "Search Result 2 subtitle text",
                "link": "/dyn_pages/testpage1",
                "icon": "material:settings",
                "text_right": "Test"
            },
            {
                "title": "Search Result 3",
                "link": "/dyn_pages/testpage2",
                "img": "https://res.cloudinary.com/ddfd/dssss.jpg",
            },
        ]
    },
    {
        "groupTitle": 'Category 2',
        "data": [
            {
                "title": "Search Result 4",
                "subtitle": "Search Result 4 subtitle text",
                "link": "https://react-select.com/home",
                "icon": "material:group"
            },
            {
                "title": "Search Result 5",
                "link": "/dyn_pages/_admin_/apps",
                "img": "https://res.cloudinary.com/ddfd/dss.jpg",
                "icon": "feather:Cpu"
            }
        ]
    },
    {
        "groupTitle": 'Files',
        "data": [
            {
                "title": "Search Result File 1",
                "subtitle": "Search Result 4 subtitle text",
                "link": "https://react-select.com/home.pdf",
            },
            {
                "title": "Search Result File 2",
                "subtitle": "Search Result 4 subtitle text",
                "link": "https://react-select.com/home.xlsx",
            },
        ]
    }
]

Last updated