From 4b2cd0ef7a34c3873b239f61d69a483ff6edb29b Mon Sep 17 00:00:00 2001
From: Erik Marks <25517051+rekmarks@users.noreply.github.com>
Date: Wed, 11 May 2022 13:14:53 -0700
Subject: [PATCH] Fix Snaps view search (#14693)

Closes #14687

Snap IDs were not properly encoded (and decoded) as URI components in the Snaps view search implementation. This ensures that they are.
---
 ui/pages/settings/flask/snaps-list-tab/snap-list-tab.js | 5 +----
 ui/pages/settings/flask/view-snap/view-snap.js          | 8 +++-----
 ui/selectors/selectors.js                               | 4 +---
 3 files changed, 5 insertions(+), 12 deletions(-)

diff --git a/ui/pages/settings/flask/snaps-list-tab/snap-list-tab.js b/ui/pages/settings/flask/snaps-list-tab/snap-list-tab.js
index d0c4f3306..842c10bc5 100644
--- a/ui/pages/settings/flask/snaps-list-tab/snap-list-tab.js
+++ b/ui/pages/settings/flask/snaps-list-tab/snap-list-tab.js
@@ -24,10 +24,7 @@ const SnapListTab = () => {
   const snaps = useSelector(getSnaps);
   const settingsRef = useRef();
   const onClick = (snap) => {
-    const route = `${SNAPS_VIEW_ROUTE}/${window.btoa(
-      unescape(encodeURIComponent(snap.id)),
-    )}`;
-    history.push(route);
+    history.push(`${SNAPS_VIEW_ROUTE}/${encodeURIComponent(snap.id)}`);
   };
   const onToggle = (snap) => {
     if (snap.enabled) {
diff --git a/ui/pages/settings/flask/view-snap/view-snap.js b/ui/pages/settings/flask/view-snap/view-snap.js
index f946ca0a9..eab873053 100644
--- a/ui/pages/settings/flask/view-snap/view-snap.js
+++ b/ui/pages/settings/flask/view-snap/view-snap.js
@@ -32,14 +32,12 @@ function ViewSnap() {
   const history = useHistory();
   const location = useLocation();
   const { pathname } = location;
-  const pathNameTail = pathname.match(/[^/]+$/u)[0];
+  // The snap ID is in URI-encoded form in the last path segment of the URL.
+  const decodedSnapId = decodeURIComponent(pathname.match(/[^/]+$/u)[0]);
   const snaps = useSelector(getSnaps);
   const snap = Object.entries(snaps)
     .map(([_, snapState]) => snapState)
-    .find((snapState) => {
-      const decoded = decodeURIComponent(escape(window.atob(pathNameTail)));
-      return snapState.id === decoded;
-    });
+    .find((snapState) => snapState.id === decodedSnapId);
 
   const [isShowingRemoveWarning, setIsShowingRemoveWarning] = useState(false);
 
diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js
index 016fe796e..a397c125d 100644
--- a/ui/selectors/selectors.js
+++ b/ui/selectors/selectors.js
@@ -717,9 +717,7 @@ export const getSnapsRouteObjects = createSelector(getSnaps, (snaps) => {
       tabMessage: () => snap.manifest.proposedName,
       descriptionMessage: () => snap.manifest.description,
       sectionMessage: () => snap.manifest.description,
-      route: `${SNAPS_VIEW_ROUTE}/${window.btoa(
-        unescape(encodeURIComponent(snap.id)),
-      )}`,
+      route: `${SNAPS_VIEW_ROUTE}/${encodeURIComponent(snap.id)}`,
       icon: 'fa fa-flask',
     };
   });