Small connection form refactorings

src/browser/modules/Stream/Auth/ChangePasswordFrame.tsx

@@ -22,7 +22,7 @@ import { connect } from 'react-redux'
 
 import FrameBodyTemplate from '../../Frame/FrameBodyTemplate'
 import FrameError from '../../Frame/FrameError'
-import ConnectionForm from './ConnectionForm'
+import ConnectionFormController from './ConnectionFormController'
 import { StyledConnectionAside } from './styled'
 import { Lead } from 'browser-components/Text'
 import { H3 } from 'browser-components/headers'
@@ -71,7 +71,7 @@ class ChangePasswordFrame extends Component<any, ChangePasswordFrameState> {
         </StyledConnectionAside>
 
         {this.props.activeConnection && (
-          <ConnectionForm
+          <ConnectionFormController
             {...this.props}
             error={this.error}
             onSuccess={this.onSuccess}

src/browser/modules/Stream/Auth/ConnectionForm.test.tsx → src/browser/modules/Stream/Auth/ConnectionFormController.test.tsx

@@ -20,7 +20,7 @@
 import { fireEvent, render } from '@testing-library/react'
 import React from 'react'
 
-import { ConnectionForm } from './ConnectionForm'
+import { ConnectionFormController } from './ConnectionFormController'
 import { NATIVE, NO_AUTH } from 'services/bolt/boltHelpers'
 
 test('should print correct state for retaining credentials', async () => {
@@ -41,7 +41,7 @@ test('should print correct state for retaining credentials', async () => {
 
   // When
   const { rerender, getByText, getByTestId } = render(
-    <ConnectionForm
+    <ConnectionFormController
       frame={frame}
       error={error}
       bus={bus}
@@ -74,7 +74,7 @@ test('should print correct state for retaining credentials', async () => {
     authEnabled: true
   }
   rerender(
-    <ConnectionForm
+    <ConnectionFormController
       frame={frame}
       bus={bus}
       activeConnectionData={activeConnectionData}
@@ -99,7 +99,7 @@ test('should print correct state for retaining credentials', async () => {
   // When not storing credentials anymore
   storeCredentials = false
   rerender(
-    <ConnectionForm
+    <ConnectionFormController
       frame={frame}
       bus={bus}
       activeConnectionData={activeConnectionData}

src/browser/modules/Stream/Auth/ConnectionForm.tsx → src/browser/modules/Stream/Auth/ConnectionFormController.tsx

@@ -64,8 +64,8 @@ import {
   stripScheme
 } from 'shared/services/boltscheme.utils'
 import { isCloudHost } from 'shared/services/utils'
-
-type ConnectionFormState = any
+import { Neo4jError } from 'neo4j-driver'
+import { GlobalState } from 'shared/globalState'
 
 const isAuraHost = (host: string) => isCloudHost(host, NEO4J_CLOUD_DOMAINS)
 
@@ -76,7 +76,7 @@ function getAllowedAuthMethodsForHost(host: string): AuthenticationMethod[] {
 const getAllowedSchemesForHost = (host: string, allowedSchemes: string[]) =>
   isAuraHost(host) ? CLOUD_SCHEMES : allowedSchemes
 
-export class ConnectionForm extends Component<any, ConnectionFormState> {
+export class ConnectionFormController extends Component<any, any> {
   constructor(props: any) {
     super(props)
     const connection = this.getConnection()
@@ -106,7 +106,7 @@ export class ConnectionForm extends Component<any, ConnectionFormState> {
     }
   }
 
-  componentDidMount() {
+  componentDidMount(): void {
     const { authenticationMethod } = this.state
     if (authenticationMethod === NO_AUTH) {
       this.connect(() => this.setState({ connecting: false }))
@@ -269,11 +269,17 @@ export class ConnectionForm extends Component<any, ConnectionFormState> {
     this.props.error({})
   }
 
-  onChangePasswordChange() {
+  onChangePasswordChange(): void {
     this.props.error({})
   }
 
-  onChangePassword({ newPassword, error }: any) {
+  onChangePassword({
+    newPassword,
+    error
+  }: {
+    newPassword: string
+    error?: Neo4jError
+  }): void {
     this.setState({ isLoading: true })
     if (error && error.code) {
       this.setState({ isLoading: false })
@@ -332,7 +338,7 @@ export class ConnectionForm extends Component<any, ConnectionFormState> {
     )
   }
 
-  saveAndStart() {
+  saveAndStart(): void {
     this.setState({ forcePasswordChange: false, used: true })
     this.state.successCallback()
     this.props.bus && this.props.bus.send(FOCUS)
@@ -344,7 +350,7 @@ export class ConnectionForm extends Component<any, ConnectionFormState> {
     }
   }
 
-  saveCredentials() {
+  saveCredentials(): void {
     this.props.updateConnection({
       id: CONNECTION_ID,
       host: this.state.host,
@@ -440,7 +446,7 @@ export class ConnectionForm extends Component<any, ConnectionFormState> {
   }
 }
 
-const mapStateToProps = (state: any) => {
+const mapStateToProps = (state: GlobalState) => {
   return {
     discoveredData: getConnectionData(state, CONNECTION_ID),
     initCmd: getInitCmd(state),
@@ -458,7 +464,7 @@ const mapDispatchToProps = (dispatch: any) => {
     updateConnection: (connection: any) => {
       dispatch(updateConnection(connection))
     },
-    setActiveConnection: (id: any) => dispatch(setActiveConnection(id)),
+    setActiveConnection: (id: string) => dispatch(setActiveConnection(id)),
     dispatchInitCmd: (initCmd: any) => dispatch(executeSystemCommand(initCmd))
   }
 }
@@ -481,5 +487,9 @@ const mergeProps = (stateProps: any, dispatchProps: any, ownProps: any) => {
 }
 
 export default withBus(
-  connect(mapStateToProps, mapDispatchToProps, mergeProps)(ConnectionForm)
+  connect(
+    mapStateToProps,
+    mapDispatchToProps,
+    mergeProps
+  )(ConnectionFormController)
 )

src/browser/modules/Stream/Auth/ConnectionFrame.tsx

@@ -21,19 +21,17 @@ import React, { Component } from 'react'
 
 import FrameBodyTemplate from '../../Frame/FrameBodyTemplate'
 import FrameError from '../../Frame/FrameError'
-import ConnectionForm from './ConnectionForm'
+import ConnectionForm from './ConnectionFormController'
 import { StyledConnectionAside, StyledConnectionBodyContainer } from './styled'
 import { Lead } from 'browser-components/Text'
 import { H3 } from 'browser-components/headers'
+import { BaseFrameProps } from '../Stream'
+import { Neo4jError } from 'neo4j-driver'
 
-type State = any
-
-class ConnectionFrame extends Component<any, State> {
-  constructor(props: {}) {
-    super(props)
-    this.state = {
-      error: {}
-    }
+type ConnectionFrameState = { error: Partial<Neo4jError>; success?: true }
+class ConnectionFrame extends Component<BaseFrameProps, ConnectionFrameState> {
+  state: ConnectionFrameState = {
+    error: {}
   }
 
   error(e: any) {