Extract chart options

osuAkatsuki · Jul 23, 2024 · 7ee8665 · 7ee8665
1 parent fee0dfb
commit 7ee8665
Showing 1 changed file with 31 additions and 30 deletions.
diff --git a/src/components/profile/ProfileHistoryCard.tsx b/src/components/profile/ProfileHistoryCard.tsx
@@ -17,6 +17,36 @@ import { formatDecimal, formatNumber } from "../../utils/formatting"
 import { Line } from "react-chartjs-2"
 import { modeToStatsIndex } from "../../scores"
 
+const getChartOptions = (chartType: ProfileHistoryType) => {
+  const useReverseYAxis = [
+    ProfileHistoryType.CountryRank,
+    ProfileHistoryType.GlobalRank,
+  ].includes(chartType)
+
+  return {
+    elements: {
+      point: {
+        radius: 0,
+      },
+    },
+    scales: {
+      y: {
+        grace: "10%",
+        reverse: useReverseYAxis,
+        type: "linear",
+        ticks: {
+          precision: 0,
+        },
+      },
+    },
+    plugins: {
+      tooltip: {
+        intersect: false,
+      },
+    },
+  } as const
+}
+
 const ProfileHistoryGraphNavbar = ({
   userStats,
   country,
@@ -163,36 +193,7 @@ const ProfileHistoryGraph = ({
     ],
   }
 
-  const options = {
-    elements: {
-      point: {
-        radius: 0,
-      },
-    },
-    scales: {
-      y: {
-        grace: "10%",
-        reverse: [
-          ProfileHistoryType.CountryRank,
-          ProfileHistoryType.GlobalRank,
-        ].includes(type),
-        type: "linear",
-        ticks: {
-          precision: 0,
-        },
-      },
-    },
-    plugins: {
-      tooltip: {
-        intersect: false,
-      },
-    },
-  } as const
-  return (
-    <>
-      <Line data={chartData} options={options} />
-    </>
-  )
+  return <Line data={chartData} options={getChartOptions(type)} />
 }
 
 export const ProfileHistoryCard = ({