removing some of the classes

src/Hacknet/ui/HacknetServerElem.tsx

@@ -183,7 +183,7 @@ export function HacknetServerElem(props: IProps): React.ReactElement {
             </TableCell>
             <TableCell colSpan={2}>
               <Typography>
-                {Hashes(node.totalHashesGenerated)} ({HashRate(node.hashRate)})
+                <Hashes hashes={node.totalHashesGenerated} /> (<HashRate hashes={node.hashRate} />)
               </Typography>
             </TableCell>
           </TableRow>
@@ -192,7 +192,9 @@ export function HacknetServerElem(props: IProps): React.ReactElement {
               <Typography>Hash Capacity:</Typography>
             </TableCell>
             <TableCell colSpan={2}>
-              <Typography>{Hashes(node.hashCapacity)}</Typography>
+              <Typography>
+                <Hashes hashes={node.hashCapacity} />
+              </Typography>
             </TableCell>
           </TableRow>
           <TableRow>

src/Hacknet/ui/HacknetUpgradeElem.tsx

@@ -60,7 +60,7 @@ export function HacknetUpgradeElem(props: IProps): React.ReactElement {
         <CopyableText value={upg.name} />
       </Typography>
       <Typography>
-        Cost: {Hashes(cost)}, Bought: {level} times
+        Cost: <Hashes hashes={cost} />, Bought: {level} times
       </Typography>
 
       <Typography>{upg.desc}</Typography>

src/Hacknet/ui/HashUpgradeModal.tsx

@@ -6,8 +6,6 @@ import React, { useState, useEffect } from "react";
 import { HashManager } from "../HashManager";
 import { HashUpgrades } from "../HashUpgrades";
 
-import { IPlayer } from "../../PersonObjects/IPlayer";
-
 import { Hashes } from "../../ui/React/Hashes";
 import { HacknetUpgradeElem } from "./HacknetUpgradeElem";
 import { Modal } from "../../ui/React/Modal";
@@ -40,7 +38,9 @@ export function HashUpgradeModal(props: IProps): React.ReactElement {
     <Modal open={props.open} onClose={props.onClose}>
       <>
         <Typography>Spend your hashes on a variety of different upgrades</Typography>
-        <Typography>Hashes: {Hashes(player.hashManager.hashes)}</Typography>
+        <Typography>
+          Hashes: <Hashes hashes={player.hashManager.hashes} />
+        </Typography>
         {Object.keys(HashUpgrades).map((upgName) => {
           const upg = HashUpgrades[upgName];
           return (

src/Hacknet/ui/MultiplierButtons.tsx

@@ -9,14 +9,17 @@ import { PurchaseMultipliers } from "../data/Constants";
 import Button from "@mui/material/Button";
 
 interface IMultiplierProps {
-  className: string;
-  key: string;
+  disabled: boolean;
   onClick: () => void;
   text: string;
 }
 
 function MultiplierButton(props: IMultiplierProps): React.ReactElement {
-  return <Button onClick={props.onClick}>{props.text}</Button>;
+  return (
+    <Button disabled={props.disabled} onClick={props.onClick}>
+      {props.text}
+    </Button>
+  );
 }
 
 interface IProps {
@@ -35,13 +38,12 @@ export function MultiplierButtons(props: IProps): React.ReactElement {
   for (let i = 0; i < mults.length; ++i) {
     const mult = mults[i];
     const btnProps = {
-      className: props.purchaseMultiplier === PurchaseMultipliers[mult] ? "std-button-disabled" : "std-button",
-      key: mult,
+      disabled: props.purchaseMultiplier === PurchaseMultipliers[mult],
       onClick: onClicks[i],
       text: mult,
     };
 
-    buttons.push(<MultiplierButton {...btnProps} />);
+    buttons.push(<MultiplierButton key={mult} {...btnProps} />);
   }
 
   return <>{buttons}</>;

src/Hacknet/ui/PlayerInfo.tsx

@@ -24,7 +24,7 @@ export function PlayerInfo(props: IProps): React.ReactElement {
 
   let prod;
   if (hasServers) {
-    prod = HashRate(props.totalProduction);
+    prod = <HashRate hashes={props.totalProduction} />;
   } else {
     prod = <MoneyRate money={props.totalProduction} />;
   }
@@ -39,7 +39,8 @@ export function PlayerInfo(props: IProps): React.ReactElement {
       {hasServers && (
         <>
           <Typography>
-            Hashes: {Hashes(props.player.hashManager.hashes)} / {Hashes(props.player.hashManager.capacity)}
+            Hashes: <Hashes hashes={props.player.hashManager.hashes} /> /{" "}
+            <Hashes hashes={props.player.hashManager.capacity} />
           </Typography>
         </>
       )}

src/Hacknet/ui/PurchaseButton.tsx

@@ -18,14 +18,10 @@ interface IProps {
 
 export function PurchaseButton(props: IProps): React.ReactElement {
   const cost = props.cost;
-  let className = Player.canAfford(cost) ? "std-button" : "std-button-disabled";
   let text;
-  let style = {};
   if (hasHacknetServers(Player)) {
     if (hasMaxNumberHacknetServers(Player)) {
-      className = "std-button-disabled";
       text = <>Hacknet Server limit reached</>;
-      style = { color: "red" };
     } else {
       text = (
         <>
@@ -43,5 +39,9 @@ export function PurchaseButton(props: IProps): React.ReactElement {
     );
   }
 
-  return <Button onClick={props.onClick}>{text}</Button>;
+  return (
+    <Button disabled={!Player.canAfford(cost)} onClick={props.onClick}>
+      {text}
+    </Button>
+  );
 }