From 0770046659641ae6e62347599904c1becf0c836d Mon Sep 17 00:00:00 2001 From: Ariel Salem Date: Wed, 27 May 2020 05:45:06 -0700 Subject: [PATCH] feat(redirectTo): added UI part of redirectTo logic for CLOUD users to redirectTo original links after logging in (#18214) --- ui/src/Signin.tsx | 23 ++++++++++++++++++ ui/src/authorizations/apis/index.ts | 12 ++++++---- ui/src/localStorage.ts | 24 +++++++++++++++++++ .../containers/LoginPageContents.tsx | 10 +++++++- 4 files changed, 64 insertions(+), 5 deletions(-) diff --git a/ui/src/Signin.tsx b/ui/src/Signin.tsx index 70717f8222..a6e83d15c0 100644 --- a/ui/src/Signin.tsx +++ b/ui/src/Signin.tsx @@ -8,6 +8,14 @@ import {client} from 'src/utils/api' // Components import {ErrorHandling} from 'src/shared/decorators/errors' import {SpinnerContainer, TechnoSpinner} from '@influxdata/clockface' +import {isFlagEnabled} from 'src/shared/utils/featureFlag' + +// Utils +import { + getFromLocalStorage, + removeFromLocalStorage, + setToLocalStorage, +} from 'src/localStorage' // Actions import {notify as notifyAction} from 'src/shared/actions/notifications' @@ -74,6 +82,10 @@ export class Signin extends PureComponent { private checkForLogin = async () => { try { await client.users.me() + const redirectIsSet = !!getFromLocalStorage('redirectTo') + if (redirectIsSet) { + removeFromLocalStorage('redirectTo') + } } catch (error) { const { location: {pathname}, @@ -81,6 +93,17 @@ export class Signin extends PureComponent { clearInterval(this.intervalID) + if (CLOUD && isFlagEnabled('redirectto')) { + const url = new URL( + `${window.location.origin}${CLOUD_SIGNIN_PATHNAME}?redirectTo=${ + window.location.href + }` + ) + setToLocalStorage('redirectTo', window.location.href) + window.location.href = url.href + throw error + } + if (CLOUD) { // TODO: add returnTo to CLOUD signin window.location.pathname = CLOUD_SIGNIN_PATHNAME diff --git a/ui/src/authorizations/apis/index.ts b/ui/src/authorizations/apis/index.ts index 68d2544971..e10c3f2b97 100644 --- a/ui/src/authorizations/apis/index.ts +++ b/ui/src/authorizations/apis/index.ts @@ -19,11 +19,15 @@ export const createAuthorization = async ( } } -export const getAuth0Config = async (): Promise => { +export const getAuth0Config = async ( + redirectTo?: string +): Promise => { try { - const response = await fetch( - `${getAPIBasepath()}/api/v2private/oauth/clientConfig` - ) + let url = `${getAPIBasepath()}/api/v2private/oauth/clientConfig` + if (redirectTo) { + url = `${getAPIBasepath()}/api/v2private/oauth/clientConfig?redirectTo=${redirectTo}` + } + const response = await fetch(url) const data = await response.json() return data } catch (error) { diff --git a/ui/src/localStorage.ts b/ui/src/localStorage.ts index 667bb3260d..24464b1551 100644 --- a/ui/src/localStorage.ts +++ b/ui/src/localStorage.ts @@ -29,6 +29,30 @@ export const loadLocalStorage = (): LocalStorage => { } } +export const setToLocalStorage = (prop: string, value: any): void => { + try { + window.localStorage.setItem(prop, value) + } catch (error) { + console.error('unable to setItem onto localStorage: ', error) + } +} + +export const getFromLocalStorage = (prop: string): any => { + try { + return window.localStorage.getItem(prop) + } catch (error) { + console.error('unable to getItem onto localStorage: ', error) + } +} + +export const removeFromLocalStorage = (prop: string): void => { + try { + return window.localStorage.removeItem(prop) + } catch (error) { + console.error('unable to getItem onto localStorage: ', error) + } +} + const isValidJSONString = errorString => { try { JSON.parse(errorString) diff --git a/ui/src/onboarding/containers/LoginPageContents.tsx b/ui/src/onboarding/containers/LoginPageContents.tsx index 872c369c3d..75349598d7 100644 --- a/ui/src/onboarding/containers/LoginPageContents.tsx +++ b/ui/src/onboarding/containers/LoginPageContents.tsx @@ -22,6 +22,7 @@ import auth0js, {WebAuth} from 'auth0-js' import {LoginForm} from 'src/onboarding/components/LoginForm' import {SocialButton} from 'src/shared/components/SocialButton' import {GoogleLogo} from 'src/clientLibraries/graphics' +import {isFlagEnabled} from 'src/shared/utils/featureFlag' // Types import {Auth0Connection, FormFieldValidation} from 'src/types' @@ -30,6 +31,7 @@ import {Auth0Connection, FormFieldValidation} from 'src/types' import {notify} from 'src/shared/actions/notifications' import {passwordResetSuccessfully} from 'src/shared/copy/notifications' import {getAuth0Config} from 'src/authorizations/apis' +import {getFromLocalStorage} from 'src/localStorage' interface ErrorObject { emailError?: string @@ -61,7 +63,13 @@ class LoginPageContents extends PureComponent { public async componentDidMount() { try { - const config = await getAuth0Config() + let config + if (isFlagEnabled('redirectto')) { + const redirectTo = getFromLocalStorage('redirectTo') || '/' + config = await getAuth0Config(redirectTo) + } else { + config = await getAuth0Config() + } this.auth0 = new auth0js.WebAuth({ domain: config.domain, clientID: config.clientID,