RapidSidebarMini
The mini sidebar navigation uses <RapidSidebarMini/> component as its base. Inorder to modify its behaviour using the various available props you can have a look at the above mentioned API documentation. However, for most of the cases you do not need to pass any custom props and can set-up the navigation using the existing structure itself. Let’s see how it can be done.
Modifying the navigation file
RapidAdminReact® comes with a default navigation file which contains the complete structure for creating the navigation and can be modified to create a navigation structure that you need. The navigation.js file can be accessed at the following location.
./config
├── navbars
│ ├── miniProfile.js
│ └── navigation.js
Understanding the structure of the navigation object
The following structure can be used to pass navigation object to generate all the navigation links in the sidebar.
// Import the icons that you want to use in your sidebar elements
import CheckBox from '@material-ui/icons/CheckBoxOutlined';
import Lock from '@material-ui/icons/LockOutlined';
const navigation = [
{
id: 'mmtod',
name: 'Todo',
icon: (<CheckBox />),
link: '/path',
badge: false,
divider: true,
subheader: false
},
{
id: 'mmaut',
name: 'Authentication',
icon: (<Lock />),
link: '/path',
badge: false,
divider: false,
subheader: 'PAGES',
subLinks: [
{
id: 'mmaut1',
name: 'Login',
link: '/path',
icon: false,
badge: false
},
]
}
]
Once you set the object with the required data the navigation is automatically created.
