37 lines
976 B
TypeScript
37 lines
976 B
TypeScript
import { TooltipPopup, Icon, Text, Flexbox, Button } from 'react-basics';
|
|
import Icons from 'components/icons';
|
|
import { saveDashboard } from 'store/dashboard';
|
|
import { useMessages } from 'components/hooks';
|
|
|
|
export function DashboardSettingsButton() {
|
|
const { formatMessage, labels } = useMessages();
|
|
|
|
const handleToggleCharts = () => {
|
|
saveDashboard(state => ({ showCharts: !state.showCharts }));
|
|
};
|
|
|
|
const handleEdit = () => {
|
|
saveDashboard({ editing: true });
|
|
};
|
|
|
|
return (
|
|
<Flexbox gap={10}>
|
|
<TooltipPopup label={formatMessage(labels.toggleCharts)} position="bottom">
|
|
<Button onClick={handleToggleCharts}>
|
|
<Icon>
|
|
<Icons.BarChart />
|
|
</Icon>
|
|
</Button>
|
|
</TooltipPopup>
|
|
<Button onClick={handleEdit}>
|
|
<Icon>
|
|
<Icons.Edit />
|
|
</Icon>
|
|
<Text>{formatMessage(labels.edit)}</Text>
|
|
</Button>
|
|
</Flexbox>
|
|
);
|
|
}
|
|
|
|
export default DashboardSettingsButton;
|