Sidebar

  • To get the default value of sidebar_type or style, navigate to this path src/store/setting/state.ts.
Sidebar Color
  • Property: "theme_style_appearance"
  • Choices: 'sidebar-white', 'sidebar-dark', 'sidebar-color','sidebar-transparent', 'sidebar-glass'
  • Values are in string

Example

"sidebar_color": {"value": "sidebar-white"}
Sidebar Type
  • Property: "sidebar_type"
  • Choices: "sidebar-hover", "sidebar-mini",'sidebar-boxed',"sidebar-soft"
  • Values are in array

Example

"sidebar_type": {"value": []}
Sidebar Menu Style
  • Property: "sidebar_menu_style"
  • Choices:'navs-rounded', 'navs-rounded-all', 'navs-pills', 'navs-pill-all', 'left-bordered', 'navs-full-width'
  • Values are in string

Example

"sidebar_menu_style": {"value": "navs-rounded-all"}
Sidebar Hide
  • Property: "sidebar_show"
  • Choices:"sidebar-none"
  • If you want to default none sidebar, then pass "sidebar-none" as the value in the following code snippet.
  • Values are in array

Example

"sidebar_show": {"value": []}
To get the current value of the following you can use:
  • first import useSelector from react-redux
  • import the selectors files from src/store/setting/selectors in your component.
  • import this file as top of your component using following example code in your component.
import { useSelector } from "react-redux";
import * as SettingSelector from '../store/setting/selectors'
  • then use the following code in your component to get the current value.
Sidebar Color 
const sidebarColor = useSelector(SettingSelector.sidebar_color)
Sidebar Type
const sidebarType = useSelector(SettingSelector.sidebar_type)
Sidebar Menu Style
const sidebarMenuStyle = useSelector(SettingSelector.sidebar_menu_style)
Sidebar Hide
const sidebarHide = useSelector(SettingSelector.sidebar_show);
To use action you can use dispatch to update state.js.
  • first import usedispatch from react-redux.
  • import the actions files from src/store/setting/actons in your component.
  • import this file as top of your component using following example code in your component.
import { useDispatch } from "react-redux";
import { sidebar_color } from "../../../store/setting/actions";
  • then write the following code inside the function component for use of dispatch method inside your component. 
const dispatch = useDispatch();
  • then use the following code in your component to dispatch or change the new value of scheme.
Sidebar Color 
dispatch(sidebar_color(value))
Sidebar Type
dispatch(sidebar_type(value))
Sidebar Menu Style
dispatch(sidebar_menu_style(value))
Sidebar Hide
dispatch(sidebar_show(value))
Previous Next