watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-10 15:47:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Fixed chart legend not rendering.

Browse source
This commit is contained in:
Mike Cao 2024-03-08 19:32:00 -08:00
parent 35fde36b61
commit dfe7a573fa
2 changed files with 25 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/components/metrics/Legend.tsx
View file

@ -6,38 +6,34 @@ import { useLocale } from 'components/hooks';
import { useForceUpdate } from 'components/hooks';
import styles from './Legend.module.css';
export function Legend({ chart }) {
export function Legend({
items = [],
onClick,
}: {
items: any[];
onClick: (index: number) => void;
}) {
const { locale } = useLocale();
const forceUpdate = useForceUpdate();
const handleClick = (index: string | number) => {
const meta = chart.getDatasetMeta(index);
meta.hidden = meta.hidden === null ? !chart.data.datasets[index].hidden : null;
chart.update();
forceUpdate();
};
useEffect(() => {
forceUpdate();
}, [locale, forceUpdate]);
if (!chart?.legend?.legendItems.find(({ text }) => text)) {
if (!items.find(({ text }) => text)) {
return null;
}
return (
<div className={styles.legend}>
{chart.legend.legendItems.map(({ text, fillStyle, datasetIndex, hidden }) => {
{items.map(({ text, fillStyle, datasetIndex, hidden }) => {
const color = colord(fillStyle);
return (
<div
key={text}
className={classNames(styles.label, { [styles.hidden]: hidden })}
onClick={() => handleClick(datasetIndex)}
onClick={() => onClick(datasetIndex)}
>
<StatusLight color={color.alpha(color.alpha() + 0.2).toHex()}>
<span className={locale}>{text}</span>