fix: [UIE-10136] - Fix Open Re-direction vulnerability in Account Cancel flow. (#13400)

* fix: [UIE-10136] - Fix open redirection vuln in Account Closure flow.

* Added changeset: Fix Open Re-direction vulnerability in Account Cancel flow

* Address review comments from Banks.

Author: tanushree-akamai

packages/manager/.changeset/pr-13400-fixed-1770998728232.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Fixed
+---
+
+Fix Open Re-direction vulnerability in Account Cancel flow ([#13400](https://github.com/linode/manager/pull/13400))

packages/manager/src/features/Account/CloseAccountDialog.tsx

@@ -59,10 +59,10 @@ const CloseAccountDialog = ({ closeDialog, open }: Props) => {
     })
       .then((response) => {
         setIsClosingAccount(false);
-        /** shoot the user off to survey monkey to answer some questions */
+        /** Store survey link as state param for security so that it is not exposed in URL */
         navigate({
           to: '/cancel',
-          search: { survey_link: response.survey_link },
+          state: (prev) => ({ ...prev, surveyLink: response.survey_link }),
         });
       })
       .catch((e: APIError[]) => {

packages/manager/src/features/CancelLanding/CancelLanding.test.tsx

@@ -7,16 +7,27 @@ import { CancelLanding } from './CancelLanding';
 
 const realLocation = window.location;
 
-beforeAll(() => {
-  window.location = realLocation;
+const queryMocks = vi.hoisted(() => ({
+  useLocation: vi.fn(),
+}));
+
+vi.mock('@tanstack/react-router', async () => {
+  const actual = await vi.importActual('@tanstack/react-router');
+  return {
+    ...actual,
+    useLocation: queryMocks.useLocation,
+  };
 });
 
 afterEach(() => {
-  window.location = realLocation;
+  (window as Partial<Window>).location = realLocation;
 });
 
 describe('CancelLanding', () => {
   it('does not render the body when there is no survey_link in the state', () => {
+    queryMocks.useLocation.mockReturnValue({
+      state: {},
+    });
     const { queryByTestId } = renderWithTheme(<CancelLanding />, {
       initialEntries: ['/cancel'],
       initialRoute: '/cancel',
@@ -25,8 +36,11 @@ describe('CancelLanding', () => {
   });
 
   it('renders the body when there is a survey_link in the state', () => {
+    queryMocks.useLocation.mockReturnValue({
+      state: { surveyLink: 'https://linode.com' },
+    });
     const { queryByTestId } = renderWithTheme(<CancelLanding />, {
-      initialEntries: ['/cancel?survey_link=https://linode.com'],
+      initialEntries: ['/cancel'],
       initialRoute: '/cancel',
     });
     expect(queryByTestId('body')).toBeInTheDocument();
@@ -38,11 +52,17 @@ describe('CancelLanding', () => {
     const mockAssign = vi.fn();
     delete (window as Partial<Window>).location;
 
-    window.location = { ...realLocation, assign: mockAssign };
+    (window as Partial<Window>).location = {
+      ...realLocation,
+      assign: mockAssign,
+    };
 
     const surveyLink = 'https://linode.com';
+    queryMocks.useLocation.mockReturnValue({
+      state: { surveyLink },
+    });
     const { getByTestId } = renderWithTheme(<CancelLanding />, {
-      initialEntries: ['/cancel?survey_link=' + encodeURIComponent(surveyLink)],
+      initialEntries: ['/cancel'],
       initialRoute: '/cancel',
     });
     const button = getByTestId('survey-button');

packages/manager/src/features/CancelLanding/CancelLanding.tsx

@@ -1,6 +1,6 @@
 import { Button, H1Header, Typography } from '@linode/ui';
 import { useTheme } from '@mui/material/styles';
-import { redirect, useSearch } from '@tanstack/react-router';
+import { redirect, useLocation } from '@tanstack/react-router';
 import * as React from 'react';
 import { makeStyles } from 'tss-react/mui';
 
@@ -37,10 +37,11 @@ const useStyles = makeStyles()((theme: Theme) => ({
 
 export const CancelLanding = React.memo(() => {
   const { classes } = useStyles();
-  const search = useSearch({ from: '/cancel' });
+  const location = useLocation();
+  const locationState = location.state;
   const theme = useTheme();
 
-  const surveyLink = search.survey_link;
+  const surveyLink = locationState.surveyLink;
 
   if (!surveyLink) {
     throw redirect({ to: '/' });

packages/manager/src/mocks/presets/baseline/crud.ts

@@ -5,6 +5,7 @@ import {
 } from 'src/mocks/presets/crud/handlers/events';
 import { linodeCrudPreset } from 'src/mocks/presets/crud/linodes';
 
+import { accountCrudPreset } from '../crud/account';
 import { cloudNATCrudPreset } from '../crud/cloudnats';
 import { childAccountsCrudPreset } from '../crud/delegation';
 import { domainCrudPreset } from '../crud/domains';
@@ -27,6 +28,7 @@ import type { MockPresetBaseline } from 'src/mocks/types';
 export const baselineCrudPreset: MockPresetBaseline = {
   group: { id: 'General' },
   handlers: [
+    ...accountCrudPreset.handlers,
     ...childAccountsCrudPreset.handlers,
     ...cloudNATCrudPreset.handlers,
     ...domainCrudPreset.handlers,

packages/manager/src/mocks/presets/crud/account.ts

@@ -0,0 +1,10 @@
+import { cancelAccount } from 'src/mocks/presets/crud/handlers/account';
+
+import type { MockPresetCrud } from 'src/mocks/types';
+
+export const accountCrudPreset: MockPresetCrud = {
+  group: { id: 'Account' },
+  handlers: [cancelAccount],
+  id: 'account:crud',
+  label: 'Account CRUD',
+};

packages/manager/src/mocks/presets/crud/handlers/account.ts

@@ -0,0 +1,28 @@
+import { http } from 'msw';
+
+import { makeResponse } from 'src/mocks/utilities/response';
+
+import type { CancelAccount } from '@linode/api-v4';
+import type { StrictResponse } from 'msw';
+import type { MockState } from 'src/mocks/types';
+
+/**
+ * MSW Handlers for Account operations
+ *
+ * This module provides mock handlers for the Account API endpoints.
+ */
+
+export const cancelAccount = (mockState: MockState) => [
+  http.post(
+    '*/account/cancel',
+    async ({ request }): Promise<StrictResponse<CancelAccount>> => {
+      // The payload contains { comments: string } but we don't need to do anything with it for mocking
+      const response: CancelAccount = {
+        survey_link:
+          'https://akamaisurveys.eu.qualtrics.com/jfe/form/abcd?SURVEY_KEY=12345',
+      };
+
+      return makeResponse(response);
+    }
+  ),
+];

packages/manager/src/mocks/types.ts

@@ -132,6 +132,7 @@ export interface MockPresetExtra extends MockPresetBase {
  */
 export type MockPresetCrudGroup = {
   id:
+    | 'Account'
     | 'Child Accounts'
     | 'CloudNATs'
     | 'Delivery'
@@ -153,6 +154,7 @@ export type MockPresetCrudGroup = {
     | 'VPCs';
 };
 export type MockPresetCrudId =
+  | 'account:crud'
   | 'child-accounts-for-user:crud'
   | 'child-accounts:crud'
   | 'cloudnats:crud'

packages/manager/src/routes/auth/index.ts

@@ -13,15 +13,10 @@ interface OAuthCallbackSearch {
   state?: string;
 }
 
-interface CancelLandingSearch {
-  survey_link?: string;
-}
-
 const cancelLandingRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: 'cancel',
   component: CancelLanding,
-  validateSearch: (search: CancelLandingSearch) => search,
 });
 
 const logoutRoute = createRoute({

packages/manager/src/routes/index.tsx

@@ -122,4 +122,7 @@ declare module '@tanstack/react-router' {
     // This infers the type of our router and registers it across the entire project
     router: typeof router;
   }
+  interface HistoryState {
+    surveyLink?: string;
+  }
 }