PORTALS-2836: redirect the ELITE program page to the ELITE portal

apps/portals/src/configurations/adknowledgeportal/routesConfig.ts

@@ -235,6 +235,21 @@ const routes: GenericRoute[] = [
       },
     ],
   },
+  {
+    // PORTALS-2836: redirect /Explore/Programs/DetailsPage?Program=ELITE to the ELITE portal
+    exact: true,
+    path: 'Explore/Programs/DetailsPage',
+    hideRouteFromNavbar: true,
+    synapseConfigArray: [
+      {
+        name: 'RedirectToURL',
+        props: {
+          toURL: 'https://eliteportal.synapse.org/',
+          search: 'Program=ELITE',
+        },
+      },
+    ],
+  },
   {
     path: 'Explore',
     routes: [

apps/portals/src/portal-components/RedirectToURL.tsx

@@ -0,0 +1,23 @@
+import { useLocation } from 'react-router-dom'
+
+export type RedirectToURLProps = {
+  toURL: string
+  search?: string
+}
+
+/**
+ * Allows us to use react-router's Redirect as a portal component without losing the query params.
+ * @param props
+ * @returns
+ */
+export default function RedirectToURL(props: RedirectToURLProps) {
+  const { search: currentSearch } = useLocation()
+
+  const { toURL, search } = props
+  const isSearchMatch =
+    search == undefined ? true : `?${search}` == currentSearch
+
+  if (isSearchMatch) {
+    window.location.replace(toURL)
+  }
+}

apps/portals/src/portal-components/index.ts

@@ -15,6 +15,7 @@ import StatusLineChart from './crc-researcher/StatusLineChart'
 import SurveysCompletedPlots from './crc-researcher/SurveysCompletedPlots'
 import Image from './Image'
 import RedirectWithQuery from './RedirectWithQuery'
+import RedirectToURL from './RedirectToURL'
 import { Redirect } from 'react-router-dom'
 import Header from './Header'
 import ChallengeParticipantGoogleMap from './challengeportal/ChallengeParticipantGoogleMap'
@@ -34,6 +35,7 @@ const PortalComponents = {
   StatusLineChart,
   SurveysCompletedPlots,
   Image,
+  RedirectToURL,
   RedirectWithQuery,
   Redirect,
   BrowseToolsPage,

apps/portals/src/types/portal-config.ts

@@ -40,6 +40,7 @@ import { ToggleSynapseObjectsProps } from '../portal-components/ToggleSynapseObj
 import { CSSProperties } from 'react'
 import { TabbedSynapseObjectsProps } from 'portal-components/TabbedSynapseObjects'
 import { ChallengeSubmissionWrapperProps } from 'portal-components/challengeportal/ChallengeSubmissionWrapper'
+import { RedirectToURLProps } from 'portal-components/RedirectToURL'
 
 // For styling the header on the home page -- the main title and the summary text
 export type HomePageHeaderConfig = {
@@ -292,6 +293,11 @@ type RedirectWithQuery = {
   props: RedirectProps
 }
 
+type RedirectToURL = {
+  name: 'RedirectToURL'
+  props: RedirectToURLProps
+}
+
 type Redirect = {
   name: 'Redirect'
   props: RedirectProps
@@ -303,6 +309,7 @@ type Header = {
 }
 
 export type SynapseConfig = (
+  | RedirectToURL
   | RedirectWithQuery
   | Redirect
   | RouteControl