From 76cdf5906b7d548e2ab44bfe7f1fdd741bfa3b8f Mon Sep 17 00:00:00 2001
From: RawToast225 <rawtoast225@proton.me>
Date: Sun, 19 Nov 2023 01:20:18 -0700
Subject: [PATCH 1/2] update the amount of data points that avgdownloadspeed
 uses to represent the graph in downloads to be a higher number, changed the
 numbers to not jump around so much on the same row

---
 .../DownloadManager/components/ProgressHeader/index.css   | 3 ++-
 .../DownloadManager/components/ProgressHeader/index.tsx   | 8 +++++---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/frontend/screens/DownloadManager/components/ProgressHeader/index.css b/src/frontend/screens/DownloadManager/components/ProgressHeader/index.css
index d810ec8f40..7e1fceb481 100644
--- a/src/frontend/screens/DownloadManager/components/ProgressHeader/index.css
+++ b/src/frontend/screens/DownloadManager/components/ProgressHeader/index.css
@@ -54,6 +54,8 @@
 .realtimeDownloadStat {
   white-space: nowrap;
   margin: 0px;
+  width: 6em;
+  text-align: start;
 }
 
 .realtimeDownloadStatLabel {
@@ -66,7 +68,6 @@
 .realtimeDownloadStatContainer {
   align-self: center;
   margin: 1em;
-  box-sizing: border-box;
 }
 
 .downloadRateChart {
diff --git a/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx b/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx
index 1ab81b20e0..3c151a7deb 100644
--- a/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx
+++ b/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx
@@ -11,6 +11,8 @@ interface Point {
   disk: number
 }
 
+const sampleSize: number = 100;
+
 const roundToNearestHundredth = function (val: number | undefined) {
   if (!val) return 0
   return Math.round(val * 100) / 100
@@ -23,16 +25,16 @@ export default function ProgressHeader(props: {
   const { t } = useTranslation()
   const [progress] = hasProgress(props.appName)
   const [avgSpeed, setAvgDownloadSpeed] = useState<Point[]>(
-    Array<Point>(20).fill({ download: 0, disk: 0 })
+    Array<Point>(sampleSize).fill({ download: 0, disk: 0 })
   )
 
   useEffect(() => {
     if (props.state === 'idle') {
-      setAvgDownloadSpeed(Array<Point>(20).fill({ download: 0, disk: 0 }))
+      setAvgDownloadSpeed(Array<Point>(sampleSize).fill({ download: 0, disk: 0 }))
       return
     }
 
-    if (avgSpeed.length > 19) {
+    if (avgSpeed.length > sampleSize - 1) {
       avgSpeed.shift()
     }
 

From 72257a39750c8cf29dae9968d02a8662327c30c9 Mon Sep 17 00:00:00 2001
From: RawToast225 <rawtoast225@proton.me>
Date: Sun, 19 Nov 2023 03:08:38 -0700
Subject: [PATCH 2/2] style change to be compliant

---
 .../DownloadManager/components/ProgressHeader/index.tsx    | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx b/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx
index 3c151a7deb..a4ae1d7c48 100644
--- a/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx
+++ b/src/frontend/screens/DownloadManager/components/ProgressHeader/index.tsx
@@ -11,8 +11,6 @@ interface Point {
   disk: number
 }
 
-const sampleSize: number = 100;
-
 const roundToNearestHundredth = function (val: number | undefined) {
   if (!val) return 0
   return Math.round(val * 100) / 100
@@ -22,6 +20,7 @@ export default function ProgressHeader(props: {
   appName: string
   state: DownloadManagerState
 }) {
+  const sampleSize = 100
   const { t } = useTranslation()
   const [progress] = hasProgress(props.appName)
   const [avgSpeed, setAvgDownloadSpeed] = useState<Point[]>(
@@ -30,7 +29,9 @@ export default function ProgressHeader(props: {
 
   useEffect(() => {
     if (props.state === 'idle') {
-      setAvgDownloadSpeed(Array<Point>(sampleSize).fill({ download: 0, disk: 0 }))
+      setAvgDownloadSpeed(
+        Array<Point>(sampleSize).fill({ download: 0, disk: 0 })
+      )
       return
     }