show release alias on rules page (#3023)

* show release alias on rules page * updated releases page to show rule alias * used rule alias in the release card * fixed lint issues
mozilla-releng · Nov 14, 2023 · d29f36a · d29f36a
1 parent 42d074b
commit d29f36a
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 18 deletions.
diff --git a/ui/src/components/ReleaseCard/index.jsx b/ui/src/components/ReleaseCard/index.jsx
@@ -127,6 +127,7 @@ const useStyles = makeStyles(theme => ({
 function ReleaseCard(props) {
   const {
     release,
+    rules,
     user,
     onSignoff,
     onRevoke,
@@ -248,24 +249,30 @@ function ReleaseCard(props) {
                   secondary={
                     hasRulesPointingAtRevision ? (
                       Object.entries(release.rule_info).map(
-                        ([ruleId, ruleInfo]) => (
-                          <Link
-                            className={classes.link}
-                            key={ruleId}
-                            to={getRuleLink(
-                              ruleId,
-                              ruleInfo.product,
-                              ruleInfo.channel
-                            )}>
-                            <Chip
-                              clickable
-                              size="small"
-                              icon={<LinkIcon />}
-                              label={ruleId}
-                              className={classes.chip}
-                            />
-                          </Link>
-                        )
+                        ([ruleId, ruleInfo]) => {
+                          const rule = rules.find(
+                            rule => rule.rule_id === Number(ruleId)
+                          );
+
+                          return (
+                            <Link
+                              className={classes.link}
+                              key={ruleId}
+                              to={getRuleLink(
+                                ruleId,
+                                ruleInfo.product,
+                                ruleInfo.channel
+                              )}>
+                              <Chip
+                                clickable
+                                size="small"
+                                icon={<LinkIcon />}
+                                label={rule.alias ? rule.alias : ruleId}
+                                className={classes.chip}
+                              />
+                            </Link>
+                          );
+                        }
                       )
                     ) : (
                       <em>n/a</em>

diff --git a/ui/src/views/Releases/ListReleases/index.jsx b/ui/src/views/Releases/ListReleases/index.jsx
@@ -18,6 +18,7 @@ import MessagePanel from '../../../components/MessagePanel';
 import ReleaseCard from '../../../components/ReleaseCard';
 import useAction from '../../../hooks/useAction';
 import Link from '../../../utils/Link';
+import { getRules } from '../../../services/rules';
 import {
   getReleases,
   getReleasesV2,
@@ -95,6 +96,8 @@ function ListReleases(props) {
   const [requiredSignoffsForProduct, setRequiredSignoffsForProduct] = useState(
     null
   );
+  const [rules, fetchRules] = useAction(getRules);
+  const releaseRules = rules.data && rules.data.data;
   const [releasesAction, fetchReleases] = useAction(getReleases);
   const [releasesV2Action, fetchReleasesV2] = useAction(getReleasesV2);
   const [releaseAction, fetchRelease] = useAction(getRelease);
@@ -211,6 +214,7 @@ function ListReleases(props) {
       fetchReleases(),
       fetchScheduledChanges(),
       fetchReleasesV2(),
+      fetchRules(),
     ]).then(([relData, scData, relV2Data]) => {
       setReleases(
         // Releases may only exist in either the old or new API, not both,
@@ -715,6 +719,7 @@ function ListReleases(props) {
             [classes.releaseCardSelected]: isSelected,
           })}
           release={release}
+          rules={releaseRules.rules ? releaseRules.rules : []}
           releaseHighlight={matchHighlight && matchHighlight[release.name]}
           onAccessChange={handleAccessChange}
           onReleaseDelete={handleDelete}