QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-15 20:30:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

- Re-shape dashboard icons in 16 and 24 grid.

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2020-06-01 18:22:29 +02:00
parent 2a466ce2da
commit b0d53e4fad
25 changed files with 311 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
client/src/components/Sidebar/SidebarMenu.js
View File

@@ -1,6 +1,6 @@
import React from 'react';
import {Menu, MenuDivider} from "@blueprintjs/core";
import {useHistory, useLocation} from 'react-router-dom';
import { Menu, MenuDivider } from '@blueprintjs/core';
import { useHistory, useLocation } from 'react-router-dom';
import sidebarMenuList from 'config/sidebarMenu';
import Icon from 'components/Icon';
import MenuItem from 'components/MenuItem';
@@ -12,38 +12,45 @@ export default function SidebarMenu() {
const menuItemsMapper = (list) => {
return list.map((item, index) => {
const children = Array.isArray(item.children) ? menuItemsMapper(item.children) : null;
const isActive = (item.href && item.href === location.pathname) ||
(item.children && item.children.some((c) => c.href === location.pathname));
const children = Array.isArray(item.children)
? menuItemsMapper(item.children)
: null;
const isActive =
(item.href && item.href === location.pathname) ||
(item.children &&
item.children.some((c) => c.href === location.pathname));
const handleItemClick = () => {
if (item.href) { history.push(item.href); }
if (item.href) {
history.push(item.href);
}
};
return (
(item.divider) ?
<MenuDivider
key={index}
title={item.title} /> :
<MenuItem
key={index}
active={isActive}
icon={<Icon icon={item.icon} iconSize={item.iconSize} />}
text={item.text}
label={item.label}
disabled={item.disabled}
children={children}
dropdownType={item.dropdownType || 'collapse'}
caretIconSize={15}
onClick={handleItemClick}
callapseActive={!!isActive}
itemClassName={classNames({
'is-active': isActive,
'has-icon': !children && item.icon,
})} />
return item.spacer ? (
<div class="bp3-menu-spacer"></div>
) : item.divider ? (
<MenuDivider key={index} title={item.title} />
) : (
<MenuItem
key={index}
active={isActive}
icon={<Icon icon={item.icon} iconSize={item.iconSize} />}
text={item.text}
label={item.label}
disabled={item.disabled}
children={children}
dropdownType={item.dropdownType || 'collapse'}
caretIconSize={15}
onClick={handleItemClick}
callapseActive={!!isActive}
itemClassName={classNames({
'is-active': isActive,
'has-icon': !children && item.icon,
})}
/>
);
});
};
const items = menuItemsMapper(sidebarMenuList);
return (<Menu className="sidebar-menu">{items}</Menu>);
};
return <Menu className="sidebar-menu">{items}</Menu>;
}