Relay modal text update (distributed-system-analysis#3534)

Provide a better description of the Relay modal dialog
mfleader · Aug 30, 2023 · 1a7394b · 1a7394b
1 parent 30505a2
commit 1a7394b
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 8 deletions.
diff --git a/dashboard/src/modules/components/OverviewComponent/common-component.jsx b/dashboard/src/modules/components/OverviewComponent/common-component.jsx
@@ -419,10 +419,12 @@ export const MetadataRow = (props) => {
   return (
     <Table className="box" key={uid()} aria-label="metadata-table">
       <Thead>
-        <Th width={25} textCenter>
-          {columnNames.key}
-        </Th>
-        <Th width={40}>{columnNames.value}</Th>
+        <Tr>
+          <Th width={25} textCenter>
+            {columnNames.key}
+          </Th>
+          <Th width={40}>{columnNames.value}</Th>
+        </Tr>
       </Thead>
       <Tbody>
         {checkedItems.map((attr) => {

diff --git a/dashboard/src/modules/components/RelayUIComponent/index.jsx b/dashboard/src/modules/components/RelayUIComponent/index.jsx
@@ -42,12 +42,12 @@ const AboutComponent = () => (
 );
 const PopoverComponent = () => (
   <Popover
-    aria-label="Basic popover"
+    aria-label="Relay About Popover"
     headerContent={<div>About</div>}
     bodyContent={<AboutComponent />}
     maxWidth="4vw"
   >
-    <Button variant="plain" aria-label="About">
+    <Button variant="plain" aria-label="About" className="popover-btn">
       <OutlinedQuestionCircleIcon />
     </Button>
   </Popover>
@@ -73,9 +73,21 @@ const RelayComponent = () => {
       onClose={handleClose}
     >
       <div className="modal-heading">
-        <Title headingLevel="h3">Relay</Title>
+        <Title headingLevel="h3">Pull Datasets</Title>
         <PopoverComponent />
       </div>
+      <p className="modal-desc">
+        When you use the Pbench Agent{" "}
+        <span className="italicized"> pbench-results-move </span> command with
+        the
+        <span className="italicized"> --relay </span>option to push results to a
+        relay server, the command will report a URL.
+      </p>
+      <p className="modal-desc">
+        Enter that URL here to instruct the Pbench Server to upload the results
+        data from the relay and remove it from the relay.
+      </p>
+
       <div className="card-wrapper">
         <Card>
           <CardBody>

diff --git a/dashboard/src/modules/components/RelayUIComponent/index.less b/dashboard/src/modules/components/RelayUIComponent/index.less
@@ -5,9 +5,18 @@
   }
   .modal-heading {
     display: flex;
+    .popover-btn {
+      padding-top: 0;
+      padding-bottom: 0;
+    }
+  }
+  .modal-desc {
+    margin: 1vh 0;
+    .italicized {
+      font-style: italic;
+    }
   }
   .card-wrapper {
-    height: 45vh;
     display: flex;
     align-items: center;
     justify-content: center;