change(ui) - login redirect on initial setup

frontend/app/Router.js

@@ -249,7 +249,7 @@ class Router extends React.Component {
                 <Switch>
                     <Route exact strict path={FORGOT_PASSWORD} component={ForgotPassword} />
                     <Route exact strict path={LOGIN_PATH} component={changePassword ? UpdatePassword : Login} />
-                    {!existingTenant && <Route exact strict path={SIGNUP_PATH} component={Signup} />}
+                    <Route exact strict path={SIGNUP_PATH} component={Signup} />
                     <Redirect to={LOGIN_PATH} />
                 </Switch>
                 {!isEnterprise && <SupportCallout /> }

frontend/app/components/Login/Login.js

@@ -36,9 +36,22 @@ class Login extends React.Component {
     CAPTCHA_ENABLED: window.env.CAPTCHA_ENABLED === 'true',
   };
 
+  static getDerivedStateFromProps(nextProps, prevState) {
+    const { authDetails } = nextProps;
+    if (Object.keys(authDetails).length === 0) {
+      return null;
+    }
+
+    if (!authDetails.tenants) {
+      nextProps.history.push(SIGNUP_ROUTE);
+    }
+
+    return null;
+  }
+
   componentDidMount() {
     const { params } = this.props;
-    this.props.fetchTenants();
+    this.props.fetchTenants()
     const jwt = params.get('jwt');
     if (jwt) {
       this.props.setJwt(jwt);
@@ -156,7 +169,7 @@ class Login extends React.Component {
               {authDetails.sso ? (
                 <a href="/api/sso/saml2" rel="noopener noreferrer">
                   <Button variant="text-primary" type="submit">
-                    {`Login with enterprise account ${
+                    {`Login with SSO ${
                       authDetails.ssoProvider ? `(${authDetails.ssoProvider})` : ''
                     }`}
                   </Button>
@@ -172,8 +185,8 @@ class Login extends React.Component {
                     type="submit"
                     className="pointer-events-none opacity-30"
                   >
-                    {`Login with enterprise account ${
-                      authDetails.ssoProvider ? `(${authDetails.ssoProvider})` : '(SSO)'
+                    {`Login with SSO ${
+                      authDetails.ssoProvider ? `(${authDetails.ssoProvider})` : ''
                     }`}
                   </Button>
                 </Tooltip>

frontend/app/components/Signup/Signup.js

@@ -2,13 +2,17 @@ import React from 'react';
 import withPageTitle from 'HOCs/withPageTitle';
 import { Icon } from 'UI';
 
-import stl from './signup.module.css';
+import { connect } from 'react-redux';
 import cn from 'classnames';
 import SignupForm from './SignupForm';
 import RegisterBg from '../../svg/register.svg';
 import HealthModal from 'Components/Header/HealthStatus/HealthModal/HealthModal';
 import { getHealthRequest } from 'Components/Header/HealthStatus/getHealth';
+import { login } from 'App/routes';
+import { withRouter } from 'react-router-dom';
+import { fetchTenants } from 'Duck/user';
 
+const LOGIN_ROUTE = login();
 const BulletItem = ({ text }) => (
   <div className="flex items-center mb-4">
     <div className="mr-3 h-8 w-8 rounded-full bg-white shadow flex items-center justify-center">
@@ -20,7 +24,14 @@ const BulletItem = ({ text }) => (
 
 const healthStatusCheck_key = '__or__healthStatusCheck_key'
 
+@connect(
+  (state, props) => ({
+    loading: state.getIn(['user', 'loginRequest', 'loading']),
+    authDetails: state.getIn(['user', 'authDetails']),
+  }), { fetchTenants }
+)
 @withPageTitle('Signup - OpenReplay')
+@withRouter
 export default class Signup extends React.Component {
   state = {
     healthModalPassed: localStorage.getItem(healthStatusCheck_key === 'true'),
@@ -28,6 +39,19 @@ export default class Signup extends React.Component {
     healthStatus: null,
   }
 
+  static getDerivedStateFromProps(nextProps, prevState) {
+    const { authDetails } = nextProps;
+    if (Object.keys(authDetails).length === 0) {
+      return null;
+    }
+
+    if (authDetails.tenants) {
+      nextProps.history.push(LOGIN_ROUTE);
+    }
+
+    return null;
+  }
+
   getHealth = async () => {
     this.setState({ healthStatusLoading: true });
     const { healthMap } = await getHealthRequest();
@@ -36,6 +60,11 @@ export default class Signup extends React.Component {
 
   componentDidMount() {
     if (!this.state.healthModalPassed) void this.getHealth();
+
+    const { authDetails } = this.props;
+    if (Object.keys(authDetails).length === 0) {
+      this.props.fetchTenants();
+    }
   }
 
   setHealthModalPassed = () => {