Add keyRowAttr rather than getKey prop

- Also fix Copyable component descendence bug
lithictech · Feb 14, 2024 · aceb5dd · aceb5dd
1 parent d68ad88
commit aceb5dd
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/adminapp/src/components/Copyable.jsx b/adminapp/src/components/Copyable.jsx
@@ -18,11 +18,11 @@ export default function Copyable({ text, delay, inline, children }) {
   }
   const sx = inline && { px: "0!important", minWidth: "40px" };
   return (
-    <div>
+    <React.Fragment>
       {children || text}
       <Button title="Copy" variant="link" sx={sx} onClick={onCopy}>
         <ContentCopyIcon />
       </Button>
-    </div>
+    </React.Fragment>
   );
 }
diff --git a/adminapp/src/pages/MemberDetailPage.jsx b/adminapp/src/pages/MemberDetailPage.jsx
@@ -340,7 +340,7 @@ function Activities({ activities }) {
       title="Activities"
       headers={["At", "Summary", "Message"]}
       rows={activities}
-      getKey={(row) => row.id}
+      keyRowAttr="id"
       toCells={(row) => [
         dayjs(row.createdAt).format("lll"),
         row.summary,
@@ -358,7 +358,7 @@ function ResetCodes({ resetCodes }) {
       title="Login Codes"
       headers={["Sent", "Expires", "Token", "Used"]}
       rows={resetCodes}
-      getKey={(row) => row.id}
+      keyRowAttr="id"
       toCells={(row) => [
         dayjs(row.createdAt).format("lll"),
         dayjs(row.expireAt).format("lll"),
@@ -450,7 +450,7 @@ function MessagePreferences({ preferences }) {
         title="Message Preferences"
         headers={["Key", "Opted In", "Editable State"]}
         rows={subscriptions}
-        keyRowAttr="id"
+        keyRowAttr="key"
         toCells={(row) => [
           row.key,
           <BoolCheckmark key={2}>{row.optedIn}</BoolCheckmark>,
@@ -474,7 +474,7 @@ function MessageDeliveries({ messageDeliveries }) {
       title="Message Deliveries"
       headers={["Id", "Created", "Sent", "Template", "To"]}
       rows={messageDeliveries}
-      getKey={(row) => row.id}
+      keyRowAttr="id"
       toCells={(row) => [
         <AdminLink key="id" model={row} />,
         dayjs(row.createdAt).format("lll"),
@@ -498,7 +498,7 @@ function VendorAccounts({ vendorAccounts }) {
         "Latest Access Code",
       ]}
       rows={vendorAccounts}
-      getKey={(row) => row.id}
+      keyRowAttr="id"
       toCells={(row) => [
         <AdminLink key="id" model={row} />,
         dayjs(row.createdAt).format("lll"),