Update index that wraps signin instead of signinpage

ui/src/Signin.tsx

@@ -9,9 +9,6 @@ import {trySources} from 'src/onboarding/apis'
 import {ErrorHandling} from 'src/shared/decorators/errors'
 import {getMe} from 'src/shared/apis/v2/user'
 
-// Utils
-import {AuthContext} from 'src/utils/auth'
-
 // Types
 import {RemoteDataState} from 'src/types'
 
@@ -44,21 +41,23 @@ export class Signin extends PureComponent<Props, State> {
     const isSourcesAllowed = await trySources()
     const isUserSignedIn = isSourcesAllowed
     this.setState({loading: RemoteDataState.Done, isUserSignedIn})
+    this.checkForLogin()
+    this.intervalID = setInterval(this.checkForLogin, FETCH_WAIT)
     if (!isUserSignedIn) {
       this.props.router.push('/signin')
     }
   }
 
+  public componentWillUnmount() {
+    clearInterval(this.intervalID)
+  }
+
   public render() {
     if (this.isLoading) {
       return <div className="page-spinner" />
     }
 
-    return (
+    return this.props.children && React.cloneElement(this.props.children)
-      <AuthContext.Provider value={{onSignInUser: this.handleSignInUser}}>
-        {this.props.children && React.cloneElement(this.props.children)}
-      </AuthContext.Provider>
-    )
   }
 
   private get isLoading(): boolean {
@@ -69,12 +68,6 @@ export class Signin extends PureComponent<Props, State> {
     )
   }
 
-  private handleSignInUser = () => {
-    this.intervalID = setInterval(this.checkForLogin, FETCH_WAIT)
-    this.setState({isUserSignedIn: true})
-    this.props.router.push('/dashboards')
-  }
-
   private checkForLogin = async () => {
     try {
       await getMe()

ui/src/index.tsx

@@ -89,8 +89,8 @@ class Root extends PureComponent {
                 path="/onboarding/:stepID/:substepID"
                 component={OnboardingWizardPage}
               />
-              <Route component={Signin}>
               <Route path="/signin" component={SigninPage} />
+              <Route component={Signin}>
                 <Route component={GetMe}>
                   <Route component={GetOrganizations}>
                     <Route component={App}>

ui/src/onboarding/components/SigninForm.tsx

@@ -1,5 +1,6 @@
 // Libraries
 import React, {PureComponent, ChangeEvent} from 'react'
+import {withRouter, WithRouterProps} from 'react-router'
 import {connect} from 'react-redux'
 import _, {get} from 'lodash'
 
@@ -31,10 +32,9 @@ import * as copy from 'src/shared/copy/notifications'
 import {Links} from 'src/types/v2/links'
 import {Notification, NotificationFunc} from 'src/types'
 
-export interface Props {
+export interface OwnProps {
   links: Links
   notify: (message: Notification | NotificationFunc) => void
-  onSignInUser: () => void
 }
 
 interface State {
@@ -42,6 +42,8 @@ interface State {
   password: string
 }
 
+type Props = OwnProps & WithRouterProps
+
 @ErrorHandling
 class SigninForm extends PureComponent<Props, State> {
   public state: State = {
@@ -101,11 +103,12 @@ class SigninForm extends PureComponent<Props, State> {
   }
 
   private handleSignIn = async (): Promise<void> => {
-    const {notify, onSignInUser} = this.props
+    const {notify, router} = this.props
     const {username, password} = this.state
+
     try {
       await signin({username, password})
-      onSignInUser()
+      router.push('/dashboards')
     } catch (error) {
       const message = get(error, 'data.msg', '')
 
@@ -129,4 +132,4 @@ const mdtp = {
 export default connect(
   mstp,
   mdtp
-)(SigninForm)
+)(withRouter(SigninForm))

ui/src/onboarding/containers/SigninPage.tsx

@@ -7,24 +7,17 @@ import {ErrorHandling} from 'src/shared/decorators/errors'
 import SplashPage from 'src/shared/components/splash_page/SplashPage'
 import SigninForm from 'src/onboarding/components/SigninForm'
 
-// Utils
-import {AuthContext} from 'src/utils/auth'
-
 @ErrorHandling
 class SigninPage extends PureComponent<{}> {
   public render() {
     return (
-      <AuthContext.Consumer>
-        {({onSignInUser}) => (
       <SplashPage panelWidthPixels={300}>
         <SplashPage.Panel>
           <SplashPage.Logo />
           <SplashPage.Header title="InfluxData" />
-              <SigninForm onSignInUser={onSignInUser} />
+          <SigninForm />
         </SplashPage.Panel>
       </SplashPage>
-        )}
-      </AuthContext.Consumer>
     )
   }
 }

ui/src/utils/auth.tsx

@@ -1,7 +0,0 @@
-import React from 'react'
-
-export interface SigninProps {
-  onSignInUser: () => void
-}
-
-export const AuthContext = React.createContext<SigninProps>(null)