From 4e0e1346fc68dc5d18ae5c606a93c47c5ef3661c Mon Sep 17 00:00:00 2001
From: Akhmad Najmuddin <udintobe@gmail.com>
Date: Wed, 23 Mar 2022 13:50:06 +0700
Subject: [PATCH] Fix NaN charts

---
 package.json                                             | 2 +-
 .../src/pages/Home/components/ChartBar/ChartBar.tsx      | 5 ++++-
 .../Home/components/ChartDoughnut/ChartDoughnut.tsx      | 9 ++++++---
 packages/renderer/src/store/series.ts                    | 6 +++---
 4 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index ec00a0f..a2382fb 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "my-personal-list",
 	"description": "My personal anime tracking list",
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"scripts": {
 		"start": "concurrently \"yarn start:renderer\" \"yarn start:main\" --kill-others",
 		"start:main": "tsc && electron .",
diff --git a/packages/renderer/src/pages/Home/components/ChartBar/ChartBar.tsx b/packages/renderer/src/pages/Home/components/ChartBar/ChartBar.tsx
index 6bc04db..dab70a2 100644
--- a/packages/renderer/src/pages/Home/components/ChartBar/ChartBar.tsx
+++ b/packages/renderer/src/pages/Home/components/ChartBar/ChartBar.tsx
@@ -46,7 +46,10 @@ const ChartBar: React.FC = () => {
 					tickColor: 'transparent',
 				},
 				ticks: {
-					stepSize: Math.ceil(Math.max(...tags.map((tag) => tag.epsNum)) / 5),
+					stepSize:
+						tags.length > 0
+							? Math.ceil(Math.max(...tags.map((tag) => tag.epsNum)) / 5)
+							: 100,
 					color: textColor,
 				},
 			},
diff --git a/packages/renderer/src/pages/Home/components/ChartDoughnut/ChartDoughnut.tsx b/packages/renderer/src/pages/Home/components/ChartDoughnut/ChartDoughnut.tsx
index 5939160..23be4dd 100644
--- a/packages/renderer/src/pages/Home/components/ChartDoughnut/ChartDoughnut.tsx
+++ b/packages/renderer/src/pages/Home/components/ChartDoughnut/ChartDoughnut.tsx
@@ -51,12 +51,15 @@ const DoughnutChart: React.FC = () => {
 		],
 	}
 
+	const percentage =
+		stats.totalEpisodes > 0
+			? Math.ceil((stats.watchedEpisodes / stats.totalEpisodes) * 100)
+			: 0
+
 	return (
 		<div className={styles.root}>
 			<div className={styles.label}>
-				<div className={styles.percentage}>
-					{Math.ceil((stats.watchedEpisodes / stats.totalEpisodes) * 100)}%
-				</div>
+				<div className={styles.percentage}>{percentage}%</div>
 				<div className={styles.episodes}>
 					{stats.watchedEpisodes} / {stats.totalEpisodes} Eps
 				</div>
diff --git a/packages/renderer/src/store/series.ts b/packages/renderer/src/store/series.ts
index 9991307..44556a5 100644
--- a/packages/renderer/src/store/series.ts
+++ b/packages/renderer/src/store/series.ts
@@ -92,9 +92,9 @@ export const seriesStats = selector({
 
 		let stockpileLasts, suffix
 		const daysRunsOut = (totalEpisodes - watchedEpisodes) / avgEpsPerDay
-		if (daysRunsOut === Infinity) {
-			stockpileLasts = daysRunsOut
-			suffix = ''
+		if (totalEpisodes === 0) {
+			stockpileLasts = 0
+			suffix = 'M'
 		} else if (daysRunsOut > 365) {
 			stockpileLasts = daysRunsOut / 365
 			suffix = 'Y'