diff --git a/web/src/components/core/IssuesDrawer.test.tsx b/web/src/components/core/IssuesDrawer.test.tsx
index 4d4c9bd195..4dfb14245a 100644
--- a/web/src/components/core/IssuesDrawer.test.tsx
+++ b/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();
+ 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);
diff --git a/web/src/components/core/IssuesDrawer.tsx b/web/src/components/core/IssuesDrawer.tsx
index 13d3ae31c2..8fcef222e9 100644
--- a/web/src/components/core/IssuesDrawer.tsx
+++ b/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 (
-
+
{scopeHeaders[scope]}