From c32e0ffdee041b62612d730a1d552b90cc0b179e Mon Sep 17 00:00:00 2001
From: RunDevelopment <mitchi5000.ms@googlemail.com>
Date: Sat, 14 Jan 2023 12:05:08 +0100
Subject: [PATCH] Consistent use of the word "percent" around the splash screen

---
 src/renderer/components/chaiNNerLogo.tsx |  4 ++--
 src/renderer/splash.tsx                  | 17 +++++++----------
 2 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/renderer/components/chaiNNerLogo.tsx b/src/renderer/components/chaiNNerLogo.tsx
index 9de0abb50f..9fd0ff6a0f 100644
--- a/src/renderer/components/chaiNNerLogo.tsx
+++ b/src/renderer/components/chaiNNerLogo.tsx
@@ -9,7 +9,7 @@ interface chaiNNerLogoProps {
     percent?: number;
 }
 
-export const ChaiNNerLogo = memo(({ size = 1024, percent = 1 }: chaiNNerLogoProps) => (
+export const ChaiNNerLogo = memo(({ size = 1024, percent = 100 }: chaiNNerLogoProps) => (
     <Box
         boxSize={size}
         display="block"
@@ -74,7 +74,7 @@ export const ChaiNNerLogo = memo(({ size = 1024, percent = 1 }: chaiNNerLogoProp
                             strokeWidth: '24px',
                             stroke: 'var(--chakra-colors-red-600)',
                             strokeDasharray: 100,
-                            strokeDashoffset: 100 * (1 - percent),
+                            strokeDashoffset: 100 - percent,
                             transition: 'stroke-dashoffset ease-in-out 0.25s',
                         }}
                     />
diff --git a/src/renderer/splash.tsx b/src/renderer/splash.tsx
index 0df9def2b7..7eb6926908 100644
--- a/src/renderer/splash.tsx
+++ b/src/renderer/splash.tsx
@@ -11,17 +11,14 @@ const Splash = memo(() => {
     const { t } = useTranslation();
 
     const [status, setStatus] = useState(t('splash.loading', 'Loading...'));
-    const [progressPercentage, setProgressPercentage] = useState(0);
-    const [overallProgressPercentage, setOverallProgressPercentage] = useState(0);
-    const [showProgressBar, setShowProgressBar] = useState(false);
+    const [statusProgress, setStatusProgress] = useState<null | number>(null);
+    const [overallProgress, setOverallProgress] = useState(0);
 
     // Register event listeners
     useEffect(() => {
         ipcRenderer.on('splash-setup-progress', (event, progress) => {
-            setOverallProgressPercentage(progress.totalProgress);
-
-            setShowProgressBar(progress.statusProgress > 0);
-            setProgressPercentage(progress.statusProgress);
+            setOverallProgress(progress.totalProgress);
+            setStatusProgress(progress.statusProgress > 0 ? progress.statusProgress : null);
 
             if (progress.status) {
                 setStatus(progress.status);
@@ -44,7 +41,7 @@ const Splash = memo(() => {
                 >
                     <Center>
                         <ChaiNNerLogo
-                            percent={overallProgressPercentage}
+                            percent={overallProgress * 100}
                             size={256}
                         />
                     </Center>
@@ -63,11 +60,11 @@ const Splash = memo(() => {
                                 {status}
                             </Text>
                         </Center>
-                        {showProgressBar && (
+                        {statusProgress !== null && (
                             <Center>
                                 <Progress
                                     hasStripe
-                                    value={progressPercentage}
+                                    value={statusProgress * 100}
                                     w="350px"
                                 />
                             </Center>