Files
encoach_ui_odoo19/src/components/UserResultChart.tsx
Tiago Ribeiro 02d76e4c3c Created the stats page where a user can select another user to view their stats;
Improved the whole stats and the home page
2023-04-20 22:43:30 +01:00

31 lines
825 B
TypeScript

import {SEMI_TRANSPARENT} from "@/resources/colors";
import {Chart as ChartJS, RadialLinearScale, ArcElement, Tooltip, Legend} from "chart.js";
import clsx from "clsx";
import {PolarArea} from "react-chartjs-2";
import {Chart} from "primereact/chart";
interface Props {
data: {label: string; value: number}[];
label?: string;
title: string;
type: string;
}
ChartJS.register(RadialLinearScale, ArcElement, Tooltip, Legend);
export default function UserResultChart({data, type, label, title}: Props) {
const labels = data.map((x) => x.label);
const chartData = {
labels,
datasets: [
{
label,
data: data.map((x) => x.value),
backgroundColor: Object.values(SEMI_TRANSPARENT),
},
],
};
return <Chart type={type} data={chartData} options={{plugins: {title: {text: title, display: true}}}} />;
}