diff --git a/src/Augmentation/ui/PurchaseableAugmentations.tsx b/src/Augmentation/ui/PurchaseableAugmentations.tsx
index fe07b39b2..346aaaacc 100644
--- a/src/Augmentation/ui/PurchaseableAugmentations.tsx
+++ b/src/Augmentation/ui/PurchaseableAugmentations.tsx
@@ -2,26 +2,18 @@
  * React component for displaying a single augmentation for purchase through
  * the faction UI
  */
+import { CheckBox, CheckBoxOutlineBlank, CheckCircle, Info, NewReleases, Report } from "@mui/icons-material";
+import { Box, Button, Container, Paper, Tooltip, Typography } from "@mui/material";
 import React, { useState } from "react";
-
-import { hasAugmentationPrereqs, purchaseAugmentation } from "../../Faction/FactionHelpers";
-import { PurchaseAugmentationModal } from "./PurchaseAugmentationModal";
-
-import { Augmentations } from "../Augmentations";
-import { AugmentationNames } from "../data/AugmentationNames";
+import { getNextNeuroFluxLevel } from "../../Augmentation/AugmentationHelpers";
 import { Faction } from "../../Faction/Faction";
 import { IPlayer } from "../../PersonObjects/IPlayer";
 import { Settings } from "../../Settings/Settings";
 import { numeralWrapper } from "../../ui/numeralFormat";
-import { Money } from "../../ui/React/Money";
-import { Reputation } from "../../ui/React/Reputation";
-
-import { CheckBox, CheckBoxOutlineBlank, NewReleases, Info, Report, CheckCircle } from "@mui/icons-material";
-import { Augmentation as AugFormat } from "../../ui/React/Augmentation";
-import { Paper, Button, Typography, Tooltip, Box, TableRow, Container, List, ListItem } from "@mui/material";
-import { TableCell } from "../../ui/React/Table";
-import { getNextNeuroFluxLevel } from "../../Augmentation/AugmentationHelpers";
 import { Augmentation } from "../Augmentation";
+import { Augmentations } from "../Augmentations";
+import { AugmentationNames } from "../data/AugmentationNames";
+import { PurchaseAugmentationModal } from "./PurchaseAugmentationModal";
 
 interface IPreReqsProps {
   player: IPlayer;
@@ -123,6 +115,7 @@ const Requirement = (props: IReqProps): React.ReactElement => {
 
 interface IPurchaseableAugsProps {
   augNames: string[];
+  ownedAugNames: string[];
   player: IPlayer;
 
   canPurchase: (player: IPlayer, aug: Augmentation) => boolean;
@@ -142,7 +135,10 @@ export const PurchaseableAugmentations = (props: IPurchaseableAugsProps): React.
       sx={{ mx: 0, display: "grid", gridTemplateColumns: "repeat(1, 1fr)", gap: 1 }}
     >
       {props.augNames.map((augName: string) => (
-        <PurchaseableAugmentation key={augName} parent={props} augName={augName} />
+        <PurchaseableAugmentation key={augName} parent={props} augName={augName} owned={false} />
+      ))}
+      {props.ownedAugNames.map((augName: string) => (
+        <PurchaseableAugmentation key={augName} parent={props} augName={augName} owned={true} />
       ))}
     </Container>
   );
@@ -151,6 +147,7 @@ export const PurchaseableAugmentations = (props: IPurchaseableAugsProps): React.
 interface IPurchaseableAugProps {
   parent: IPurchaseableAugsProps;
   augName: string;
+  owned: boolean;
 }
 
 export function PurchaseableAugmentation(props: IPurchaseableAugProps): React.ReactElement {
@@ -170,7 +167,16 @@ export function PurchaseableAugmentation(props: IPurchaseableAugProps): React.Re
 
   return (
     <>
-      <Paper key={props.augName} sx={{ p: 1, display: "grid", gridTemplateColumns: "minmax(0, 3fr) 1fr", gap: 1 }}>
+      <Paper
+        key={props.augName}
+        sx={{
+          p: 1,
+          display: "grid",
+          gridTemplateColumns: "minmax(0, 3fr) 1fr",
+          gap: 1,
+          opacity: props.owned ? 0.75 : 1,
+        }}
+      >
         <Box sx={{ display: "flex", alignItems: "center" }}>
           <Button
             onClick={() =>
@@ -178,13 +184,13 @@ export function PurchaseableAugmentation(props: IPurchaseableAugProps): React.Re
                 setOpen(open);
               })
             }
-            disabled={!props.parent.canPurchase(props.parent.player, aug)}
+            disabled={!props.parent.canPurchase(props.parent.player, aug) || props.owned}
             sx={{ width: "48px", height: "48px", float: "left", clear: "none", mr: 1 }}
           >
-            Buy
+            {props.owned ? "Owned" : "Buy"}
           </Button>
 
-          <Box sx={{ maxWidth: "85%" }}>
+          <Box sx={{ maxWidth: props.owned ? "100%" : "85%" }}>
             <Box sx={{ display: "flex", alignItems: "center" }}>
               <Tooltip
                 title={
@@ -219,22 +225,24 @@ export function PurchaseableAugmentation(props: IPurchaseableAugProps): React.Re
           </Box>
         </Box>
 
-        <Box sx={{ display: "flex", alignItems: "center" }}>
-          <span>
-            <Requirement
-              fulfilled={aug.baseCost === 0 || props.parent.player.money > aug.baseCost}
-              value={numeralWrapper.formatMoney(aug.baseCost)}
-              color={Settings.theme.money}
-            />
-            {props.parent.rep !== undefined && (
+        {props.owned || (
+          <Box sx={{ display: "flex", alignItems: "center" }}>
+            <span>
               <Requirement
-                fulfilled={props.parent.rep >= aug.baseRepRequirement}
-                value={`${numeralWrapper.formatReputation(aug.baseRepRequirement)} reputation`}
-                color={Settings.theme.rep}
+                fulfilled={aug.baseCost === 0 || props.parent.player.money > aug.baseCost}
+                value={numeralWrapper.formatMoney(aug.baseCost)}
+                color={Settings.theme.money}
               />
-            )}
-          </span>
-        </Box>
+              {props.parent.rep !== undefined && (
+                <Requirement
+                  fulfilled={props.parent.rep >= aug.baseRepRequirement}
+                  value={`${numeralWrapper.formatReputation(aug.baseRepRequirement)} reputation`}
+                  color={Settings.theme.rep}
+                />
+              )}
+            </span>
+          </Box>
+        )}
       </Paper>
       <PurchaseAugmentationModal open={open} onClose={() => setOpen(false)} faction={props.parent.faction} aug={aug} />
     </>
diff --git a/src/Faction/ui/AugmentationsPage.tsx b/src/Faction/ui/AugmentationsPage.tsx
index 25a94a363..e45011c86 100644
--- a/src/Faction/ui/AugmentationsPage.tsx
+++ b/src/Faction/ui/AugmentationsPage.tsx
@@ -1,24 +1,22 @@
 /**
  * Root React Component for displaying a faction's "Purchase Augmentations" page
  */
+import { Box, Button, Tooltip, Typography } from "@mui/material";
 import React, { useState } from "react";
+import { getGenericAugmentationPriceMultiplier } from "../../Augmentation/AugmentationHelpers";
 import { Augmentations } from "../../Augmentation/Augmentations";
 import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
-import { PurchaseableAugmentation, PurchaseableAugmentations } from "../../Augmentation/ui/PurchaseableAugmentations";
+import { PurchaseableAugmentations } from "../../Augmentation/ui/PurchaseableAugmentations";
 import { PurchaseAugmentationsOrderSetting } from "../../Settings/SettingEnums";
 import { Settings } from "../../Settings/Settings";
 import { use } from "../../ui/Context";
 import { numeralWrapper } from "../../ui/numeralFormat";
 import { Favor } from "../../ui/React/Favor";
 import { Reputation } from "../../ui/React/Reputation";
+import { FactionNames } from "../data/FactionNames";
 import { Faction } from "../Faction";
 import { getFactionAugmentationsFiltered, hasAugmentationPrereqs, purchaseAugmentation } from "../FactionHelpers";
 
-import { Box, Button, Typography, Tooltip, TableBody, Table } from "@mui/material";
-
-import { getGenericAugmentationPriceMultiplier } from "../../Augmentation/AugmentationHelpers";
-import { FactionNames } from "../data/FactionNames";
-
 type IProps = {
   faction: Faction;
   routeToMainPage: () => void;
@@ -130,34 +128,8 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
       aug === AugmentationNames.NeuroFluxGovernor ||
       (!player.augmentations.some((a) => a.name === aug) && !player.queuedAugmentations.some((a) => a.name === aug)),
   );
-
-  const purchaseableAugmentation = (aug: string, owned = false): React.ReactNode => {
-    return (
-      <PurchaseableAugmentation
-        augName={aug}
-        faction={props.faction}
-        key={aug}
-        p={player}
-        rerender={rerender}
-        owned={owned}
-      />
-    );
-  };
-
-  const augListElems = purchasable.map((aug) => purchaseableAugmentation(aug));
-
-  let ownedElem = <></>;
   const owned = augs.filter((aug: string) => !purchasable.includes(aug));
-  if (owned.length !== 0) {
-    ownedElem = (
-      <>
-        <br />
-        <Typography variant="h4">Purchased Augmentations</Typography>
-        <Typography>This faction also offers these augmentations but you already own them.</Typography>
-        {owned.map((aug) => purchaseableAugmentation(aug, true))}
-      </>
-    );
-  }
+
   const multiplierComponent =
     props.faction.name !== FactionNames.ShadowsOfAnarchy ? (
       <Typography>
@@ -200,6 +172,7 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
 
       <PurchaseableAugmentations
         augNames={purchasable}
+        ownedAugNames={owned}
         player={player}
         canPurchase={(player, aug) => {
           return (
@@ -219,13 +192,6 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
         rep={props.faction.playerReputation}
         faction={props.faction}
       />
-      {/* <Table size="small" padding="none">
-        <TableBody>{augListElems}</TableBody>
-      </Table>
-
-      <Table size="small" padding="none">
-        <TableBody>{ownedElem}</TableBody>
-      </Table> */}
     </>
   );
 }
diff --git a/src/PersonObjects/Sleeve/ui/SleeveAugmentationsModal.tsx b/src/PersonObjects/Sleeve/ui/SleeveAugmentationsModal.tsx
index c487a9808..ee1f9e07e 100644
--- a/src/PersonObjects/Sleeve/ui/SleeveAugmentationsModal.tsx
+++ b/src/PersonObjects/Sleeve/ui/SleeveAugmentationsModal.tsx
@@ -1,18 +1,11 @@
-import React, { useState, useEffect } from "react";
+import { Box, Container, Paper, Tooltip, Typography } from "@mui/material";
+import React, { useEffect, useState } from "react";
+import { Augmentations } from "../../../Augmentation/Augmentations";
+import { PurchaseableAugmentations } from "../../../Augmentation/ui/PurchaseableAugmentations";
+import { use } from "../../../ui/Context";
+import { Modal } from "../../../ui/React/Modal";
 import { Sleeve } from "../Sleeve";
 import { findSleevePurchasableAugs } from "../SleeveHelpers";
-import { Augmentations } from "../../../Augmentation/Augmentations";
-import { Augmentation } from "../../../Augmentation/Augmentation";
-import { PurchaseableAugmentations } from "../../../Augmentation/ui/PurchaseableAugmentations";
-import { Money } from "../../../ui/React/Money";
-import { Modal } from "../../../ui/React/Modal";
-import { use } from "../../../ui/Context";
-import { Typography, Tooltip, Paper, Box, Container } from "@mui/material";
-import Button from "@mui/material/Button";
-import TableBody from "@mui/material/TableBody";
-import Table from "@mui/material/Table";
-import { TableCell } from "../../../ui/React/Table";
-import TableRow from "@mui/material/TableRow";
 
 interface IProps {
   open: boolean;
@@ -40,11 +33,6 @@ export function SleeveAugmentationsModal(props: IProps): React.ReactElement {
   // and you must also have enough rep in that faction in order to purchase it.
   const availableAugs = findSleevePurchasableAugs(props.sleeve, player);
 
-  function purchaseAugmentation(aug: Augmentation): void {
-    props.sleeve.tryBuyAugmentation(player, aug);
-    rerender();
-  }
-
   return (
     <Modal open={props.open} onClose={props.onClose}>
       <Container disableGutters maxWidth="md" sx={{ mx: 0 }}>
@@ -58,6 +46,7 @@ export function SleeveAugmentationsModal(props: IProps): React.ReactElement {
         </Typography>
         <PurchaseableAugmentations
           augNames={availableAugs.map((aug) => aug.name)}
+          ownedAugNames={ownedAugNames}
           player={player}
           canPurchase={(player, aug) => {
             return player.money > aug.startingCost;
@@ -69,38 +58,11 @@ export function SleeveAugmentationsModal(props: IProps): React.ReactElement {
           skipPreReqs
           skipExclusiveIndicator
         />
-        {/* <Box component={Paper} sx={{ my: 1, p: 1 }}>
-            <Table size="small" padding="none">
-              <TableBody>
-                {availableAugs.map((aug) => {
-                  return (
-                    <TableRow key={aug.name}>
-                      <TableCell>
-                        <Button onClick={() => purchaseAugmentation(aug)} disabled={player.money < aug.startingCost}>
-                          Buy
-                        </Button>
-                      </TableCell>
-                      <TableCell>
-                        <Box display="flex">
-                          <Tooltip title={aug.stats || ""}>
-                            <Typography>{aug.name}</Typography>
-                          </Tooltip>
-                        </Box>
-                      </TableCell>
-                      <TableCell>
-                        <Money money={aug.startingCost} player={player} />
-                      </TableCell>
-                    </TableRow>
-                  );
-                })}
-              </TableBody>
-            </Table>
-          </Box> */}
 
         {ownedAugNames.length > 0 && (
           <>
-            <Typography sx={{ mx: 1 }}>Owned Augmentations:</Typography>
-            <Box display="grid" sx={{ gridTemplateColumns: "repeat(5, 1fr)", m: 1 }}>
+            <Typography>Owned Augmentations:</Typography>
+            <Box display="grid" sx={{ gridTemplateColumns: "repeat(5, 1fr)", my: 1 }}>
               {ownedAugNames.map((augName) => {
                 const aug = Augmentations[augName];
                 const info = typeof aug.info === "string" ? <span>{aug.info}</span> : aug.info;