Bug 1740497 - Show from (prev revision) and to (revision) on alert summaries (#7314)

* Bug 1740497 - Add prev and to push revision in alert summary header

* Bug 1740497 - Address PR requests

* Bug 1740497 - Rename formattedAlertRevision to formattedSummaryRevision

tests/ui/perfherder/alerts-view/alerts_test.jsx

@@ -867,3 +867,32 @@ test("Alert's ID can be copied to clipboard", async () => {
 
   expect(navigator.clipboard.writeText).toHaveBeenCalledWith(`${alertID}`);
 });
+
+test('Prev push revision is displayed in dropdown', async () => {
+  const { getAllByTestId } = alertsViewControls();
+  const prevPushRevision = testAlertSummaries[0].prev_push_revision.slice(
+    0,
+    12,
+  );
+
+  const pushDropdown = await waitFor(() => getAllByTestId('push-dropdown'));
+
+  fireEvent.click(pushDropdown[0]);
+
+  const prevPush = await waitFor(() => getAllByTestId('prev-push-revision'));
+
+  expect(prevPush[0]).toHaveTextContent(prevPushRevision);
+});
+
+test('Current push revision is displayed in dropdown', async () => {
+  const { getAllByTestId } = alertsViewControls();
+  const pushRevision = testAlertSummaries[0].revision.slice(0, 12);
+
+  const pushDropdown = await waitFor(() => getAllByTestId('push-dropdown'));
+
+  fireEvent.click(pushDropdown[0]);
+
+  const toPush = await waitFor(() => getAllByTestId('to-push-revision'));
+
+  expect(toPush[0]).toHaveTextContent(pushRevision);
+});

ui/perfherder/alerts/AlertHeader.jsx

@@ -37,6 +37,7 @@ const AlertHeader = ({
 
   const performanceTags = alertSummary.performance_tags || [];
   const alertSummaryDatetime = new Date(alertSummary.push_timestamp * 1000);
+  const formattedSummaryRevision = alertSummary.revision.slice(0, 12);
 
   return (
     <Container>
@@ -47,8 +48,13 @@ const AlertHeader = ({
         </Col>
         <Col className="p-0" xs="auto">
           <UncontrolledDropdown tag="span">
-            <DropdownToggle className="btn-xs ml-2" color="secondary" caret>
-              {alertSummary.revision.slice(0, 12)}
+            <DropdownToggle
+              className="btn-xs ml-2"
+              color="secondary"
+              caret
+              data-testid="push-dropdown"
+            >
+              {formattedSummaryRevision}
             </DropdownToggle>
             <DropdownMenu>
               <DropdownItem
@@ -76,6 +82,20 @@ const AlertHeader = ({
               >
                 Pushlog
               </DropdownItem>
+              <DropdownItem
+                className="text-dark"
+                disabled
+                data-testid="prev-push-revision"
+              >
+                From: {`${alertSummary.prev_push_revision.slice(0, 12)}`}
+              </DropdownItem>
+              <DropdownItem
+                className="text-dark"
+                disabled
+                data-testid="to-push-revision"
+              >
+                To: {formattedSummaryRevision}
+              </DropdownItem>
             </DropdownMenu>
           </UncontrolledDropdown>
         </Col>