fix(ui): fix first visitor redirection

close #75
ncarlier · Mar 6, 2024 · 91ddfc2 · 91ddfc2
1 parent 81bac41
commit 91ddfc2
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 16 deletions.
diff --git a/ui/README.md b/ui/README.md
@@ -9,9 +9,9 @@ You can configure the UI building process by setting environment variables:
 | Variable | Default | Description |
 |----------|---------|-------------|
 | `REACT_APP_API_ROOT` | `/` | API base URL to use by default if runtime configuration is not set. |
-| `REACT_APP_AUTHORITY` | `none` | Authorithy to use by default if runtime configuration is not set. OpenID Connect authority provider URL or `none` if the authentication is delegated to another system (ex: Basic Auth). |
+| `REACT_APP_AUTHORITY` | `none` | OpenID Connect authorithy to use by default if runtime configuration is not set. OpenID Connect authority provider URL or `none` if the authentication is delegated to another method (ex: Basic Auth). |
 | `REACT_APP_CLIENT_ID` | '' | OpenID Connect client ID. |
-| `REACT_APP_REDIRECT_URL` | `/login` | Page to redirect unauthenticated clients to. |
+| `REACT_APP_PORTAL_URL` | '' | Redirect page for new visitors. |
 
 Example:
 

diff --git a/ui/src/config.ts b/ui/src/config.ts
@@ -7,5 +7,5 @@ export const AUTHORITY = __READFLOW_CONFIG__.authority || process.env.REACT_APP_
 // OIDC client ID
 export const CLIENT_ID = __READFLOW_CONFIG__.client_id || process.env.REACT_APP_CLIENT_ID || ''
 
-// Unauthenticated user redirect
-export const REDIRECT_URL = process.env.REACT_APP_REDIRECT_URL || '/login'
+// Portal URL
+export const PORTAL_URL = process.env.REACT_APP_PORTAL_URL || ''
diff --git a/ui/src/index.tsx b/ui/src/index.tsx
@@ -10,7 +10,7 @@ import { updateAvailable } from './appStore'
 import configureStore from './configureStore'
 import { isTrustedWebActivity } from './helpers'
 import * as serviceWorker from './serviceWorkerRegistration'
-import { AUTHORITY, REDIRECT_URL } from './config'
+import { PORTAL_URL } from './config'
 import { ApplicationState } from './store'
 
 const lastRunKey = 'readflow.lastRun'
@@ -34,14 +34,11 @@ const run = () => {
   localStorage.setItem(lastRunKey, new Date().toISOString())
 }
 
-const shouldRedirectToPortal = () =>
-  !isTrustedWebActivity()
-  && AUTHORITY !== 'none'
-  && localStorage.getItem(lastRunKey) === null
-  && document.location.pathname !== '/login'
+const isFirstVisit = localStorage.getItem(lastRunKey) === null
+const shouldRedirectToPortal = isFirstVisit && PORTAL_URL !== '' && !isTrustedWebActivity() && document.location.pathname !== '/login'
 
-if (shouldRedirectToPortal()) {
-  document.location.replace(REDIRECT_URL)
+if (shouldRedirectToPortal) {
+  document.location.replace(PORTAL_URL)
 } else {
   run()
 }
diff --git a/ui/src/settings/components/PlanManagement.tsx b/ui/src/settings/components/PlanManagement.tsx
@@ -1,27 +1,27 @@
 import React from 'react'
 
 import { Button } from '../../components'
-import { REDIRECT_URL } from '../../config'
+import { PORTAL_URL } from '../../config'
 import { User } from '../../contexts'
 
 interface Props {
   user: User
 }
 
 const UpgradePlanButton = () => (
-  <Button as={'a'} href={`${REDIRECT_URL}/pricing`} target="_blank" variant="primary" title="Upgrade your plan">
+  <Button as={'a'} href={`${PORTAL_URL}/pricing`} target="_blank" variant="primary" title="Upgrade your plan">
     Upgrade your plan
   </Button>
 )
 
 const ManagePlanButton = () => (
-  <Button as={'a'} href={`${REDIRECT_URL}/account`} target="_blank" title="Manage your plan">
+  <Button as={'a'} href={`${PORTAL_URL}/account`} target="_blank" title="Manage your plan">
     Manage your plan
   </Button>
 )
 
 export const PlanManagement = ({ user }: Props) => {
-  if (REDIRECT_URL === 'https://about.readflow.app') {
+  if (PORTAL_URL === 'https://about.readflow.app') {
     return user.customer_id || user.plan === 'premium' ? <ManagePlanButton /> : <UpgradePlanButton />
   }
   return <p>Ask your administrator to update your plan if needed.</p>