🐛 URL-encode ruleset and rule in affected apps page URL so it doesn't…

… break when ruleset contains a slash (/) character (konveyor#1272) Fixes an issue @ibolton336 identified where navigating to the affected apps page from the issues page causes a broken URL if the issue's ruleset contains a `/`. Signed-off-by: Mike Turley <[email protected]>
sjd78 · Aug 9, 2023 · 5e9a715 · 5e9a715
1 parent e07b603
commit 5e9a715
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/client/src/app/pages/issues/affected-applications/affected-applications.tsx b/client/src/app/pages/issues/affected-applications/affected-applications.tsx
@@ -45,7 +45,9 @@ interface IAffectedApplicationsRouteParams {
 export const AffectedApplications: React.FC = () => {
   const { t } = useTranslation();
 
-  const { ruleset, rule } = useParams<IAffectedApplicationsRouteParams>();
+  const routeParams = useParams<IAffectedApplicationsRouteParams>();
+  const ruleset = decodeURIComponent(routeParams.ruleset);
+  const rule = decodeURIComponent(routeParams.rule);
   const issueTitle =
     new URLSearchParams(useLocation().search).get("issueTitle") ||
     "Active rule";

diff --git a/client/src/app/pages/issues/helpers.ts b/client/src/app/pages/issues/helpers.ts
@@ -109,8 +109,8 @@ export const getAffectedAppsUrl = ({
     if (fromFilterValues[key]) toFilterValues[key] = fromFilterValues[key];
   });
   const baseUrl = Paths.issuesAllAffectedApplications
-    .replace("/:ruleset/", `/${ruleReport.ruleset}/`)
-    .replace("/:rule/", `/${ruleReport.rule}/`);
+    .replace("/:ruleset/", `/${encodeURIComponent(ruleReport.ruleset)}/`)
+    .replace("/:rule/", `/${encodeURIComponent(ruleReport.rule)}/`);
   const prefix = (key: string) =>
     `${TableURLParamKeyPrefix.issuesAffectedApps}:${key}`;
   return `${baseUrl}?${trimAndStringifyUrlParams({