Setup navigation
Ok, now the most important step. To setup your navigation.
The navigation system is the core of this project. It can point to different data paths in your Firebase. You also have to option to build multilevel menus.
To get started, go in the config file "src/config/app.js". There at the end you will find "exports.navigation"
We have the folowing pages,
- "/" - the dashboard page ("containers/App.js")
- "push" - The push notification page ("containers/Push.js")
- "fireadmin" - the Firebase manager ("containers/Fireadmin.js")
- "firestore" - the Firestore manager ("containers/Firestore.js") - since version 3.0.0
And you can re-use "fireadmin" and "firestore" pages multiple times to build your menu. As for example, we will be building admin panel for a app, that list events per night club in different cities. You can get the demo schema here so you can practice on your own if you want. So lets get started, and explain what each item does.
{
"link": "fireadmin",
"path": "clubs",
"name": "Clubs",
"icon":"room",
"tableFields":["name","description"],
"subMenus":[
{
"link": "fireadmin",
"path": "clubs/skopje/items",
"name": "Skopje",
"icon":"event",
"tableFields":["name","description"]
},{
"link": "fireadmin",
"path": "clubs/sofia/items",
"name": "Sofia",
"icon":"event",
"tableFields":["name","description"],
}
]
},
{
"link": "fireadmin",
"path": "static",
"name": "Cities & Genres",
"icon":"location_city",
"tableFields":["name","description"],
},
{
"link": "firestoreadmin",
"path": "events",
"name": "FireStore Events",
"icon":"event",
"tableFields":["name"],
},
{
"link": "firestoreadmin",
"path": "clubs",
"name": "FireStore Clubs",
"icon":"disco",
"tableFields":["name","description"],
},On the code above, we are displaying 4 menus ( 2 Firebase, 2 Firestore). One with submenus, and 3 normal menu. Each of them, includng the sub menus, have: link,path,name,icon,tableFields.
link - components used, in all cases "firebase" path - Firebase path, ex "clubs/skopje/items" name - Name of the menu, you can name it as you wish icon - Material design icons
tableFields - Array of fields, that should be displayed in the table when viewing the data subMenus - List of sub menus, they have the same elements.