fix(web): map product issues to registration path (#1878)

Ensure proper navigation to the _Registration_ section when user clicks
on a registration issues from the drawer by restoring code that was
deleted by mistake when merging master into registration feature branch.

web/src/components/core/IssuesDrawer.test.tsx

@@ -60,7 +60,14 @@ describe("IssuesDrawer", () => {
   describe("when there are installation issues", () => {
     beforeEach(() => {
       mockIssuesList = new IssuesList(
-        [],
+        [
+          {
+            description: "Registration Fake Issue",
+            source: 0,
+            severity: 0,
+            details: "Registration Fake Issue details",
+          },
+        ],
         [
           {
             description: "Software Fake Issue",
@@ -97,6 +104,7 @@ describe("IssuesDrawer", () => {
     it("renders the drawer with categorized issues linking to their scope", async () => {
       const { user } = installerRender(<IssuesDrawer onClose={onCloseFn} />);
 
+      const registrationIssues = screen.getByRole("region", { name: "Registration" });
       const softwareIssues = screen.getByRole("region", { name: "Software" });
       const storageIssues = screen.getByRole("region", { name: "Storage" });
       const usersIssues = screen.getByRole("region", { name: "Users" });
@@ -114,6 +122,14 @@ describe("IssuesDrawer", () => {
       expect(usersLink).toHaveAttribute("href", "/users");
       within(usersIssues).getByText("Users Fake Issue");
 
+      // Regression test: right now, registration issues comes under product
+      // scope. Check that it links to registration section anyway.
+      const registrationLink = within(registrationIssues).getByRole("link", {
+        name: "Registration",
+      });
+      expect(registrationLink).toHaveAttribute("href", "/registration");
+      within(registrationIssues).getByText("Registration Fake Issue");
+
       // onClose should be called when user clicks on a section too for ensuring
       // drawer gets closed even when navigation is not needed.
       await user.click(usersLink);

web/src/components/core/IssuesDrawer.tsx

@@ -68,13 +68,14 @@ const IssuesDrawer = forwardRef(({ onClose }: { onClose: () => void }, ref) => {
             if (issues.length === 0) return null;
             // FIXME: address this better or use the /product(s)? namespace instead of
             // /registration.
+            const section = scope === "product" ? "registration" : scope;
             const ariaLabelId = `${scope}-issues-section`;
 
             return (
               <section key={idx} aria-labelledby={ariaLabelId}>
                 <Stack hasGutter>
                   <h4 id={ariaLabelId}>
-                    <Link variant="link" isInline onClick={onClose} to={`/${scope}`}>
+                    <Link variant="link" isInline onClick={onClose} to={`/${section}`}>
                       {scopeHeaders[scope]}
                     </Link>
                   </h4>