aboutsummaryrefslogtreecommitdiffstats
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/DataChart/DataChart.tsx127
1 files changed, 63 insertions, 64 deletions
diff --git a/src/components/DataChart/DataChart.tsx b/src/components/DataChart/DataChart.tsx
index 3b8304a..7d95abe 100644
--- a/src/components/DataChart/DataChart.tsx
+++ b/src/components/DataChart/DataChart.tsx
@@ -1,82 +1,81 @@
import {
- CategoryScale,
- Chart as ChartJS,
- Legend,
- LineElement,
- LinearScale,
- PointElement,
- Title,
- Tooltip,
+ CategoryScale,
+ Chart as ChartJS,
+ Legend,
+ LineElement,
+ LinearScale,
+ PointElement,
+ Title,
+ Tooltip,
} from "chart.js";
import type React from "react";
import { Line } from "react-chartjs-2";
ChartJS.register(
- CategoryScale,
- LinearScale,
- PointElement,
- LineElement,
- Title,
- Tooltip,
- Legend,
+ CategoryScale,
+ LinearScale,
+ PointElement,
+ LineElement,
+ Title,
+ Tooltip,
+ Legend,
);
interface DataChartProps {
- chartData?: any;
- graphTitle?: string;
- fullData?: boolean;
- overrideBorderColor?: string;
- overrideBGColor?: string;
+ chartData?: any;
+ graphTitle?: string;
+ fullData?: boolean;
+ overrideBorderColor?: string;
+ overrideBGColor?: string;
}
const DataChart: React.FC<DataChartProps> = ({
- chartData,
- graphTitle,
- fullData,
- overrideBGColor,
- overrideBorderColor,
+ chartData,
+ graphTitle,
+ fullData,
+ overrideBGColor,
+ overrideBorderColor,
}) => {
- const options = {
- responsive: true,
- plugins: {
- legend: {
- position: "top" as const,
- },
- title: {
- display: true,
- text: graphTitle || "Historical Subscriber Data",
- font: {
- size: 18,
- },
- },
- },
- scales: {
- x: {
- ticks: {
- autoSkip: true,
- maxTicksLimit: 10,
- },
- },
- },
- };
+ const options = {
+ responsive: true,
+ plugins: {
+ legend: {
+ position: "top" as const,
+ },
+ title: {
+ display: true,
+ text: graphTitle || "Historical Subscriber Data",
+ font: {
+ size: 18,
+ },
+ },
+ },
+ scales: {
+ x: {
+ ticks: {
+ autoSkip: true,
+ maxTicksLimit: 10,
+ },
+ },
+ },
+ };
- const data = {
- labels: chartData.labels,
- datasets: [
- {
- label: "Subscriber Count",
- data: chartData.datasets,
- borderColor: overrideBorderColor || "rgb(255, 99, 132)",
- backgroundColor: overrideBGColor || "rgba(255, 99, 132, 0.5)",
- },
- ],
- };
+ const data = {
+ labels: chartData.labels,
+ datasets: [
+ {
+ label: "Subscriber Count",
+ data: chartData.datasets,
+ borderColor: overrideBorderColor || "rgb(255, 99, 132)",
+ backgroundColor: overrideBGColor || "rgba(255, 99, 132, 0.5)",
+ },
+ ],
+ };
- if (!fullData) {
- return <Line options={options} data={data} />;
- } else {
- return <Line options={options} data={chartData} />;
- }
+ if (!fullData) {
+ return <Line options={options} data={data} />;
+ }
+ return <Line options={options} data={chartData} />;
};
export default DataChart;
send patches to the email below
yukais@pinapelz.com
include the subject [PATCH repo_name]
pinapelz.com
homepage