Merge pull request #101 from awest25/Show_Percentage_Button

Fixed issue where show stats divided by all points
bruin-tennis-consulting · Apr 5, 2024 · 5957b3f · 5957b3f
2 parents 6593edc + 07dbc6d
commit 5957b3f
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 3 deletions.
diff --git a/app/(interactive)/matches/[slug]/page.js b/app/(interactive)/matches/[slug]/page.js
@@ -151,7 +151,7 @@ const MatchPage = () => {
                         checked={showPercent}
                         onChange={() => setShowPercent(!showPercent)}
                       />
-                      <label htmlFor="showOptionsCheckbox">Show Percentage</label>
+                      <label htmlFor="showOptionsCheckbox">Show Stats</label>
                     </div>
                     {showPercent && (
                       <Select

diff --git a/app/components/FilterList.js b/app/components/FilterList.js
@@ -48,6 +48,17 @@ const FilterList = ({ pointsData, filterList, setFilterList, showPercent, showCo
     return pointsData.filter(point => point[key] === value).length;
   };
 
+  const countFilteredPointsTotal = (key, value) => {
+    return pointsData.reduce((total, point) => {
+      // Check if the value attribute is not an empty string
+      if (point[key] !== '') {
+        return total + 1; // Add 1 to the total if this point has a value specific to this category (key)
+      }
+      // Otherwise, just return the current total without adding anything
+      return total;
+    }, 0);
+  };
+
   // Function to determine if the value is an active filter
   const isActiveFilter = (key, value) => {
     return filterList.some(([filterKey, filterValue]) => filterKey === key && filterValue === value);
@@ -70,6 +81,7 @@ const FilterList = ({ pointsData, filterList, setFilterList, showPercent, showCo
                     {nameMap[key]}
                   </strong>
                   <ul className={styles.filterValuesList} style={{ display: openKey === key ? 'block' : 'none' }}>
+                    { console.log(uniqueValues)}
                     {uniqueValues[key].map((value) => (
                       value !== '' && (
                         <div className={styles.filterValueItem} key={value} style={{
@@ -86,12 +98,15 @@ const FilterList = ({ pointsData, filterList, setFilterList, showPercent, showCo
                         }}>
                           <li >{value}</li>
                           {/* Point Percentage */}
+
+                          {/* {console.log(value)}  */}
                           {!showCount && showPercent && value && (
-                            <li>{Math.round((countFilteredPointsForValue(key, value) / pointsData.length) * 100)}%</li>                                                    
+                            // make a sum
+                            <li>{Math.round((countFilteredPointsForValue(key, value) / Math.round(countFilteredPointsTotal(key,value)) /* ERROR IS HERE */ ) * 100)}%</li>                                                    
                           )}
                           {/* Point Count */}
                           {showCount && showPercent && value && (
-                            <li>{countFilteredPointsForValue(key, value)} / {pointsData.length}</li> 
+                            <li>{countFilteredPointsForValue(key, value)} / {Math.round(countFilteredPointsTotal(key,value)) /* ERROR IS HERE */}</li> 
                           )}                                                 
                         </div>  
                       )))}