[WebApp SALAD-23203] Replace average earning columns with only averag…

…e earning rate for demand page table (#1238) * add average earning rate to demand page table * remove avg earning rate calculation * streamline with api changes
SaladTechnologies · Dec 11, 2024 · df32f38 · df32f38
1 parent c3380b9
commit df32f38
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 27 deletions.
diff --git a/packages/web-app/package.json b/packages/web-app/package.json
@@ -94,7 +94,7 @@
     "@microsoft/kiota-serialization-json": "1.0.0-preview.57",
     "@novu/notification-center": "0.24.2",
     "@novu/shared": "0.24.2",
-    "@saladtechnologies/garden-components": "1.5.1",
+    "@saladtechnologies/garden-components": "1.5.2",
     "@saladtechnologies/garden-fonts": "1.0.4",
     "@saladtechnologies/garden-icons": "1.0.27",
     "@storybook/addon-a11y": "6.5.16",

diff --git a/.../modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/DemandMonitorTable.tsx b/.../modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/DemandMonitorTable.tsx
@@ -192,8 +192,6 @@ const _DemandMonitorTable: FunctionComponent<Props> = ({ classes, demandedHardwa
             {sortedDemandedHardwarePerformanceList.map(
               ({ displayName, earningRates, recommendedSpecs, utilizationPct }) => {
                 const demand = getHardwareDemandLevel(utilizationPct)
-                const avgEarningTimeHours = earningRates.avgEarningTimeMinutes / 60
-                const avgRunningTime = Math.round(avgEarningTimeHours * 10) / 10
 
                 return (
                   <tr key={displayName}>
@@ -227,14 +225,14 @@ const _DemandMonitorTable: FunctionComponent<Props> = ({ classes, demandedHardwa
                     <td className={classes.tableCell}>
                       <div className={classes.tableCellCentered}>
                         <Text className={classes.boldText} variant="baseM">
-                          ${earningRates.avgEarning}
+                          ${earningRates.avgEarningRate?.toFixed(3)}
                         </Text>
                       </div>
                     </td>
                     <td className={classes.tableCell}>
                       <div className={classes.tableCellCentered}>
                         <Text className={classes.boldText} variant="baseM">
-                          {avgRunningTime} hours
+                          ${earningRates.top25PctEarningRate?.toFixed(3)}
                         </Text>
                       </div>
                     </td>

diff --git a/...eb-app/src/modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/constants.ts b/...eb-app/src/modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/constants.ts
@@ -1,10 +1,10 @@
 import type { Demand, DemandMonitorTableColumn } from './types'
 import {
-  sortByAvgEarnings,
-  sortByAvgRunningTime,
+  sortByAvgEarningRate,
   sortByDemand,
   sortByHourlyRate,
   sortByRecommendedSpecs,
+  sortByTop25PctEarningRate,
 } from './utils'
 
 interface DemandPillColors {
@@ -43,15 +43,15 @@ export const demandMonitorTableColumns: Record<DemandMonitorTableColumn['key'],
     displayName: 'Demand',
     sortRule: sortByDemand,
   },
-  avgEarning: {
-    key: 'avgEarning',
-    displayName: 'Average Earnings 24/h',
-    sortRule: sortByAvgEarnings,
+  avgEarningRate: {
+    key: 'avgEarningRate',
+    displayName: 'Average Earning Rate, hourly',
+    sortRule: sortByAvgEarningRate,
   },
-  avgRunningTime: {
-    key: 'avgRunningTime',
-    displayName: 'Average Running Time 24/h',
-    sortRule: sortByAvgRunningTime,
+  top25PctEarningRate: {
+    key: 'top25PctEarningRate',
+    displayName: 'Average Earning Rate Top 25%, hourly',
+    sortRule: sortByTop25PctEarningRate,
   },
 }
 

diff --git a/...es/web-app/src/modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/types.ts b/...es/web-app/src/modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/types.ts
@@ -21,7 +21,7 @@ export interface DemandMonitorTableSort {
   sortOrder: 'ascending' | 'descending' | 'none'
 }
 export interface DemandMonitorTableColumn {
-  key: 'gpu' | 'recommendedSpecs' | 'demand' | 'avgEarning' | 'avgRunningTime'
+  key: 'gpu' | 'recommendedSpecs' | 'demand' | 'avgEarningRate' | 'top25PctEarningRate'
   displayName: string
   sortRule: DemandMonitorTableSortRule
 }
diff --git a/...es/web-app/src/modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/utils.ts b/...es/web-app/src/modules/demand-monitor-views/DemandMonitorPage/DemandMonitorTable/utils.ts
@@ -33,11 +33,13 @@ export const sortHardwareDemandPerformance = ({
 export const sortByDemand = (hardwareA: DemandedHardwarePerformance, hardwareB: DemandedHardwarePerformance) =>
   hardwareB.utilizationPct - hardwareA.utilizationPct
 
-export const sortByAvgEarnings = (hardwareA: DemandedHardwarePerformance, hardwareB: DemandedHardwarePerformance) =>
-  hardwareB.earningRates.avgEarning - hardwareA.earningRates.avgEarning
+export const sortByAvgEarningRate = (hardwareA: DemandedHardwarePerformance, hardwareB: DemandedHardwarePerformance) =>
+  hardwareB.earningRates.avgEarningRate - hardwareA.earningRates.avgEarningRate
 
-export const sortByAvgRunningTime = (hardwareA: DemandedHardwarePerformance, hardwareB: DemandedHardwarePerformance) =>
-  hardwareB.earningRates.avgEarningTimeMinutes - hardwareA.earningRates.avgEarningTimeMinutes
+export const sortByTop25PctEarningRate = (
+  hardwareA: DemandedHardwarePerformance,
+  hardwareB: DemandedHardwarePerformance,
+) => hardwareB.earningRates.top25PctEarningRate - hardwareA.earningRates.top25PctEarningRate
 
 export const sortByRecommendedSpecs = (
   hardwareA: DemandedHardwarePerformance,

diff --git a/packages/web-app/src/modules/demand-monitor-views/DemandMonitorStore.tsx b/packages/web-app/src/modules/demand-monitor-views/DemandMonitorStore.tsx
@@ -6,8 +6,8 @@ export interface DemandedHardwarePerformance {
   name: string
   displayName: string
   earningRates: {
-    avgEarning: number
-    avgEarningTimeMinutes: number
+    avgEarningRate: number
+    top25PctEarningRate: number
     maxEarningRate: number
     minEarningRate: number
   }

diff --git a/packages/web-app/yarn.lock b/packages/web-app/yarn.lock
@@ -3388,7 +3388,7 @@ __metadata:
     "@microsoft/kiota-serialization-json": "npm:1.0.0-preview.57"
     "@novu/notification-center": "npm:0.24.2"
     "@novu/shared": "npm:0.24.2"
-    "@saladtechnologies/garden-components": "npm:1.5.1"
+    "@saladtechnologies/garden-components": "npm:1.5.2"
     "@saladtechnologies/garden-fonts": "npm:1.0.4"
     "@saladtechnologies/garden-icons": "npm:1.0.27"
     "@storybook/addon-a11y": "npm:6.5.16"
@@ -3488,9 +3488,9 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@saladtechnologies/garden-components@npm:1.5.1":
-  version: 1.5.1
-  resolution: "@saladtechnologies/garden-components@npm:1.5.1"
+"@saladtechnologies/garden-components@npm:1.5.2":
+  version: 1.5.2
+  resolution: "@saladtechnologies/garden-components@npm:1.5.2"
   peerDependencies:
     "@emotion/react": 11.x
     "@emotion/styled": 11.x
@@ -3505,7 +3505,7 @@ __metadata:
     react-intl: 6.x
     react-range: 1.x
     react-responsive: 9.x
-  checksum: 10c0/451b4e31c6adc8b12cd688b760966190d975283748be8db7447ca35abb38107228cabee4ccd1e478537f5125d191a4e626c4d3ce553f70c119be9dbbec932a38
+  checksum: 10c0/8c8379f47c57f3e34f7830d7be8da0e6af1697ee7558f16da85ca8a69bb236c7508318ca85289da229d0cf1dafdd9aea9649f88e3205d5a2025d40fab2e00287
   languageName: node
   linkType: hard