Rename all store references to lowercase

Store references are class instances and should use lowercase, using uppercase should be reserved for referencing static class methods.

src/components/App.jsx

@@ -29,7 +29,7 @@ import MigrationDetailsPage from './pages/MigrationDetailsPage'
 import EndpointsPage from './pages/EndpointsPage'
 import EndpointDetailsPage from './pages/EndpointDetailsPage'
 import WizardPage from './pages/WizardPage'
-import UserStore from '../stores/UserStore'
+import userStore from '../stores/UserStore'
 import AssessmentsPage from './pages/AssessmentsPage'
 import AssessmentDetailsPage from './pages/AssessmentDetailsPage'
 
@@ -54,7 +54,7 @@ const Wrapper = styled.div``
 
 class App extends React.Component<{}> {
   componentWillMount() {
-    UserStore.tokenLogin()
+    userStore.tokenLogin()
   }
 
   render() {

src/components/atoms/CopyMultilineValue/index.jsx

@@ -20,7 +20,7 @@ import styled from 'styled-components'
 
 import CopyButton from '../CopyButton'
 import DomUtils from '../../../utils/DomUtils'
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 
 const Wrapper = styled.div`
   cursor: pointer;
@@ -46,7 +46,7 @@ class CopyMultineValue extends React.Component<Props> {
     if (this.props.onCopy) this.props.onCopy(this.props.value)
 
     if (succesful) {
-      NotificationStore.notify('The message has been copied to clipboard.')
+      notificationStore.notify('The message has been copied to clipboard.')
     }
   }
 

src/components/atoms/CopyValue/index.jsx

@@ -20,7 +20,7 @@ import styled from 'styled-components'
 
 import CopyButton from '../CopyButton'
 import DomUtils from '../../../utils/DomUtils'
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 
 const Wrapper = styled.div`
   cursor: pointer;
@@ -55,9 +55,9 @@ class CopyValue extends React.Component<Props> {
     if (this.props.onCopy) this.props.onCopy(this.props.value)
 
     if (succesful) {
-      NotificationStore.notify('The value has been copied to clipboard.')
+      notificationStore.notify('The value has been copied to clipboard.')
     } else {
-      NotificationStore.notify('The value couldn\'t be copied', 'error')
+      notificationStore.notify('The value couldn\'t be copied', 'error')
     }
   }
 

src/components/molecules/ScheduleItem/index.jsx

@@ -29,7 +29,7 @@ import { executionOptions } from '../../../config'
 import Palette from '../../styleUtils/Palette'
 import StyleProps from '../../styleUtils/StyleProps'
 import DateUtils from '../../../utils/DateUtils'
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 import deleteImage from './images/delete.svg'
 import deleteHoverImage from './images/delete-hover.svg'
 import saveImage from './images/save.svg'
@@ -145,7 +145,7 @@ class ScheduleItem extends React.Component<Props> {
   handleExpirationDateChange(date: Date) {
     let newDate = moment(date)
     if (newDate.diff(new Date(), 'minutes') < 60) {
-      NotificationStore.notify('Please select a further expiration date.', 'error')
+      notificationStore.notify('Please select a further expiration date.', 'error')
       return
     }
 

src/components/molecules/TaskItem/index.jsx

@@ -26,7 +26,7 @@ import StatusPill from '../../atoms/StatusPill'
 import CopyValue from '../../atoms/CopyValue'
 import ProgressBar from '../../atoms/ProgressBar'
 import CopyButton from '../../atoms/CopyButton'
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 import DomUtils from '../../../utils/DomUtils'
 import Palette from '../../styleUtils/Palette'
 import StyleProps from '../../styleUtils/StyleProps'
@@ -161,7 +161,7 @@ class TaskItem extends React.Component<Props> {
     let succesful = DomUtils.copyTextToClipboard(exceptionText)
 
     if (succesful) {
-      NotificationStore.notify('The message has been copied to clipboard.')
+      notificationStore.notify('The message has been copied to clipboard.')
     }
   }
 

src/components/organisms/DetailsPageHeader/index.jsx

@@ -23,7 +23,7 @@ import NotificationDropdown from '../../molecules/NotificationDropdown'
 import UserDropdown from '../../molecules/UserDropdown'
 import type { User as UserType } from '../../../types/User'
 
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 
 import backgroundImage from './images/star-bg.jpg'
 import logoImage from './images/logo.svg'
@@ -61,11 +61,11 @@ type Props = {
 @observer
 export class DetailsPageHeader extends React.Component<Props> {
   componentDidMount() {
-    NotificationStore.loadNotifications()
+    notificationStore.loadNotifications()
   }
 
   handleNotificationsClose() {
-    NotificationStore.clearNotifications()
+    notificationStore.clearNotifications()
   }
 
   render() {
@@ -76,7 +76,7 @@ export class DetailsPageHeader extends React.Component<Props> {
           <Logo href="/#/replicas" />
         </Menu>
         <User>
-          <NotificationDropdown white items={NotificationStore.persistedNotifications} onClose={() => this.handleNotificationsClose()} />
+          <NotificationDropdown white items={notificationStore.persistedNotifications} onClose={() => this.handleNotificationsClose()} />
           <UserDropdownStyled
             white
             user={this.props.user}

src/components/organisms/Endpoint/index.jsx

@@ -29,9 +29,9 @@ import LoadingButton from '../../molecules/LoadingButton'
 
 import type { Endpoint as EndpointType } from '../../../types/Endpoint'
 import type { Field } from '../../../types/Field'
-import NotificationStore from '../../../stores/NotificationStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import ProviderStore from '../../../stores/ProviderStore'
+import notificationStore from '../../../stores/NotificationStore'
+import endpointStore from '../../../stores/EndpointStore'
+import providerStore from '../../../stores/ProviderStore'
 import ObjectUtils from '../../../utils/ObjectUtils'
 import Palette from '../../styleUtils/Palette'
 import DomUtils from '../../../utils/DomUtils'
@@ -148,31 +148,31 @@ class Endpoint extends React.Component<Props, State> {
 
   componentWillMount() {
     this.componentWillReceiveProps(this.props)
-    this.providerStoreObserver = observe(ProviderStore, 'connectionInfoSchema', () => {
+    this.providerStoreObserver = observe(providerStore, 'connectionInfoSchema', () => {
       this.props.onResizeUpdate(this.scrollableRef)
     })
-    this.endpointValidationObserver = observe(EndpointStore, 'validation', () => {
+    this.endpointValidationObserver = observe(endpointStore, 'validation', () => {
       this.componentWillReceiveProps(this.props)
     })
   }
 
   componentDidMount() {
-    ProviderStore.getConnectionInfoSchema(this.getEndpointType())
+    providerStore.getConnectionInfoSchema(this.getEndpointType())
     KeyboardManager.onEnter('endpoint', () => { if (this.isValidateButtonEnabled) this.handleValidateClick() }, 2)
   }
 
   componentWillReceiveProps(props: Props) {
     if (this.state.validating) {
-      if (EndpointStore.validation && !EndpointStore.validation.valid) {
+      if (endpointStore.validation && !endpointStore.validation.valid) {
         this.setState({ validating: false })
       }
     }
 
-    if (props.endpoint && EndpointStore.connectionInfo) {
+    if (props.endpoint && endpointStore.connectionInfo) {
       this.setState({
         endpoint: {
           ...ObjectUtils.flatten(props.endpoint || {}),
-          ...ObjectUtils.flatten(EndpointStore.connectionInfo || {}),
+          ...ObjectUtils.flatten(endpointStore.connectionInfo || {}),
         },
       })
     } else {
@@ -189,8 +189,8 @@ class Endpoint extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
-    EndpointStore.clearValidation()
-    ProviderStore.clearConnectionInfoSchema()
+    endpointStore.clearValidation()
+    providerStore.clearConnectionInfoSchema()
     clearTimeout(this.closeTimeout)
     KeyboardManager.removeKeyDown('endpoint')
     this.providerStoreObserver()
@@ -234,8 +234,8 @@ class Endpoint extends React.Component<Props, State> {
     if (!this.highlightRequired()) {
       this.setState({ validating: true })
 
-      NotificationStore.notify('Saving endpoint ...')
-      EndpointStore.clearValidation()
+      notificationStore.notify('Saving endpoint ...')
+      endpointStore.clearValidation()
 
       if (this.state.isNew) {
         this.add()
@@ -243,7 +243,7 @@ class Endpoint extends React.Component<Props, State> {
         this.update()
       }
     } else {
-      NotificationStore.notify('Please fill all the required fields', 'error')
+      notificationStore.notify('Please fill all the required fields', 'error')
     }
   }
 
@@ -254,20 +254,20 @@ class Endpoint extends React.Component<Props, State> {
   }
 
   handleCopyErrorMessageClick() {
-    if (!EndpointStore.validation) {
+    if (!endpointStore.validation) {
       return
     }
     // $FlowIssue
-    let succesful = DomUtils.copyTextToClipboard(EndpointStore.validation.message)
+    let succesful = DomUtils.copyTextToClipboard(endpointStore.validation.message)
 
     if (succesful) {
-      NotificationStore.notify('The message has been copied to clipboard.')
+      notificationStore.notify('The message has been copied to clipboard.')
     }
   }
 
   handleCancelClick() {
     if (this.props.deleteOnCancel && this.state.isNew === false) {
-      EndpointStore.delete(EndpointStore.endpoints[0])
+      endpointStore.delete(endpointStore.endpoints[0])
     }
     this.props.onCancelClick()
   }
@@ -283,10 +283,10 @@ class Endpoint extends React.Component<Props, State> {
       return
     }
 
-    EndpointStore.update(this.state.endpoint).then(() => {
-      NotificationStore.notify('Validating endpoint ...')
+    endpointStore.update(this.state.endpoint).then(() => {
+      notificationStore.notify('Validating endpoint ...')
       // $FlowIssue
-      EndpointStore.validate(this.state.endpoint)
+      endpointStore.validate(this.state.endpoint)
     })
   }
 
@@ -295,16 +295,16 @@ class Endpoint extends React.Component<Props, State> {
       return
     }
 
-    EndpointStore.add(this.state.endpoint).then(() => {
-      let endpoint = EndpointStore.endpoints[0]
+    endpointStore.add(this.state.endpoint).then(() => {
+      let endpoint = endpointStore.endpoints[0]
       this.setState({ isNew: false, endpoint: ObjectUtils.flatten(endpoint) })
-      NotificationStore.notify('Validating endpoint ...')
-      EndpointStore.validate(endpoint)
+      notificationStore.notify('Validating endpoint ...')
+      endpointStore.validate(endpoint)
     })
   }
 
   renderEndpointStatus() {
-    const validation = EndpointStore.validation
+    const validation = endpointStore.validation
     if (!this.state.validating && !validation) {
       return null
     }
@@ -348,8 +348,8 @@ class Endpoint extends React.Component<Props, State> {
     let actionButton = <Button large onClick={() => this.handleValidateClick()}>Validate and save</Button>
 
     let message = 'Validating Endpoint ...'
-    if (this.state.validating || (EndpointStore.validation && EndpointStore.validation.valid)) {
-      if (EndpointStore.validation && EndpointStore.validation.valid) {
+    if (this.state.validating || (endpointStore.validation && endpointStore.validation.valid)) {
+      if (endpointStore.validation && endpointStore.validation.valid) {
         message = 'Saving ...'
       }
 
@@ -367,16 +367,16 @@ class Endpoint extends React.Component<Props, State> {
 
   renderContent() {
     const endpointType = this.getEndpointType()
-    if (ProviderStore.connectionSchemaLoading || !endpointType) {
+    if (providerStore.connectionSchemaLoading || !endpointType) {
       return null
     }
     return (
       <Content>
         {this.renderEndpointStatus()}
         {React.createElement(ContentPlugin[endpointType] || ContentPlugin.default, {
-          connectionInfoSchema: ProviderStore.connectionInfoSchema,
+          connectionInfoSchema: providerStore.connectionInfoSchema,
           // $FlowIgnore
-          validation: EndpointStore.validation,
+          validation: endpointStore.validation,
           invalidFields: this.state.invalidFields,
           validating: this.state.validating,
           disabled: this.state.validating,
@@ -404,7 +404,7 @@ class Endpoint extends React.Component<Props, State> {
   }
 
   renderLoading() {
-    if (!ProviderStore.connectionSchemaLoading) {
+    if (!providerStore.connectionSchemaLoading) {
       return null
     }
 
@@ -417,7 +417,7 @@ class Endpoint extends React.Component<Props, State> {
   }
 
   render() {
-    if (EndpointStore.validation && EndpointStore.validation.valid
+    if (endpointStore.validation && endpointStore.validation.valid
       && !this.closeTimeout) {
       this.closeTimeout = setTimeout(() => {
         this.props.onCancelClick({ autoClose: true })

src/components/organisms/EndpointValidation/index.jsx

@@ -25,7 +25,7 @@ import StatusImage from '../../atoms/StatusImage'
 import Palette from '../../styleUtils/Palette'
 import type { Validation as ValidationType } from '../../../types/Endpoint'
 
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 import DomUtils from '../../../utils/DomUtils'
 
 const Wrapper = styled.div`
@@ -83,9 +83,9 @@ class EndpointValidation extends React.Component<Props> {
     let succesful = DomUtils.copyTextToClipboard(message)
 
     if (succesful) {
-      NotificationStore.notify('The value has been copied to clipboard.')
+      notificationStore.notify('The value has been copied to clipboard.')
     } else {
-      NotificationStore.notify('The value couldn\'t be copied', 'error')
+      notificationStore.notify('The value couldn\'t be copied', 'error')
     }
   }
 

src/components/organisms/LoginForm/index.jsx

@@ -28,7 +28,7 @@ import StyleProps from '../../styleUtils/StyleProps'
 import errorIcon from './images/error.svg'
 
 import { loginButtons } from '../../../config'
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 
 const Form = styled.form`
   background: rgba(221, 224, 229, 0.5);
@@ -120,7 +120,7 @@ class LoginForm extends React.Component<Props, State> {
     e.preventDefault()
 
     if (this.state.username.length === 0 || this.state.password.length === 0) {
-      NotificationStore.notify('Please fill in all fields')
+      notificationStore.notify('Please fill in all fields')
     } else {
       this.props.onFormSubmit({ username: this.state.username, password: this.state.password })
     }

src/components/organisms/Notifications/index.jsx

@@ -20,7 +20,7 @@ import styled, { injectGlobal } from 'styled-components'
 import NotificationSystem from 'react-notification-system'
 import { observe } from 'mobx'
 
-import NotificationStore from '../../../stores/NotificationStore'
+import notificationStore from '../../../stores/NotificationStore'
 import type { NotificationItem } from '../../../types/NotificationItem'
 
 import NotificationsStyle from './style.js'
@@ -42,7 +42,7 @@ class Notifications extends React.Component<{}> {
   }
 
   componentDidMount() {
-    observe(NotificationStore.notifications, change => {
+    observe(notificationStore.notifications, change => {
       this.handleStoreChange(change.object)
     })
   }

src/components/organisms/PageHeader/index.jsx

@@ -27,10 +27,10 @@ import Modal from '../../molecules/Modal'
 import ChooseProvider from '../../organisms/ChooseProvider'
 import Endpoint from '../../organisms/Endpoint'
 
-import ProjectStore from '../../../stores/ProjectStore'
-import UserStore from '../../../stores/UserStore'
-import NotificationStore from '../../../stores/NotificationStore'
-import ProviderStore from '../../../stores/ProviderStore'
+import projectStore from '../../../stores/ProjectStore'
+import userStore from '../../../stores/UserStore'
+import notificationStore from '../../../stores/NotificationStore'
+import providerStore from '../../../stores/ProviderStore'
 import Palette from '../../styleUtils/Palette'
 import StyleProps from '../../styleUtils/StyleProps'
 
@@ -81,13 +81,13 @@ class PageHeader extends React.Component<Props, State> {
   }
 
   componentDidMount() {
-    NotificationStore.loadNotifications()
+    notificationStore.loadNotifications()
   }
 
   getCurrentProject() {
-    let project = UserStore.user && UserStore.user.project ? UserStore.user.project : null
+    let project = userStore.user && userStore.user.project ? userStore.user.project : null
     if (project) {
-      return ProjectStore.projects.find(p => p.id === project.id)
+      return projectStore.projects.find(p => p.id === project.id)
     }
 
     return null
@@ -96,7 +96,7 @@ class PageHeader extends React.Component<Props, State> {
   handleUserItemClick(item: { value: string }) {
     switch (item.value) {
       case 'signout':
-        UserStore.logout()
+        userStore.logout()
         return
       case 'profile':
         window.location.href = '/#/profile'
@@ -108,7 +108,7 @@ class PageHeader extends React.Component<Props, State> {
   handleNewItem(item: ItemType) {
     switch (item.value) {
       case 'endpoint':
-        ProviderStore.loadProviders()
+        providerStore.loadProviders()
         if (this.props.onModalOpen) {
           this.props.onModalOpen()
         }
@@ -119,7 +119,7 @@ class PageHeader extends React.Component<Props, State> {
   }
 
   handleNotificationsClose() {
-    NotificationStore.clearNotifications()
+    notificationStore.clearNotifications()
   }
 
   handleCloseChooseProviderModal() {
@@ -149,8 +149,8 @@ class PageHeader extends React.Component<Props, State> {
   }
 
   handleProjectChange(project: Project) {
-    UserStore.switchProject(project.id).then(() => {
-      ProjectStore.getProjects()
+    userStore.switchProject(project.id).then(() => {
+      projectStore.getProjects()
 
       if (this.props.onProjectChange) {
         this.props.onProjectChange(project)
@@ -165,14 +165,14 @@ class PageHeader extends React.Component<Props, State> {
         <Controls>
           <Dropdown
             selectedItem={this.getCurrentProject()}
-            items={ProjectStore.projects}
+            items={projectStore.projects}
             onChange={project => { this.handleProjectChange(project) }}
             noItemsMessage="Loading..."
             labelField="name"
           />
           <NewItemDropdown onChange={item => { this.handleNewItem(item) }} />
-          <NotificationDropdown items={NotificationStore.persistedNotifications} onClose={() => this.handleNotificationsClose()} />
-          <UserDropdown user={UserStore.user} onItemClick={item => { this.handleUserItemClick(item) }} />
+          <NotificationDropdown items={notificationStore.persistedNotifications} onClose={() => this.handleNotificationsClose()} />
+          <UserDropdown user={userStore.user} onItemClick={item => { this.handleUserItemClick(item) }} />
         </Controls>
         <Modal
           isOpen={this.state.showChooseProviderModal}
@@ -181,8 +181,8 @@ class PageHeader extends React.Component<Props, State> {
         >
           <ChooseProvider
             onCancelClick={() => { this.handleCloseChooseProviderModal() }}
-            providers={ProviderStore.providers}
-            loading={ProviderStore.providersLoading}
+            providers={providerStore.providers}
+            loading={providerStore.providersLoading}
             onProviderClick={providerName => { this.handleProviderClick(providerName) }}
           />
         </Modal>

src/components/organisms/ReplicaDetailsContent/index.jsx

@@ -18,7 +18,7 @@ import React from 'react'
 import styled from 'styled-components'
 import { observer } from 'mobx-react'
 
-import ScheduleStore from '../../../stores/ScheduleStore'
+import scheduleStore from '../../../stores/ScheduleStore'
 import Button from '../../atoms/Button'
 import DetailsNavigation from '../../molecules/DetailsNavigation'
 import MainDetails from '../../organisms/MainDetails'
@@ -71,7 +71,7 @@ type TimezoneValue = 'utc' | 'local'
 type Props = {
   item: ?MainItem,
   endpoints: Endpoint[],
-  scheduleStore: typeof ScheduleStore,
+  scheduleStore: typeof scheduleStore,
   page: string,
   detailsLoading: boolean,
   executionsLoading: boolean,

src/components/organisms/WizardPageContent/index.jsx

@@ -38,11 +38,11 @@ import type { Instance, Nic } from '../../../types/Instance'
 import type { Field } from '../../../types/Field'
 import type { Network } from '../../../types/Network'
 import type { Schedule as ScheduleType } from '../../../types/Schedule'
-import InstanceStore from '../../../stores/InstanceStore'
-import ProviderStore from '../../../stores/ProviderStore'
+import instanceStore from '../../../stores/InstanceStore'
+import providerStore from '../../../stores/ProviderStore'
 
 import migrationArrowImage from './images/migration.js'
-import NetworkStore from '../../../stores/NetworkStore'
+import networkStore from '../../../stores/NetworkStore'
 
 const Wrapper = styled.div`
   ${StyleProps.exactWidth(`${parseInt(StyleProps.contentWidth, 10) + 64}px`)}
@@ -94,9 +94,9 @@ type Props = {
   page: { id: string, title: string },
   type: 'replica' | 'migration',
   nextButtonDisabled: boolean,
-  providerStore: typeof ProviderStore,
-  instanceStore: typeof InstanceStore,
-  networkStore: typeof NetworkStore,
+  providerStore: typeof providerStore,
+  instanceStore: typeof instanceStore,
+  networkStore: typeof networkStore,
   wizardData: WizardData,
   endpoints: Endpoint[],
   onTypeChange: (isReplicaChecked: ?boolean) => void,
@@ -197,9 +197,9 @@ class WizardPageContent extends React.Component<Props, State> {
   isOptionsPageValid() {
     const isValid = (field: Field): boolean => {
       return (this.props.wizardData.options &&
-          this.props.wizardData.options[field.name] !== null &&
-          this.props.wizardData.options[field.name] !== undefined &&
-          this.props.wizardData.options[field.name] !== ''
+        this.props.wizardData.options[field.name] !== null &&
+        this.props.wizardData.options[field.name] !== undefined &&
+        this.props.wizardData.options[field.name] !== ''
       ) || (field.default !== null && field.default !== undefined)
     }
 

src/components/pages/AssessmentDetailsPage/index.jsx

@@ -30,14 +30,14 @@ import type { VmItem, VmSize } from '../../../types/Assessment'
 import type { Field } from '../../../types/Field'
 import type { Network, NetworkMap } from '../../../types/Network'
 
-import AzureStore from '../../../stores/AzureStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import NotificationStore from '../../../stores/NotificationStore'
-import ReplicaStore from '../../../stores/ReplicaStore'
-import InstanceStore from '../../../stores/InstanceStore'
-import NetworkStore from '../../../stores/NetworkStore'
-import UserStore from '../../../stores/UserStore'
-import AssessmentStore from '../../../stores/AssessmentStore'
+import azureStore from '../../../stores/AzureStore'
+import endpointStore from '../../../stores/EndpointStore'
+import notificationStore from '../../../stores/NotificationStore'
+import replicaStore from '../../../stores/ReplicaStore'
+import instanceStore from '../../../stores/InstanceStore'
+import networkStore from '../../../stores/NetworkStore'
+import userStore from '../../../stores/UserStore'
+import assessmentStore from '../../../stores/AssessmentStore'
 
 import assessmentImage from './images/assessment.svg'
 
@@ -78,9 +78,9 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
-    AzureStore.clearAssessmentDetails()
-    AzureStore.clearAssessedVms()
-    InstanceStore.clearInstancesDetails()
+    azureStore.clearAssessmentDetails()
+    azureStore.clearAssessedVms()
+    instanceStore.clearInstancesDetails()
   }
 
   getUrlInfo() {
@@ -89,8 +89,8 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
   }
 
   getEndpoints() {
-    let vms = AzureStore.assessedVms
-    let connectionsInfo = EndpointStore.connectionsInfo
+    let vms = azureStore.assessedVms
+    let connectionsInfo = endpointStore.connectionsInfo
 
     if (vms.length === 0 || connectionsInfo.length === 0) {
       return []
@@ -103,17 +103,17 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
   }
 
   getInstancesDetailsProgress() {
-    let count = InstanceStore.instancesDetailsCount
+    let count = instanceStore.instancesDetailsCount
     if (count < 5) {
       return null
     }
-    let remaining = InstanceStore.instancesDetailsRemaining
+    let remaining = instanceStore.instancesDetailsRemaining
     return (count - remaining) / count
   }
 
   getFilteredAssessedVms(vms?: VmItem[]) {
     if (!vms) {
-      vms = AzureStore.assessedVms
+      vms = azureStore.assessedVms
     }
     return vms.filter(vm =>
       `${vm.properties.datacenterContainer}/${vm.properties.displayName}`.toLowerCase().indexOf(this.state.vmSearchValue.toLowerCase()) > -1
@@ -125,7 +125,7 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
   }
 
   getEnabledVms() {
-    let sourceConnInfo = EndpointStore.connectionsInfo.find(e => e.id === this.getSourceEndpointId())
+    let sourceConnInfo = endpointStore.connectionsInfo.find(e => e.id === this.getSourceEndpointId())
     if (!sourceConnInfo) {
       return []
     }
@@ -134,9 +134,9 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
     if (!sourceHost) {
       return []
     }
-    return AzureStore.assessedVms.filter(vm => {
+    return azureStore.assessedVms.filter(vm => {
       if (vm.properties.datacenterManagementServer.toLowerCase() === sourceHost.toLowerCase() &&
-        InstanceStore.instances.find(i => i.instance_name === `${vm.properties.datacenterContainer}/${vm.properties.displayName}`)) {
+        instanceStore.instances.find(i => i.instance_name === `${vm.properties.datacenterContainer}/${vm.properties.displayName}`)) {
         return true
       }
       return false
@@ -166,7 +166,7 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
   handleSourceEndpointChange(sourceEndpoint: ?Endpoint) {
     this.setState({ sourceEndpoint, selectedVms: [], selectedNetworks: [] })
-    InstanceStore.loadInstances(this.getSourceEndpointId(), true, true).then(() => {
+    instanceStore.loadInstances(this.getSourceEndpointId(), true, true).then(() => {
       this.initSelectedVms()
       this.loadInstancesDetails()
     })
@@ -175,7 +175,7 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
   handleUserItemClick(item: { value: string }) {
     switch (item.value) {
       case 'signout':
-        UserStore.logout()
+        userStore.logout()
         return
       case 'profile':
         window.location.href = '/#/profile'
@@ -198,8 +198,8 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
   handleRefresh() {
     let urlInfo = this.getUrlInfo()
-    AzureStore.getAssessmentDetails({ ...urlInfo })
-    AzureStore.getAssessedVms({ ...urlInfo })
+    azureStore.getAssessmentDetails({ ...urlInfo })
+    azureStore.getAssessedVms({ ...urlInfo })
     this.loadInstancesDetails()
   }
 
@@ -212,7 +212,7 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
   }
 
   handleMigrationExecute(options: Field[]) {
-    let selectedInstances = InstanceStore.instancesDetails
+    let selectedInstances = instanceStore.instancesDetails
       .filter(i => this.state.selectedVms.find(m => i.instance_name === `${m.properties.datacenterContainer}/${m.properties.displayName}`))
     let vmSizes = {}
     selectedInstances.forEach(i => {
@@ -222,14 +222,14 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
     this.setState({ executeButtonDisabled: true })
 
-    AssessmentStore.migrate({
+    assessmentStore.migrate({
       source: this.state.sourceEndpoint,
       target: this.getUrlInfo().endpoint,
       networks: [...this.state.selectedNetworks],
       options: [...options],
       destinationEnv: {
         resource_group: this.getUrlInfo().resourceGroupName,
-        location: AzureStore.assessmentDetails ? AzureStore.assessmentDetails.properties.azureLocation : '',
+        location: azureStore.assessmentDetails ? azureStore.assessmentDetails.properties.azureLocation : '',
       },
       vmSizes,
       selectedInstances,
@@ -237,11 +237,11 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
       this.setState({ showMigrationOptions: false })
       let useReplicaOption = options.find(o => o.name === 'use_replica')
       let type = useReplicaOption && useReplicaOption.value ? 'Replica' : 'Migration'
-      NotificationStore.notify(`${type} was succesfully created`, 'success', { persist: true, persistInfo: { title: `${type} created` } })
+      notificationStore.notify(`${type} was succesfully created`, 'success', { persist: true, persistInfo: { title: `${type} created` } })
 
       if (type === 'Replica') {
-        AssessmentStore.migrations.forEach(replica => {
-          ReplicaStore.execute(replica.id, options)
+        assessmentStore.migrations.forEach(replica => {
+          replicaStore.execute(replica.id, options)
         })
       }
 
@@ -266,14 +266,14 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
   azureAuthenticate() {
     let connectionInfo = this.getUrlInfo().connectionInfo
-    AzureStore.authenticate(connectionInfo.user_credentials.username, connectionInfo.user_credentials.password).then(() => {
+    azureStore.authenticate(connectionInfo.user_credentials.username, connectionInfo.user_credentials.password).then(() => {
       this.loadAssessmentDetails()
     })
   }
 
   loadSourceEndpoints() {
-    EndpointStore.getEndpoints({ showLoading: true }).then(() => {
-      EndpointStore.getConnectionsInfo(EndpointStore.endpoints.filter(e => e.type === 'vmware_vsphere')).then(() => {
+    endpointStore.getEndpoints({ showLoading: true }).then(() => {
+      endpointStore.getConnectionsInfo(endpointStore.endpoints.filter(e => e.type === 'vmware_vsphere')).then(() => {
         let endpoints = this.getEndpoints()
         let sourceEndpoint = endpoints.find(e => e.id === this.getSourceEndpointId())
         if (sourceEndpoint) {
@@ -289,11 +289,11 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
   loadAssessmentDetails() {
     let urlInfo = this.getUrlInfo()
-    AzureStore.getAssessmentDetails({ ...urlInfo }).then(() => {
-      AzureStore.getVmSizes({ ...urlInfo, location: AzureStore.assessmentDetails ? AzureStore.assessmentDetails.properties.azureLocation : '' })
+    azureStore.getAssessmentDetails({ ...urlInfo }).then(() => {
+      azureStore.getVmSizes({ ...urlInfo, location: azureStore.assessmentDetails ? azureStore.assessmentDetails.properties.azureLocation : '' })
       this.loadNetworks()
     })
-    AzureStore.getAssessedVms({ ...urlInfo }).then(() => {
+    azureStore.getAssessedVms({ ...urlInfo }).then(() => {
       this.initVmSizes()
       this.loadSourceEndpoints()
     })
@@ -305,7 +305,7 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
   initVmSizes() {
     let vmSizes = {}
-    let vms = AzureStore.assessedVms
+    let vms = azureStore.assessedVms
 
     vms.forEach(vm => {
       vmSizes[vm.id] = { name: vm.properties.recommendedSize }
@@ -316,23 +316,23 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
 
   loadNetworks() {
     this.setState({ selectedNetworks: [] })
-    let details = AzureStore.assessmentDetails
-    NetworkStore.loadNetworks(this.getUrlInfo().endpoint.id, {
+    let details = azureStore.assessmentDetails
+    networkStore.loadNetworks(this.getUrlInfo().endpoint.id, {
       location: details ? details.properties.azureLocation : '',
       resource_group: this.getUrlInfo().resourceGroupName,
     })
   }
 
   loadInstancesDetails() {
-    let instances = InstanceStore.instances.filter(i => this.state.selectedVms.find(m => i.instance_name === `${m.properties.datacenterContainer}/${m.properties.displayName}`))
-    InstanceStore.clearInstancesDetails()
-    InstanceStore.loadInstancesDetails(this.getSourceEndpointId(), instances)
+    let instances = instanceStore.instances.filter(i => this.state.selectedVms.find(m => i.instance_name === `${m.properties.datacenterContainer}/${m.properties.displayName}`))
+    instanceStore.clearInstancesDetails()
+    instanceStore.loadInstancesDetails(this.getSourceEndpointId(), instances)
   }
 
   render() {
-    let details = AzureStore.assessmentDetails
-    let loading = AzureStore.loadingAssessmentDetails || AzureStore.authenticating || AzureStore.loadingAssessedVms
-    let endpointsLoading = EndpointStore.connectionsInfoLoading || EndpointStore.loading
+    let details = azureStore.assessmentDetails
+    let loading = azureStore.loadingAssessmentDetails || azureStore.authenticating || azureStore.loadingAssessedVms
+    let endpointsLoading = endpointStore.connectionsInfoLoading || endpointStore.loading
     let status = details ? details.properties.status.toUpperCase() : ''
     let statusLabel = status === 'COMPLETED' ? 'READY' : status
 
@@ -340,7 +340,7 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
       <Wrapper>
         <DetailsTemplate
           pageHeaderComponent={<DetailsPageHeader
-            user={UserStore.user}
+            user={userStore.user}
             onUserItemClick={item => { this.handleUserItemClick(item) }}
           />}
           contentHeaderComponent={<DetailsContentHeader
@@ -364,23 +364,23 @@ class AssessmentDetailsPage extends React.Component<Props, State> {
               sourceEndpoints={this.getEndpoints()}
               sourceEndpointsLoading={endpointsLoading}
               sourceEndpoint={this.state.sourceEndpoint}
-              assessedVmsCount={AzureStore.assessedVms.length}
+              assessedVmsCount={azureStore.assessedVms.length}
               filteredAssessedVms={this.getFilteredAssessedVms()}
               onSourceEndpointChange={endpoint => this.handleSourceEndpointChange(endpoint)}
               selectedVms={this.state.selectedVms}
               onVmSelectedChange={(vm, selected) => { this.handleVmSelectedChange(vm, selected) }}
               selectAllVmsChecked={this.getSelectAllVmsChecked()}
               onSelectAllVmsChange={checked => { this.handleSelectAllVmsChange(checked) }}
-              instances={InstanceStore.instances}
-              instancesDetails={InstanceStore.instancesDetails}
-              instancesDetailsLoading={InstanceStore.loadingInstancesDetails}
-              instancesLoading={InstanceStore.instancesLoading}
-              networksLoading={NetworkStore.loading}
+              instances={instanceStore.instances}
+              instancesDetails={instanceStore.instancesDetails}
+              instancesDetailsLoading={instanceStore.loadingInstancesDetails}
+              instancesLoading={instanceStore.instancesLoading}
+              networksLoading={networkStore.loading}
               instancesDetailsProgress={this.getInstancesDetailsProgress()}
-              networks={NetworkStore.networks}
+              networks={networkStore.networks}
               selectedNetworks={this.state.selectedNetworks}
-              loadingVmSizes={AzureStore.loadingVmSizes}
-              vmSizes={AzureStore.vmSizes}
+              loadingVmSizes={azureStore.loadingVmSizes}
+              vmSizes={azureStore.vmSizes}
               onVmSizeChange={(vm, size) => {
                 // $FlowIgnore
                 this.handleVmSizeChange(vm, size)

src/components/pages/AssessmentsPage/index.jsx

@@ -27,18 +27,18 @@ import AssessmentListItem from '../../molecules/AssessmentListItem'
 import type { Assessment } from '../../../types/Assessment'
 import type { Endpoint } from '../../../types/Endpoint'
 
-import AzureStore from '../../../stores/AzureStore'
-import AssessmentStore from '../../../stores/AssessmentStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import ProjectStore from '../../../stores/ProjectStore'
-import UserStore from '../../../stores/UserStore'
+import azureStore from '../../../stores/AzureStore'
+import assessmentStore from '../../../stores/AssessmentStore'
+import endpointStore from '../../../stores/EndpointStore'
+import projectStore from '../../../stores/ProjectStore'
+import userStore from '../../../stores/UserStore'
 
 import { requestPollTimeout } from '../../../config'
 
 const Wrapper = styled.div``
 
 type Props = {}
-type State = {modalIsOpen: boolean}
+type State = { modalIsOpen: boolean }
 @observer
 class AssessmentsPage extends React.Component<Props, State> {
   disablePolling: boolean
@@ -49,20 +49,20 @@ class AssessmentsPage extends React.Component<Props, State> {
   }
 
   componentWillMount() {
-    ProjectStore.getProjects()
+    projectStore.getProjects()
 
-    if (!AzureStore.isLoadedForCurrentProject()) {
-      AssessmentStore.clearSelection()
-      AzureStore.clearAssessments()
+    if (!azureStore.isLoadedForCurrentProject()) {
+      assessmentStore.clearSelection()
+      azureStore.clearAssessments()
     }
 
     this.disablePolling = false
     this.pollData()
 
-    EndpointStore.getEndpoints({ showLoading: true }).then(() => {
-      let endpoints = EndpointStore.endpoints.filter(e => e.type === 'azure')
+    endpointStore.getEndpoints({ showLoading: true }).then(() => {
+      let endpoints = endpointStore.endpoints.filter(e => e.type === 'azure')
       if (endpoints.length > 0) {
-        this.chooseEndpoint(AssessmentStore.selectedEndpoint && AssessmentStore.selectedEndpoint.id ? AssessmentStore.selectedEndpoint : endpoints[0])
+        this.chooseEndpoint(assessmentStore.selectedEndpoint && assessmentStore.selectedEndpoint.id ? assessmentStore.selectedEndpoint : endpoints[0])
       }
     })
   }
@@ -73,23 +73,23 @@ class AssessmentsPage extends React.Component<Props, State> {
   }
 
   getEndpointsDropdownConfig() {
-    let endpoints = EndpointStore.endpoints.filter(e => e.type === 'azure')
+    let endpoints = endpointStore.endpoints.filter(e => e.type === 'azure')
     return {
       key: 'endpoint',
-      selectedItem: AssessmentStore.selectedEndpoint ? AssessmentStore.selectedEndpoint.id : '',
+      selectedItem: assessmentStore.selectedEndpoint ? assessmentStore.selectedEndpoint.id : '',
       items: endpoints.map(endpoint => ({ label: endpoint.name, value: endpoint.id, endpoint })),
       onChange: (item: { endpoint: Endpoint }) => { this.chooseEndpoint(item.endpoint, true) },
       selectItemLabel: 'Select Endpoint',
-      noItemsLabel: EndpointStore.loading ? 'Loading ...' : 'No Endpoints',
+      noItemsLabel: endpointStore.loading ? 'Loading ...' : 'No Endpoints',
       limitListOffset: true,
     }
   }
 
   getResourceGroupsDropdownConfig() {
-    let groups = AzureStore.resourceGroups
+    let groups = azureStore.resourceGroups
     return {
       key: 'resource-group',
-      selectedItem: AssessmentStore.selectedResourceGroup ? AssessmentStore.selectedResourceGroup.id : '',
+      selectedItem: assessmentStore.selectedResourceGroup ? assessmentStore.selectedResourceGroup.id : '',
       items: groups.map(group => ({ label: group.name, value: group.id, group })),
       onChange: (item: Assessment) => { this.chooseResourceGroup(item.group) },
       selectItemLabel: 'Loading ...',
@@ -99,7 +99,7 @@ class AssessmentsPage extends React.Component<Props, State> {
 
   getFilterItems() {
     let types = [{ label: 'All projects', value: 'all' }]
-    let assessments = AzureStore.assessments
+    let assessments = azureStore.assessments
     let uniqueProjects = []
 
     assessments.forEach(a => {
@@ -113,15 +113,15 @@ class AssessmentsPage extends React.Component<Props, State> {
   }
 
   handleReloadButtonClick() {
-    if (!EndpointStore.connectionInfo) {
+    if (!endpointStore.connectionInfo) {
       return
     }
 
-    AzureStore.getAssessments(
+    azureStore.getAssessments(
       // $FlowIgnore
-      EndpointStore.connectionInfo.subscription_id,
-      AssessmentStore.selectedResourceGroup ? AssessmentStore.selectedResourceGroup.name : '',
-      UserStore.user ? UserStore.user.project.id : ''
+      endpointStore.connectionInfo.subscription_id,
+      assessmentStore.selectedResourceGroup ? assessmentStore.selectedResourceGroup.name : '',
+      userStore.user ? userStore.user.project.id : ''
     )
   }
 
@@ -130,9 +130,9 @@ class AssessmentsPage extends React.Component<Props, State> {
       return
     }
 
-    let connectionInfo = EndpointStore.connectionInfo
-    let endpoint = AssessmentStore.selectedEndpoint
-    let resourceGroupName = AssessmentStore.selectedResourceGroup ? AssessmentStore.selectedResourceGroup.name : ''
+    let connectionInfo = endpointStore.connectionInfo
+    let endpoint = assessmentStore.selectedEndpoint
+    let resourceGroupName = assessmentStore.selectedResourceGroup ? assessmentStore.selectedResourceGroup.name : ''
     let projectName = assessment.project.name
     let groupName = assessment.group.name
     let assessmentName = assessment.name
@@ -143,12 +143,12 @@ class AssessmentsPage extends React.Component<Props, State> {
   }
 
   handleProjectChange() {
-    AssessmentStore.clearSelection()
-    AzureStore.clearAssessments()
-    EndpointStore.getEndpoints({ showLoading: true }).then(() => {
-      let endpoints = EndpointStore.endpoints.filter(e => e.type === 'azure')
+    assessmentStore.clearSelection()
+    azureStore.clearAssessments()
+    endpointStore.getEndpoints({ showLoading: true }).then(() => {
+      let endpoints = endpointStore.endpoints.filter(e => e.type === 'azure')
       if (endpoints.length > 0) {
-        this.chooseEndpoint(AssessmentStore.selectedEndpoint && AssessmentStore.selectedEndpoint.id ? AssessmentStore.selectedEndpoint : endpoints[0])
+        this.chooseEndpoint(assessmentStore.selectedEndpoint && assessmentStore.selectedEndpoint.id ? assessmentStore.selectedEndpoint : endpoints[0])
       }
     })
   }
@@ -164,7 +164,7 @@ class AssessmentsPage extends React.Component<Props, State> {
   }
 
   areResourceGroupsLoading() {
-    return AzureStore.authenticating || AzureStore.loadingResourceGroups
+    return azureStore.authenticating || azureStore.loadingResourceGroups
   }
 
   pollData() {
@@ -172,19 +172,19 @@ class AssessmentsPage extends React.Component<Props, State> {
       return
     }
 
-    let connectionInfo = EndpointStore.connectionInfo
-    let selectedResourceGroup = AssessmentStore.selectedResourceGroup
+    let connectionInfo = endpointStore.connectionInfo
+    let selectedResourceGroup = assessmentStore.selectedResourceGroup
 
     if (!connectionInfo || !connectionInfo.subscription_id || !selectedResourceGroup || !selectedResourceGroup.name) {
       this.pollTimeout = setTimeout(() => { this.pollData() }, requestPollTimeout)
       return
     }
 
-    AzureStore.getAssessments(
+    azureStore.getAssessments(
       // $FlowIgnore
       connectionInfo.subscription_id,
       selectedResourceGroup.name,
-      UserStore.user ? UserStore.user.project.id : '',
+      userStore.user ? userStore.user.project.id : '',
       { backgroundLoading: true }
     ).then(() => {
       this.pollTimeout = setTimeout(() => { this.pollData() }, requestPollTimeout)
@@ -192,41 +192,41 @@ class AssessmentsPage extends React.Component<Props, State> {
   }
 
   chooseResourceGroup(selectedResourceGroup: $PropertyType<Assessment, 'group'>) {
-    if (!EndpointStore.connectionInfo) {
+    if (!endpointStore.connectionInfo) {
       return
     }
 
-    AssessmentStore.updateSelectedResourceGroup(selectedResourceGroup)
-    AzureStore.getAssessments(
+    assessmentStore.updateSelectedResourceGroup(selectedResourceGroup)
+    azureStore.getAssessments(
       // $FlowIssue
-      EndpointStore.connectionInfo.subscription_id,
+      endpointStore.connectionInfo.subscription_id,
       selectedResourceGroup.name,
-      UserStore.user ? UserStore.user.project.id : '',
+      userStore.user ? userStore.user.project.id : '',
     )
   }
 
   chooseEndpoint(selectedEndpoint: Endpoint, clearResourceGroup?: boolean) {
-    if (AssessmentStore.selectedEndpoint && AssessmentStore.selectedEndpoint.id === selectedEndpoint.id) {
+    if (assessmentStore.selectedEndpoint && assessmentStore.selectedEndpoint.id === selectedEndpoint.id) {
       return
     }
 
-    AssessmentStore.updateSelectedEndpoint(selectedEndpoint)
+    assessmentStore.updateSelectedEndpoint(selectedEndpoint)
 
     if (clearResourceGroup) {
-      AssessmentStore.updateSelectedResourceGroup(null)
+      assessmentStore.updateSelectedResourceGroup(null)
     }
 
-    EndpointStore.getConnectionInfo(selectedEndpoint).then(() => {
-      let connectionInfo = EndpointStore.connectionInfo
+    endpointStore.getConnectionInfo(selectedEndpoint).then(() => {
+      let connectionInfo = endpointStore.connectionInfo
       if (!connectionInfo) {
         return
       }
       // $FlowIgnore
-      AzureStore.authenticate(connectionInfo.user_credentials.username, connectionInfo.user_credentials.password).then(() => {
+      azureStore.authenticate(connectionInfo.user_credentials.username, connectionInfo.user_credentials.password).then(() => {
         // $FlowIgnore
-        AzureStore.getResourceGroups(connectionInfo.subscription_id).then(() => {
-          let groups = AzureStore.resourceGroups
-          let selectedGroup = AssessmentStore.selectedResourceGroup
+        azureStore.getResourceGroups(connectionInfo.subscription_id).then(() => {
+          let groups = azureStore.resourceGroups
+          let selectedGroup = assessmentStore.selectedResourceGroup
           // $FlowIssue
           if (groups.filter(rg => rg.id === selectedGroup ? selectedGroup.id : '').length > 0) {
             return
@@ -260,10 +260,10 @@ class AssessmentsPage extends React.Component<Props, State> {
             <FilterList
               filterItems={this.getFilterItems()}
               selectionLabel="assessments"
-              loading={this.areResourceGroupsLoading() || AzureStore.loadingAssessments}
+              loading={this.areResourceGroupsLoading() || azureStore.loadingAssessments}
               items={
                 // $FlowIgnore
-                AzureStore.assessments
+                azureStore.assessments
               }
               onItemClick={item => {
                 let itemAny: any = item

src/components/pages/EndpointDetailsPage/index.jsx

@@ -27,10 +27,10 @@ import Modal from '../../molecules/Modal'
 import EndpointValidation from '../../organisms/EndpointValidation'
 import Endpoint from '../../organisms/Endpoint'
 
-import EndpointStore from '../../../stores/EndpointStore'
-import MigrationStore from '../../../stores/MigrationStore'
-import ReplicaStore from '../../../stores/ReplicaStore'
-import UserStore from '../../../stores/UserStore'
+import endpointStore from '../../../stores/EndpointStore'
+import migrationStore from '../../../stores/MigrationStore'
+import replicaStore from '../../../stores/ReplicaStore'
+import userStore from '../../../stores/UserStore'
 import type { Endpoint as EndpointType } from '../../../types/Endpoint'
 import type { MainItem } from '../../../types/MainItem'
 
@@ -47,7 +47,7 @@ type State = {
   showEndpointModal: boolean,
   showEndpointInUseModal: boolean,
   showEndpointInUseLoadingModal: boolean,
-  endpointUsage: {replicas: MainItem[], migrations: MainItem[]}
+  endpointUsage: { replicas: MainItem[], migrations: MainItem[] }
 }
 @observer
 class EndpointDetailsPage extends React.Component<Props, State> {
@@ -71,18 +71,18 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
-    EndpointStore.clearConnectionInfo()
+    endpointStore.clearConnectionInfo()
   }
 
   getEndpoint(): ?EndpointType {
-    return EndpointStore.endpoints.find(e => e.id === this.props.match.params.id) || null
+    return endpointStore.endpoints.find(e => e.id === this.props.match.params.id) || null
   }
 
-  getEndpointUsage(): {migrations: MainItem[], replicas: MainItem[]} {
+  getEndpointUsage(): { migrations: MainItem[], replicas: MainItem[] } {
     let endpointId = this.props.match.params.id
-    let replicas = ReplicaStore.replicas.filter(
+    let replicas = replicaStore.replicas.filter(
       r => r.origin_endpoint_id === endpointId || r.destination_endpoint_id === endpointId)
-    let migrations = MigrationStore.migrations.filter(
+    let migrations = migrationStore.migrations.filter(
       r => r.origin_endpoint_id === endpointId || r.destination_endpoint_id === endpointId)
 
     return { migrations, replicas }
@@ -91,7 +91,7 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   handleUserItemClick(item: { value: string }) {
     switch (item.value) {
       case 'signout':
-        UserStore.logout()
+        userStore.logout()
         return
       case 'profile':
         window.location.href = '/#/profile'
@@ -107,7 +107,7 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   handleDeleteEndpointClick() {
     this.setState({ showEndpointInUseLoadingModal: true })
 
-    Promise.all([ReplicaStore.getReplicas(), MigrationStore.getMigrations()]).then(() => {
+    Promise.all([replicaStore.getReplicas(), migrationStore.getMigrations()]).then(() => {
       const endpointUsage = this.getEndpointUsage()
 
       if (endpointUsage.migrations.length === 0 && endpointUsage.replicas.length === 0) {
@@ -123,7 +123,7 @@ class EndpointDetailsPage extends React.Component<Props, State> {
     window.location.href = '/#/endpoints'
     let endpoint = this.getEndpoint()
     if (endpoint) {
-      EndpointStore.delete(endpoint)
+      endpointStore.delete(endpoint)
     }
   }
 
@@ -134,7 +134,7 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   handleValidateClick() {
     let endpoint = this.getEndpoint()
     if (endpoint) {
-      EndpointStore.validate(endpoint)
+      endpointStore.validate(endpoint)
     }
     this.setState({ showValidationModal: true })
   }
@@ -142,12 +142,12 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   handleRetryValidation() {
     let endpoint = this.getEndpoint()
     if (endpoint) {
-      EndpointStore.validate(endpoint)
+      endpointStore.validate(endpoint)
     }
   }
 
   handleCloseValidationModal() {
-    EndpointStore.clearValidation()
+    endpointStore.clearValidation()
     this.setState({ showValidationModal: false })
   }
 
@@ -156,7 +156,7 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   }
 
   handleEditValidateClick(endpoint: EndpointType) {
-    EndpointStore.validate(endpoint)
+    endpointStore.validate(endpoint)
   }
 
   handleCloseEndpointModal() {
@@ -168,17 +168,17 @@ class EndpointDetailsPage extends React.Component<Props, State> {
   }
 
   loadData() {
-    EndpointStore.getEndpoints().then(() => {
+    endpointStore.getEndpoints().then(() => {
       let endpoint = this.getEndpoint()
 
       if (endpoint && endpoint.connection_info && endpoint.connection_info.secret_ref) {
-        EndpointStore.getConnectionInfo(endpoint)
+        endpointStore.getConnectionInfo(endpoint)
       } else if (endpoint && endpoint.connection_info) {
-        EndpointStore.setConnectionInfo(endpoint.connection_info)
+        endpointStore.setConnectionInfo(endpoint.connection_info)
       }
     })
 
-    Promise.all([ReplicaStore.getReplicas(), MigrationStore.getMigrations()]).then(() => {
+    Promise.all([replicaStore.getReplicas(), migrationStore.getMigrations()]).then(() => {
       this.setState({ endpointUsage: this.getEndpointUsage() })
     })
   }
@@ -189,7 +189,7 @@ class EndpointDetailsPage extends React.Component<Props, State> {
       <Wrapper>
         <DetailsTemplate
           pageHeaderComponent={<DetailsPageHeader
-            user={UserStore.user}
+            user={userStore.user}
             onUserItemClick={item => { this.handleUserItemClick(item) }}
           />}
           contentHeaderComponent={<DetailsContentHeader
@@ -202,8 +202,8 @@ class EndpointDetailsPage extends React.Component<Props, State> {
           contentComponent={<EndpointDetailsContent
             item={endpoint}
             usage={this.state.endpointUsage}
-            loading={EndpointStore.connectionInfoLoading || EndpointStore.loading}
-            connectionInfo={EndpointStore.connectionInfo}
+            loading={endpointStore.connectionInfoLoading || endpointStore.loading}
+            connectionInfo={endpointStore.connectionInfo}
             onDeleteClick={() => { this.handleDeleteEndpointClick() }}
             onValidateClick={() => { this.handleValidateClick() }}
             onEditClick={() => { this.handleEditClick() }}
@@ -236,8 +236,8 @@ class EndpointDetailsPage extends React.Component<Props, State> {
           onRequestClose={() => { this.handleCloseValidationModal() }}
         >
           <EndpointValidation
-            validation={EndpointStore.validation}
-            loading={EndpointStore.validating}
+            validation={endpointStore.validation}
+            loading={endpointStore.validating}
             onCancelClick={() => { this.handleCloseValidationModal() }}
             onRetryClick={() => { this.handleRetryValidation() }}
           />

src/components/pages/EndpointsPage/index.jsx

@@ -31,11 +31,11 @@ import type { Endpoint as EndpointType } from '../../../types/Endpoint'
 
 import endpointImage from './images/endpoint-large.svg'
 
-import ProjectStore from '../../../stores/ProjectStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import MigrationStore from '../../../stores/MigrationStore'
-import ReplicaStore from '../../../stores/ReplicaStore'
-import ProviderStore from '../../../stores/ProviderStore'
+import projectStore from '../../../stores/ProjectStore'
+import endpointStore from '../../../stores/EndpointStore'
+import migrationStore from '../../../stores/MigrationStore'
+import replicaStore from '../../../stores/ReplicaStore'
+import providerStore from '../../../stores/ProviderStore'
 import LabelDictionary from '../../../utils/LabelDictionary'
 import { requestPollTimeout } from '../../../config.js'
 
@@ -76,7 +76,7 @@ class EndpointsPage extends React.Component<{}, State> {
   componentDidMount() {
     document.title = 'Coriolis Endpoints'
 
-    ProjectStore.getProjects()
+    projectStore.getProjects()
 
     this.stopPolling = false
     this.pollData()
@@ -89,7 +89,7 @@ class EndpointsPage extends React.Component<{}, State> {
 
   getFilterItems() {
     let types = [{ label: 'All', value: 'all' }]
-    EndpointStore.endpoints.forEach(endpoint => {
+    endpointStore.endpoints.forEach(endpoint => {
       if (!types.find(t => t.value === endpoint.type)) {
         types.push({ label: LabelDictionary.get(endpoint.type), value: endpoint.type })
       }
@@ -99,25 +99,25 @@ class EndpointsPage extends React.Component<{}, State> {
   }
 
   getEndpointUsage(endpoint: EndpointType) {
-    let replicasCount = ReplicaStore.replicas.filter(
+    let replicasCount = replicaStore.replicas.filter(
       r => r.origin_endpoint_id === endpoint.id || r.destination_endpoint_id === endpoint.id).length
-    let migrationsCount = MigrationStore.migrations.filter(
+    let migrationsCount = migrationStore.migrations.filter(
       r => r.origin_endpoint_id === endpoint.id || r.destination_endpoint_id === endpoint.id).length
 
     return { migrationsCount, replicasCount }
   }
 
   handleProjectChange() {
-    EndpointStore.getEndpoints({ showLoading: true })
-    MigrationStore.getMigrations()
-    ReplicaStore.getReplicas()
+    endpointStore.getEndpoints({ showLoading: true })
+    migrationStore.getMigrations()
+    replicaStore.getReplicas()
   }
 
   handleReloadButtonClick() {
-    ProjectStore.getProjects()
-    EndpointStore.getEndpoints({ showLoading: true })
-    MigrationStore.getMigrations()
-    ReplicaStore.getReplicas()
+    projectStore.getProjects()
+    endpointStore.getEndpoints({ showLoading: true })
+    migrationStore.getMigrations()
+    replicaStore.getReplicas()
   }
 
   handleItemClick(item: EndpointType) {
@@ -152,14 +152,14 @@ class EndpointsPage extends React.Component<{}, State> {
   handleDeleteEndpointsConfirmation() {
     if (this.state.confirmationItems) {
       this.state.confirmationItems.forEach(endpoint => {
-        EndpointStore.delete(endpoint)
+        endpointStore.delete(endpoint)
       })
     }
     this.handleCloseDeleteEndpointsConfirmation()
   }
 
   handleEmptyListButtonClick() {
-    ProviderStore.loadProviders()
+    providerStore.loadProviders()
     this.setState({ showChooseProviderModal: true })
   }
 
@@ -194,7 +194,7 @@ class EndpointsPage extends React.Component<{}, State> {
       return
     }
 
-    Promise.all([EndpointStore.getEndpoints(), MigrationStore.getMigrations(), ReplicaStore.getReplicas()]).then(() => {
+    Promise.all([endpointStore.getEndpoints(), migrationStore.getMigrations(), replicaStore.getReplicas()]).then(() => {
       this.pollTimeout = setTimeout(() => { this.pollData() }, requestPollTimeout)
     })
   }
@@ -203,8 +203,8 @@ class EndpointsPage extends React.Component<{}, State> {
     let endpoint: EndpointType = item
     if ((filterItem !== 'all' && (endpoint.type !== filterItem)) ||
       (endpoint.name.toLowerCase().indexOf(filterText || '') === -1 &&
-      // $FlowIssue
-      endpoint.description.toLowerCase().indexOf(filterText) === -1)
+        // $FlowIssue
+        endpoint.description.toLowerCase().indexOf(filterText) === -1)
     ) {
       return false
     }
@@ -213,7 +213,7 @@ class EndpointsPage extends React.Component<{}, State> {
   }
 
   render() {
-    let items: any = EndpointStore.endpoints
+    let items: any = endpointStore.endpoints
     return (
       <Wrapper>
         <MainTemplate
@@ -222,7 +222,7 @@ class EndpointsPage extends React.Component<{}, State> {
             <FilterList
               filterItems={this.getFilterItems()}
               selectionLabel="endpoint"
-              loading={EndpointStore.loading}
+              loading={endpointStore.loading}
               items={items}
               onItemClick={item => {
                 let anyItem: any = item
@@ -275,8 +275,8 @@ class EndpointsPage extends React.Component<{}, State> {
         >
           <ChooseProvider
             onCancelClick={() => { this.handleCloseChooseProviderModal() }}
-            providers={ProviderStore.providers}
-            loading={ProviderStore.providersLoading}
+            providers={providerStore.providers}
+            loading={providerStore.providersLoading}
             onProviderClick={providerName => { this.handleProviderClick(providerName) }}
           />
         </Modal>

src/components/pages/LoginPage/index.jsx

@@ -23,7 +23,7 @@ import Logo from '../../atoms/Logo'
 import LoginForm from '../../organisms/LoginForm'
 
 import StyleProps from '../../styleUtils/StyleProps'
-import UserStore from '../../../stores/UserStore'
+import userStore from '../../../stores/UserStore'
 
 import backgroundImage from './images/star-bg.jpg'
 import cbsImage from './images/cbs-logo.svg'
@@ -50,7 +50,7 @@ const Content = styled.div`
     margin-top: 96px;
   `}
 `
-const StyledLoginForm = styled(LoginForm)`
+const StyledLoginForm = styled(LoginForm) `
   margin-top: 32px;
   ${StyleProps.media.handheld`
     margin-top: 32px;
@@ -82,14 +82,14 @@ class LoginPage extends React.Component<{}> {
   }
 
   handleFormSubmit(data: { username: string, password: string }) {
-    UserStore.login({
+    userStore.login({
       name: data.username,
       password: data.password,
     })
   }
 
   render() {
-    if (UserStore.user) {
+    if (userStore.user) {
       window.location.href = '/#/replicas'
     }
 
@@ -100,8 +100,8 @@ class LoginPage extends React.Component<{}> {
             <Logo />
             <StyledLoginForm
               onFormSubmit={data => this.handleFormSubmit(data)}
-              loading={UserStore.loading}
-              loginFailedResponse={UserStore.loginFailedResponse}
+              loading={userStore.loading}
+              loginFailedResponse={userStore.loginFailedResponse}
             />
             <Footer>
               <FooterText>Coriolis® is a service offered by</FooterText>

src/components/pages/MigrationDetailsPage/index.jsx

@@ -24,10 +24,10 @@ import DetailsContentHeader from '../../organisms/DetailsContentHeader'
 import MigrationDetailsContent from '../../organisms/MigrationDetailsContent'
 import AlertModal from '../../organisms/AlertModal'
 
-import MigrationStore from '../../../stores/MigrationStore'
-import UserStore from '../../../stores/UserStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import NotificationStore from '../../../stores/NotificationStore'
+import migrationStore from '../../../stores/MigrationStore'
+import userStore from '../../../stores/UserStore'
+import endpointStore from '../../../stores/EndpointStore'
+import notificationStore from '../../../stores/NotificationStore'
 import { requestPollTimeout } from '../../../config'
 
 import migrationImage from './images/migration.svg'
@@ -57,20 +57,20 @@ class MigrationDetailsPage extends React.Component<Props, State> {
   componentDidMount() {
     document.title = 'Migration Details'
 
-    EndpointStore.getEndpoints()
+    endpointStore.getEndpoints()
     this.pollData(true)
     this.pollInterval = setInterval(() => { this.pollData() }, requestPollTimeout)
   }
 
   componentWillUnmount() {
-    MigrationStore.clearDetails()
+    migrationStore.clearDetails()
     clearInterval(this.pollInterval)
   }
 
   handleUserItemClick(item: { value: string }) {
     switch (item.value) {
       case 'signout':
-        UserStore.logout()
+        userStore.logout()
         return
       case 'profile':
         window.location.href = '/#/profile'
@@ -90,8 +90,8 @@ class MigrationDetailsPage extends React.Component<Props, State> {
   handleDeleteMigrationConfirmation() {
     this.setState({ showDeleteMigrationConfirmation: false })
     window.location.href = '/#/migrations'
-    if (MigrationStore.migrationDetails) {
-      MigrationStore.delete(MigrationStore.migrationDetails.id)
+    if (migrationStore.migrationDetails) {
+      migrationStore.delete(migrationStore.migrationDetails.id)
     }
   }
 
@@ -109,20 +109,20 @@ class MigrationDetailsPage extends React.Component<Props, State> {
 
   handleCancelConfirmation() {
     this.setState({ showCancelConfirmation: false })
-    if (!MigrationStore.migrationDetails) {
+    if (!migrationStore.migrationDetails) {
       return
     }
-    MigrationStore.cancel(MigrationStore.migrationDetails.id).then(() => {
-      if (MigrationStore.canceling === false) {
-        NotificationStore.notify('Canceled', 'success')
+    migrationStore.cancel(migrationStore.migrationDetails.id).then(() => {
+      if (migrationStore.canceling === false) {
+        notificationStore.notify('Canceled', 'success')
       } else {
-        NotificationStore.notify('The migration couldn\'t be canceled', 'error')
+        notificationStore.notify('The migration couldn\'t be canceled', 'error')
       }
     })
   }
 
   pollData(showLoading?: boolean) {
-    MigrationStore.getMigration(this.props.match.params.id, showLoading || false)
+    migrationStore.getMigration(this.props.match.params.id, showLoading || false)
   }
 
   render() {
@@ -130,21 +130,21 @@ class MigrationDetailsPage extends React.Component<Props, State> {
       <Wrapper>
         <DetailsTemplate
           pageHeaderComponent={<DetailsPageHeader
-            user={UserStore.user}
+            user={userStore.user}
             onUserItemClick={item => { this.handleUserItemClick(item) }}
           />}
           contentHeaderComponent={<DetailsContentHeader
-            item={MigrationStore.migrationDetails}
+            item={migrationStore.migrationDetails}
             onBackButonClick={() => { this.handleBackButtonClick() }}
             typeImage={migrationImage}
             primaryInfoPill
             onCancelClick={() => { this.handleCancelMigrationClick() }}
           />}
           contentComponent={<MigrationDetailsContent
-            item={MigrationStore.migrationDetails}
-            endpoints={EndpointStore.endpoints}
+            item={migrationStore.migrationDetails}
+            endpoints={endpointStore.endpoints}
             page={this.props.match.params.page || ''}
-            detailsLoading={EndpointStore.loading || MigrationStore.detailsLoading}
+            detailsLoading={endpointStore.loading || migrationStore.detailsLoading}
             onDeleteMigrationClick={() => { this.handleDeleteMigrationClick() }}
           />}
         />

src/components/pages/MigrationsPage/index.jsx

@@ -29,10 +29,10 @@ import type { MainItem } from '../../../types/MainItem'
 import migrationItemImage from './images/migration.svg'
 import migrationLargeImage from './images/migration-large.svg'
 
-import ProjectStore from '../../../stores/ProjectStore'
-import MigrationStore from '../../../stores/MigrationStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import NotificationStore from '../../../stores/NotificationStore'
+import projectStore from '../../../stores/ProjectStore'
+import migrationStore from '../../../stores/MigrationStore'
+import endpointStore from '../../../stores/EndpointStore'
+import notificationStore from '../../../stores/NotificationStore'
 import { requestPollTimeout } from '../../../config'
 
 const Wrapper = styled.div``
@@ -67,8 +67,8 @@ class MigrationsPage extends React.Component<{}, State> {
   componentDidMount() {
     document.title = 'Coriolis Migrations'
 
-    ProjectStore.getProjects()
-    EndpointStore.getEndpoints({ showLoading: true })
+    projectStore.getProjects()
+    endpointStore.getEndpoints({ showLoading: true })
 
     this.stopPolling = false
     this.pollData()
@@ -80,7 +80,7 @@ class MigrationsPage extends React.Component<{}, State> {
   }
 
   getEndpoint(endpointId: string) {
-    return EndpointStore.endpoints.find(endpoint => endpoint.id === endpointId)
+    return endpointStore.endpoints.find(endpoint => endpoint.id === endpointId)
   }
 
   getFilterItems() {
@@ -93,14 +93,14 @@ class MigrationsPage extends React.Component<{}, State> {
   }
 
   handleProjectChange() {
-    EndpointStore.getEndpoints({ showLoading: true })
-    MigrationStore.getMigrations({ showLoading: true })
+    endpointStore.getEndpoints({ showLoading: true })
+    migrationStore.getMigrations({ showLoading: true })
   }
 
   handleReloadButtonClick() {
-    ProjectStore.getProjects()
-    EndpointStore.getEndpoints({ showLoading: true })
-    MigrationStore.getMigrations({ showLoading: true })
+    projectStore.getProjects()
+    endpointStore.getEndpoints({ showLoading: true })
+    migrationStore.getMigrations({ showLoading: true })
   }
 
   handleItemClick(item: MainItem) {
@@ -130,9 +130,9 @@ class MigrationsPage extends React.Component<{}, State> {
       return
     }
     this.state.confirmationItems.forEach(migration => {
-      MigrationStore.cancel(migration.id)
+      migrationStore.cancel(migration.id)
     })
-    NotificationStore.notify('Canceling migrations')
+    notificationStore.notify('Canceling migrations')
     this.handleCloseCancelMigration()
   }
 
@@ -155,7 +155,7 @@ class MigrationsPage extends React.Component<{}, State> {
       return
     }
     this.state.confirmationItems.forEach(migration => {
-      MigrationStore.delete(migration.id)
+      migrationStore.delete(migration.id)
     })
     this.handleCloseDeleteMigrationConfirmation()
   }
@@ -206,7 +206,7 @@ class MigrationsPage extends React.Component<{}, State> {
       return
     }
 
-    Promise.all([MigrationStore.getMigrations(), EndpointStore.getEndpoints()]).then(() => {
+    Promise.all([migrationStore.getMigrations(), endpointStore.getEndpoints()]).then(() => {
       this.pollTimeout = setTimeout(() => { this.pollData() }, requestPollTimeout)
     })
   }
@@ -234,8 +234,8 @@ class MigrationsPage extends React.Component<{}, State> {
             <FilterList
               filterItems={this.getFilterItems()}
               selectionLabel="migration"
-              loading={MigrationStore.loading}
-              items={MigrationStore.migrations}
+              loading={migrationStore.loading}
+              items={migrationStore.migrations}
               onItemClick={item => { this.handleItemClick(item) }}
               onReloadButtonClick={() => { this.handleReloadButtonClick() }}
               actions={BulkActions}
@@ -250,7 +250,7 @@ class MigrationsPage extends React.Component<{}, State> {
                     if (endpoint) {
                       return endpoint.type
                     }
-                    if (EndpointStore.loading) {
+                    if (endpointStore.loading) {
                       return 'Loading...'
                     }
                     return 'Not Found'

src/components/pages/ReplicaDetailsPage/index.jsx

@@ -31,11 +31,11 @@ import type { Execution } from '../../../types/Execution'
 import type { Schedule } from '../../../types/Schedule'
 import type { Field } from '../../../types/Field'
 
-import ReplicaStore from '../../../stores/ReplicaStore'
-import MigrationStore from '../../../stores/MigrationStore'
-import UserStore from '../../../stores/UserStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import ScheduleStore from '../../../stores/ScheduleStore'
+import replicaStore from '../../../stores/ReplicaStore'
+import migrationStore from '../../../stores/MigrationStore'
+import userStore from '../../../stores/UserStore'
+import endpointStore from '../../../stores/EndpointStore'
+import scheduleStore from '../../../stores/ScheduleStore'
 import { requestPollTimeout } from '../../../config'
 
 import replicaImage from './images/replica.svg'
@@ -75,23 +75,23 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
   componentDidMount() {
     document.title = 'Replica Details'
 
-    ReplicaStore.getReplica(this.props.match.params.id)
-    EndpointStore.getEndpoints()
-    ScheduleStore.getSchedules(this.props.match.params.id)
+    replicaStore.getReplica(this.props.match.params.id)
+    endpointStore.getEndpoints()
+    scheduleStore.getSchedules(this.props.match.params.id)
     this.pollData(true)
   }
 
   componentWillUnmount() {
-    ReplicaStore.clearDetails()
-    ScheduleStore.clearUnsavedSchedules()
+    replicaStore.clearDetails()
+    scheduleStore.clearUnsavedSchedules()
     clearTimeout(this.pollTimeout)
   }
 
   isActionButtonDisabled() {
-    let originEndpoint = EndpointStore.endpoints.find(e => ReplicaStore.replicaDetails && e.id === ReplicaStore.replicaDetails.origin_endpoint_id)
-    let targetEndpoint = EndpointStore.endpoints.find(e => ReplicaStore.replicaDetails && e.id === ReplicaStore.replicaDetails.destination_endpoint_id)
-    let lastExecution = ReplicaStore.replicaDetails && ReplicaStore.replicaDetails.executions && ReplicaStore.replicaDetails.executions.length
-      && ReplicaStore.replicaDetails.executions[ReplicaStore.replicaDetails.executions.length - 1]
+    let originEndpoint = endpointStore.endpoints.find(e => replicaStore.replicaDetails && e.id === replicaStore.replicaDetails.origin_endpoint_id)
+    let targetEndpoint = endpointStore.endpoints.find(e => replicaStore.replicaDetails && e.id === replicaStore.replicaDetails.destination_endpoint_id)
+    let lastExecution = replicaStore.replicaDetails && replicaStore.replicaDetails.executions && replicaStore.replicaDetails.executions.length
+      && replicaStore.replicaDetails.executions[replicaStore.replicaDetails.executions.length - 1]
     let status = lastExecution && lastExecution.status
 
     return Boolean(!originEndpoint || !targetEndpoint || status === 'RUNNING')
@@ -100,7 +100,7 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
   handleUserItemClick(item: { value: string }) {
     switch (item.value) {
       case 'signout':
-        UserStore.logout()
+        userStore.logout()
         return
       case 'profile':
         window.location.href = '/#/profile'
@@ -125,7 +125,7 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
     if (!this.state.confirmationItem) {
       return
     }
-    ReplicaStore.deleteExecution(ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : '', this.state.confirmationItem.id)
+    replicaStore.deleteExecution(replicaStore.replicaDetails ? replicaStore.replicaDetails.id : '', this.state.confirmationItem.id)
     this.handleCloseExecutionConfirmation()
   }
 
@@ -154,7 +154,7 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
   handleDeleteReplicaConfirmation() {
     this.setState({ showDeleteReplicaConfirmation: false })
     window.location.href = '/#/replicas'
-    ReplicaStore.delete(ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : '')
+    replicaStore.delete(replicaStore.replicaDetails ? replicaStore.replicaDetails.id : '')
   }
 
   handleCloseDeleteReplicaConfirmation() {
@@ -163,8 +163,8 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
 
   handleDeleteReplicaDisksConfirmation() {
     this.setState({ showDeleteReplicaDisksConfirmation: false })
-    ReplicaStore.deleteDisks(ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : '')
-    window.location.href = `/#/replica/executions/${ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : ''}`
+    replicaStore.deleteDisks(replicaStore.replicaDetails ? replicaStore.replicaDetails.id : '')
+    window.location.href = `/#/replica/executions/${replicaStore.replicaDetails ? replicaStore.replicaDetails.id : ''}`
   }
 
   handleCloseDeleteReplicaDisksConfirmation() {
@@ -180,27 +180,27 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
   }
 
   handleAddScheduleClick(schedule: Schedule) {
-    ScheduleStore.addSchedule(this.props.match.params.id, schedule)
+    scheduleStore.addSchedule(this.props.match.params.id, schedule)
   }
 
   handleScheduleChange(scheduleId: ?string, data: Schedule, forceSave?: boolean) {
-    let oldData = ScheduleStore.schedules.find(s => s.id === scheduleId)
-    let unsavedData = ScheduleStore.unsavedSchedules.find(s => s.id === scheduleId)
+    let oldData = scheduleStore.schedules.find(s => s.id === scheduleId)
+    let unsavedData = scheduleStore.unsavedSchedules.find(s => s.id === scheduleId)
 
     if (scheduleId) {
-      ScheduleStore.updateSchedule(this.props.match.params.id, scheduleId, data, oldData, unsavedData, forceSave)
+      scheduleStore.updateSchedule(this.props.match.params.id, scheduleId, data, oldData, unsavedData, forceSave)
     }
   }
 
   handleScheduleSave(schedule: Schedule) {
     if (schedule.id) {
-      ScheduleStore.updateSchedule(this.props.match.params.id, schedule.id, schedule, schedule, schedule, true)
+      scheduleStore.updateSchedule(this.props.match.params.id, schedule.id, schedule, schedule, schedule, true)
     }
   }
 
   handleScheduleRemove(scheduleId: ?string) {
     if (scheduleId) {
-      ScheduleStore.removeSchedule(this.props.match.params.id, scheduleId)
+      scheduleStore.removeSchedule(this.props.match.params.id, scheduleId)
     }
   }
 
@@ -216,23 +216,23 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
     if (!this.state.confirmationItem) {
       return
     }
-    ReplicaStore.cancelExecution(ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : '', this.state.confirmationItem.id)
+    replicaStore.cancelExecution(replicaStore.replicaDetails ? replicaStore.replicaDetails.id : '', this.state.confirmationItem.id)
     this.setState({ showCancelConfirmation: false })
   }
 
   migrateReplica(options: Field[]) {
-    MigrationStore.migrateReplica(ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : '', options)
+    migrationStore.migrateReplica(replicaStore.replicaDetails ? replicaStore.replicaDetails.id : '', options)
     this.handleCloseMigrationModal()
   }
 
   executeReplica(fields: Field[]) {
-    ReplicaStore.execute(ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : '', fields)
+    replicaStore.execute(replicaStore.replicaDetails ? replicaStore.replicaDetails.id : '', fields)
     this.handleCloseOptionsModal()
-    window.location.href = `/#/replica/executions/${ReplicaStore.replicaDetails ? ReplicaStore.replicaDetails.id : ''}`
+    window.location.href = `/#/replica/executions/${replicaStore.replicaDetails ? replicaStore.replicaDetails.id : ''}`
   }
 
   pollData(showLoading: boolean) {
-    ReplicaStore.getReplicaExecutions(this.props.match.params.id, showLoading).then(() => {
+    replicaStore.getReplicaExecutions(this.props.match.params.id, showLoading).then(() => {
       this.pollTimeout = setTimeout(() => { this.pollData(false) }, requestPollTimeout)
     })
   }
@@ -242,11 +242,11 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
       <Wrapper>
         <DetailsTemplate
           pageHeaderComponent={<DetailsPageHeader
-            user={UserStore.user}
+            user={userStore.user}
             onUserItemClick={item => { this.handleUserItemClick(item) }}
           />}
           contentHeaderComponent={<DetailsContentHeader
-            item={ReplicaStore.replicaDetails}
+            item={replicaStore.replicaDetails}
             onBackButonClick={() => { this.handleBackButtonClick() }}
             onActionButtonClick={() => { this.handleActionButtonClick() }}
             onCancelClick={item => {
@@ -260,11 +260,11 @@ class ReplicaDetailsPage extends React.Component<Props, State> {
             buttonLabel="Execute Now"
           />}
           contentComponent={<ReplicaDetailsContent
-            item={ReplicaStore.replicaDetails}
-            endpoints={EndpointStore.endpoints}
-            scheduleStore={ScheduleStore}
-            detailsLoading={ReplicaStore.detailsLoading || EndpointStore.loading}
-            executionsLoading={ReplicaStore.executionsLoading}
+            item={replicaStore.replicaDetails}
+            endpoints={endpointStore.endpoints}
+            scheduleStore={scheduleStore}
+            detailsLoading={replicaStore.detailsLoading || endpointStore.loading}
+            executionsLoading={replicaStore.executionsLoading}
             page={this.props.match.params.page || ''}
             onCancelExecutionClick={execution => { this.handleCancelExecutionClick(execution) }}
             onDeleteExecutionClick={execution => { this.handleDeleteExecutionClick(execution) }}

src/components/pages/ReplicasPage/index.jsx

@@ -29,10 +29,10 @@ import type { MainItem } from '../../../types/MainItem'
 import replicaItemImage from './images/replica.svg'
 import replicaLargeImage from './images/replica-large.svg'
 
-import ProjectStore from '../../../stores/ProjectStore'
-import ReplicaStore from '../../../stores/ReplicaStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import NotificationStore from '../../../stores/NotificationStore'
+import projectStore from '../../../stores/ProjectStore'
+import replicaStore from '../../../stores/ReplicaStore'
+import endpointStore from '../../../stores/EndpointStore'
+import notificationStore from '../../../stores/NotificationStore'
 import { requestPollTimeout } from '../../../config'
 
 const Wrapper = styled.div``
@@ -65,8 +65,8 @@ class ReplicasPage extends React.Component<{}, State> {
   componentDidMount() {
     document.title = 'Coriolis Replicas'
 
-    ProjectStore.getProjects()
-    EndpointStore.getEndpoints({ showLoading: true })
+    projectStore.getProjects()
+    endpointStore.getEndpoints({ showLoading: true })
 
     this.stopPolling = false
     this.pollData()
@@ -78,7 +78,7 @@ class ReplicasPage extends React.Component<{}, State> {
   }
 
   getEndpoint(endpointId: string) {
-    return EndpointStore.endpoints.find(endpoint => endpoint.id === endpointId)
+    return endpointStore.endpoints.find(endpoint => endpoint.id === endpointId)
   }
 
   getFilterItems() {
@@ -98,14 +98,14 @@ class ReplicasPage extends React.Component<{}, State> {
   }
 
   handleProjectChange() {
-    ReplicaStore.getReplicas()
-    EndpointStore.getEndpoints({ showLoading: true })
+    replicaStore.getReplicas()
+    endpointStore.getEndpoints({ showLoading: true })
   }
 
   handleReloadButtonClick() {
-    ProjectStore.getProjects()
-    ReplicaStore.getReplicas({ showLoading: true })
-    EndpointStore.getEndpoints({ showLoading: true })
+    projectStore.getProjects()
+    replicaStore.getReplicas({ showLoading: true })
+    endpointStore.getEndpoints({ showLoading: true })
   }
 
   handleItemClick(item: MainItem) {
@@ -120,9 +120,9 @@ class ReplicasPage extends React.Component<{}, State> {
   handleActionChange(items: MainItem[], action: string) {
     if (action === 'execute') {
       items.forEach(replica => {
-        ReplicaStore.execute(replica.id)
+        replicaStore.execute(replica.id)
       })
-      NotificationStore.notify('Executing replicas')
+      notificationStore.notify('Executing replicas')
     } else if (action === 'delete') {
       this.setState({
         showDeleteReplicaConfirmation: true,
@@ -143,7 +143,7 @@ class ReplicasPage extends React.Component<{}, State> {
       return
     }
     this.state.confirmationItems.forEach(replica => {
-      ReplicaStore.delete(replica.id)
+      replicaStore.delete(replica.id)
     })
     this.handleCloseDeleteReplicaConfirmation()
   }
@@ -167,7 +167,7 @@ class ReplicasPage extends React.Component<{}, State> {
       return
     }
 
-    Promise.all([ReplicaStore.getReplicas(), EndpointStore.getEndpoints()]).then(() => {
+    Promise.all([replicaStore.getReplicas(), endpointStore.getEndpoints()]).then(() => {
       this.pollTimeout = setTimeout(() => { this.pollData() }, requestPollTimeout)
     })
   }
@@ -209,8 +209,8 @@ class ReplicasPage extends React.Component<{}, State> {
             <FilterList
               filterItems={this.getFilterItems()}
               selectionLabel="replica"
-              loading={ReplicaStore.loading}
-              items={ReplicaStore.replicas}
+              loading={replicaStore.loading}
+              items={replicaStore.replicas}
               onItemClick={item => { this.handleItemClick(item) }}
               onReloadButtonClick={() => { this.handleReloadButtonClick() }}
               actions={BulkActions}
@@ -225,7 +225,7 @@ class ReplicasPage extends React.Component<{}, State> {
                     if (endpoint) {
                       return endpoint.type
                     }
-                    if (EndpointStore.loading) {
+                    if (endpointStore.loading) {
                       return 'Loading...'
                     }
                     return 'Not Found'

src/components/pages/WizardPage/index.jsx

@@ -24,15 +24,15 @@ import WizardPageContent from '../../organisms/WizardPageContent'
 import Modal from '../../molecules/Modal'
 import Endpoint from '../../organisms/Endpoint'
 
-import UserStore from '../../../stores/UserStore'
-import ProviderStore from '../../../stores/ProviderStore'
-import EndpointStore from '../../../stores/EndpointStore'
-import WizardStore from '../../../stores/WizardStore'
-import InstanceStore from '../../../stores/InstanceStore'
-import NetworkStore from '../../../stores/NetworkStore'
-import NotificationStore from '../../../stores/NotificationStore'
-import ScheduleStore from '../../../stores/ScheduleStore'
-import ReplicaStore from '../../../stores/ReplicaStore'
+import userStore from '../../../stores/UserStore'
+import providerStore from '../../../stores/ProviderStore'
+import endpointStore from '../../../stores/EndpointStore'
+import wizardStore from '../../../stores/WizardStore'
+import instanceStore from '../../../stores/InstanceStore'
+import networkStore from '../../../stores/NetworkStore'
+import notificationStore from '../../../stores/NotificationStore'
+import scheduleStore from '../../../stores/ScheduleStore'
+import replicaStore from '../../../stores/ReplicaStore'
 import KeyboardManager from '../../../utils/KeyboardManager'
 import { wizardConfig, executionOptions } from '../../../config'
 import type { MainItem } from '../../../types/MainItem'
@@ -71,7 +71,7 @@ class WizardPage extends React.Component<Props, State> {
   }
 
   componentWillMount() {
-    WizardStore.getDataFromPermalink()
+    wizardStore.getDataFromPermalink()
     let type = this.props.match && this.props.match.params.type
     if (type === 'migration' || type === 'replica') {
       this.setState({ type })
@@ -85,7 +85,7 @@ class WizardPage extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
-    WizardStore.clearData()
+    wizardStore.clearData()
     KeyboardManager.removeKeyDown('wizard')
   }
 
@@ -101,7 +101,7 @@ class WizardPage extends React.Component<Props, State> {
 
   handleCreationSuccess(items: MainItem[]) {
     let typeLabel = this.state.type.charAt(0).toUpperCase() + this.state.type.substr(1)
-    NotificationStore.notify(`${typeLabel} was succesfully created`, 'success', { persist: true, persistInfo: { title: `${typeLabel} created` } })
+    notificationStore.notify(`${typeLabel} was succesfully created`, 'success', { persist: true, persistInfo: { title: `${typeLabel} created` } })
     let schedulePromise = Promise.resolve()
 
     if (this.state.type === 'replica') {
@@ -129,7 +129,7 @@ class WizardPage extends React.Component<Props, State> {
   handleUserItemClick(item: { value: string }) {
     switch (item.value) {
       case 'signout':
-        UserStore.logout()
+        userStore.logout()
         return
       case 'profile':
         window.location.href = '/#/profile'
@@ -144,7 +144,7 @@ class WizardPage extends React.Component<Props, State> {
 
   handleBackClick() {
     let pages = wizardConfig.pages.filter(p => !p.excludeFrom || p.excludeFrom !== this.state.type)
-    let currentPageIndex = pages.findIndex(p => p.id === WizardStore.currentPage.id)
+    let currentPageIndex = pages.findIndex(p => p.id === wizardStore.currentPage.id)
 
     if (currentPageIndex === 0) {
       window.history.back()
@@ -153,12 +153,12 @@ class WizardPage extends React.Component<Props, State> {
 
     let page = pages[currentPageIndex - 1]
     this.loadDataForPage(page)
-    WizardStore.setCurrentPage(page)
+    wizardStore.setCurrentPage(page)
   }
 
   handleNextClick() {
     let pages = wizardConfig.pages.filter(p => !p.excludeFrom || p.excludeFrom !== this.state.type)
-    let currentPageIndex = pages.findIndex(p => p.id === WizardStore.currentPage.id)
+    let currentPageIndex = pages.findIndex(p => p.id === wizardStore.currentPage.id)
 
     if (currentPageIndex === pages.length - 1) {
       this.create()
@@ -167,23 +167,23 @@ class WizardPage extends React.Component<Props, State> {
 
     let page = pages[currentPageIndex + 1]
     this.loadDataForPage(page)
-    WizardStore.setCurrentPage(page)
+    wizardStore.setCurrentPage(page)
   }
 
   handleSourceEndpointChange(source: EndpointType) {
-    WizardStore.updateData({ source, selectedInstances: null, networks: null })
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.updateData({ source, selectedInstances: null, networks: null })
+    wizardStore.setPermalink(wizardStore.data)
     // Preload instances for 'vms' page
-    InstanceStore.loadInstances(source.id)
+    instanceStore.loadInstances(source.id)
   }
 
   handleTargetEndpointChange(target: EndpointType) {
-    WizardStore.updateData({ target, networks: null, options: null })
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.updateData({ target, networks: null, options: null })
+    wizardStore.setPermalink(wizardStore.data)
     // Preload destination options schema
-    ProviderStore.loadOptionsSchema(target.type, this.state.type).then(() => {
+    providerStore.loadOptionsSchema(target.type, this.state.type).then(() => {
       // Preload destination options values
-      return ProviderStore.getDestinationOptions(target.id, target.type)
+      return providerStore.getDestinationOptions(target.id, target.type)
     })
   }
 
@@ -198,99 +198,99 @@ class WizardPage extends React.Component<Props, State> {
   handleCloseNewEndpointModal(options?: { autoClose?: boolean }) {
     if (options) {
       if (this.state.newEndpointFromSource) {
-        WizardStore.updateData({ source: EndpointStore.endpoints[0] })
+        wizardStore.updateData({ source: endpointStore.endpoints[0] })
       } else {
-        WizardStore.updateData({ target: EndpointStore.endpoints[0] })
+        wizardStore.updateData({ target: endpointStore.endpoints[0] })
       }
     }
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.setPermalink(wizardStore.data)
     this.setState({ showNewEndpointModal: false })
   }
 
   handleInstancesSearchInputChange(searchText: string) {
-    if (WizardStore.data.source) {
-      InstanceStore.searchInstances(WizardStore.data.source.id, searchText)
+    if (wizardStore.data.source) {
+      instanceStore.searchInstances(wizardStore.data.source.id, searchText)
     }
   }
 
   handleInstancesNextPageClick(searchText: string) {
-    if (WizardStore.data.source) {
-      InstanceStore.loadNextPage(WizardStore.data.source.id, searchText)
+    if (wizardStore.data.source) {
+      instanceStore.loadNextPage(wizardStore.data.source.id, searchText)
     }
   }
 
   handleInstancesPreviousPageClick() {
-    InstanceStore.loadPreviousPage()
+    instanceStore.loadPreviousPage()
   }
 
   handleInstancesReloadClick(searchText: string) {
-    if (WizardStore.data.source) {
-      InstanceStore.reloadInstances(WizardStore.data.source.id, searchText)
+    if (wizardStore.data.source) {
+      instanceStore.reloadInstances(wizardStore.data.source.id, searchText)
     }
   }
 
   handleInstanceClick(instance: Instance) {
-    WizardStore.updateData({ networks: null })
-    WizardStore.toggleInstanceSelection(instance)
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.updateData({ networks: null })
+    wizardStore.toggleInstanceSelection(instance)
+    wizardStore.setPermalink(wizardStore.data)
   }
 
   handleOptionsChange(field: Field, value: any) {
-    WizardStore.updateData({ networks: null })
-    WizardStore.updateOptions({ field, value })
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.updateData({ networks: null })
+    wizardStore.updateOptions({ field, value })
+    wizardStore.setPermalink(wizardStore.data)
   }
 
   handleNetworkChange(sourceNic: Nic, targetNetwork: Network) {
-    WizardStore.updateNetworks({ sourceNic, targetNetwork })
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.updateNetworks({ sourceNic, targetNetwork })
+    wizardStore.setPermalink(wizardStore.data)
   }
 
   handleAddScheduleClick(schedule: Schedule) {
-    WizardStore.addSchedule(schedule)
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.addSchedule(schedule)
+    wizardStore.setPermalink(wizardStore.data)
   }
 
   handleScheduleChange(scheduleId: string, data: Schedule) {
-    WizardStore.updateSchedule(scheduleId, data)
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.updateSchedule(scheduleId, data)
+    wizardStore.setPermalink(wizardStore.data)
   }
 
   handleScheduleRemove(scheduleId: string) {
-    WizardStore.removeSchedule(scheduleId)
-    WizardStore.setPermalink(WizardStore.data)
+    wizardStore.removeSchedule(scheduleId)
+    wizardStore.setPermalink(wizardStore.data)
   }
 
   loadDataForPage(page: WizardPageType) {
     switch (page.id) {
       case 'source': {
-        ProviderStore.loadProviders()
-        EndpointStore.getEndpoints()
+        providerStore.loadProviders()
+        endpointStore.getEndpoints()
         // Preload instances if data is set from 'Permalink'
-        let source = WizardStore.data.source
-        if (InstanceStore.instances.length === 0 && source) {
-          InstanceStore.loadInstances(source.id)
+        let source = wizardStore.data.source
+        if (instanceStore.instances.length === 0 && source) {
+          instanceStore.loadInstances(source.id)
         }
         break
       }
       case 'target': {
         // Preload destination options if data is set from 'Permalink'
-        let target = WizardStore.data.target
-        if (ProviderStore.destinationOptions.length === 0 && target) {
-          ProviderStore.getDestinationOptions(target.id, target.type)
+        let target = wizardStore.data.target
+        if (providerStore.destinationOptions.length === 0 && target) {
+          providerStore.getDestinationOptions(target.id, target.type)
         }
         // Preload destination options schema
-        if (ProviderStore.optionsSchema.length === 0 && target) {
-          ProviderStore.loadOptionsSchema(target.type, this.state.type)
+        if (providerStore.optionsSchema.length === 0 && target) {
+          providerStore.loadOptionsSchema(target.type, this.state.type)
         }
         break
       }
       case 'networks':
-        if (WizardStore.data.source && WizardStore.data.selectedInstances) {
-          InstanceStore.loadInstancesDetails(WizardStore.data.source.id, WizardStore.data.selectedInstances)
+        if (wizardStore.data.source && wizardStore.data.selectedInstances) {
+          instanceStore.loadInstancesDetails(wizardStore.data.source.id, wizardStore.data.selectedInstances)
         }
-        if (WizardStore.data.target) {
-          NetworkStore.loadNetworks(WizardStore.data.target.id, WizardStore.data.options)
+        if (wizardStore.data.target) {
+          networkStore.loadNetworks(wizardStore.data.target.id, wizardStore.data.options)
         }
         break
       default:
@@ -299,11 +299,11 @@ class WizardPage extends React.Component<Props, State> {
 
   createMultiple() {
     let typeLabel = this.state.type.charAt(0).toUpperCase() + this.state.type.substr(1)
-    NotificationStore.notify(`Creating ${typeLabel}s ...`)
-    WizardStore.createMultiple(this.state.type, WizardStore.data).then(() => {
-      let items = WizardStore.createdItems
+    notificationStore.notify(`Creating ${typeLabel}s ...`)
+    wizardStore.createMultiple(this.state.type, wizardStore.data).then(() => {
+      let items = wizardStore.createdItems
       if (!items) {
-        NotificationStore.notify(`${typeLabel}s couldn't be created`, 'error')
+        notificationStore.notify(`${typeLabel}s couldn't be created`, 'error')
         this.setState({ nextButtonDisabled: false })
         return
       }
@@ -313,11 +313,11 @@ class WizardPage extends React.Component<Props, State> {
 
   createSingle() {
     let typeLabel = this.state.type.charAt(0).toUpperCase() + this.state.type.substr(1)
-    NotificationStore.notify(`Creating ${typeLabel} ...`)
-    WizardStore.create(this.state.type, WizardStore.data).then(() => {
-      let item = WizardStore.createdItem
+    notificationStore.notify(`Creating ${typeLabel} ...`)
+    wizardStore.create(this.state.type, wizardStore.data).then(() => {
+      let item = wizardStore.createdItem
       if (!item) {
-        NotificationStore.notify(`${typeLabel} couldn't be created`, 'error')
+        notificationStore.notify(`${typeLabel} couldn't be created`, 'error')
         this.setState({ nextButtonDisabled: false })
         return
       }
@@ -326,7 +326,7 @@ class WizardPage extends React.Component<Props, State> {
   }
 
   separateVms() {
-    let data = WizardStore.data
+    let data = wizardStore.data
     let separateVms = true
 
     if (data.options && data.options.separate_vm !== null && data.options.separate_vm !== undefined) {
@@ -350,17 +350,17 @@ class WizardPage extends React.Component<Props, State> {
   }
 
   scheduleReplica(replica: MainItem): Promise<void> {
-    let data = WizardStore.data
+    let data = wizardStore.data
 
     if (!data.schedules || data.schedules.length === 0) {
       return Promise.resolve()
     }
 
-    return ScheduleStore.scheduleMultiple(replica.id, data.schedules)
+    return scheduleStore.scheduleMultiple(replica.id, data.schedules)
   }
 
   executeCreatedReplica(replica: MainItem) {
-    let options = WizardStore.data.options
+    let options = wizardStore.data.options
     let executeNow = true
     if (options && options.execute_now !== null && options.execute_now !== undefined) {
       executeNow = options.execute_now
@@ -376,7 +376,7 @@ class WizardPage extends React.Component<Props, State> {
       return field
     })
 
-    ReplicaStore.execute(replica.id, executeNowOptions)
+    replicaStore.execute(replica.id, executeNowOptions)
   }
 
   render() {
@@ -384,16 +384,16 @@ class WizardPage extends React.Component<Props, State> {
       <Wrapper>
         <WizardTemplate
           pageHeaderComponent={<DetailsPageHeader
-            user={UserStore.user}
+            user={userStore.user}
             onUserItemClick={item => { this.handleUserItemClick(item) }}
           />}
           pageContentComponent={<WizardPageContent
-            page={WizardStore.currentPage}
-            providerStore={ProviderStore}
-            instanceStore={InstanceStore}
-            networkStore={NetworkStore}
-            endpoints={EndpointStore.endpoints}
-            wizardData={WizardStore.data}
+            page={wizardStore.currentPage}
+            providerStore={providerStore}
+            instanceStore={instanceStore}
+            networkStore={networkStore}
+            endpoints={endpointStore.endpoints}
+            wizardData={wizardStore.data}
             nextButtonDisabled={this.state.nextButtonDisabled}
             type={this.state.type}
             onTypeChange={isReplica => { this.handleTypeChange(isReplica) }}

src/sources/AssessmentSource.js

@@ -20,7 +20,7 @@ import type { MigrationInfo } from '../types/Assessment'
 import type { MainItem } from '../types/MainItem'
 import Api from '../utils/ApiCaller'
 import { servicesUrl } from '../config'
-import NotificationStore from '../stores/NotificationStore'
+import notificationStore from '../stores/NotificationStore'
 
 class AssessmentSourceUtils {
   static getDestinationEnv(data: MigrationInfo) {
@@ -91,7 +91,7 @@ class AssessmentSource {
           }
         }, () => {
           count += 1
-          NotificationStore.notify(`Error while migrating instance ${instance.name}`, 'error', {
+          notificationStore.notify(`Error while migrating instance ${instance.name}`, 'error', {
             persist: true,
             persistInfo: { title: 'Migration creation error' },
           })

src/sources/WizardSource.js

@@ -17,7 +17,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import cookie from 'js-cookie'
 
 import Api from '../utils/ApiCaller'
-import NotificationStore from '../stores/NotificationStore'
+import notificationStore from '../stores/NotificationStore'
 import { servicesUrl, executionOptions } from '../config'
 import type { WizardData } from '../types/WizardData'
 import type { MainItem } from '../types/MainItem'
@@ -112,7 +112,7 @@ class WizardSource {
           }
         }, () => {
           count += 1
-          NotificationStore.notify(`Error while creating ${type} for instance ${instance.name}`, 'error', {
+          notificationStore.notify(`Error while creating ${type} for instance ${instance.name}`, 'error', {
             persist: true,
             persistInfo: { title: `${type} creation error` },
           })

src/stores/MigrationStore.js

@@ -18,7 +18,7 @@ import { observable, action } from 'mobx'
 
 import type { MainItem } from '../types/MainItem'
 import type { Field } from '../types/Field'
-import NotificationStore from '../stores/NotificationStore'
+import notificationStore from '../stores/NotificationStore'
 import MigrationSource from '../sources/MigrationSource'
 
 class MigrationStore {
@@ -84,7 +84,7 @@ class MigrationStore {
         ...this.migrations,
       ]
 
-      NotificationStore.notify('Migration successfully created from replica.', 'success', {
+      notificationStore.notify('Migration successfully created from replica.', 'success', {
         action: {
           label: 'View Migration Status',
           callback: () => {

src/stores/ProviderStore.js

@@ -70,7 +70,7 @@ class ProviderStore {
     })
   }
 
-   @action getDestinationOptions(endpointId: string, provider: string): Promise<void> {
+  @action getDestinationOptions(endpointId: string, provider: string): Promise<void> {
     if (!providersWithExtraOptions.find(p => p === provider)) {
       return Promise.resolve()
     }

src/stores/ReplicaStore.js

@@ -16,13 +16,13 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observable, action } from 'mobx'
 
-import NotificationStore from '../stores/NotificationStore'
+import notificationStore from '../stores/NotificationStore'
 import ReplicaSource from '../sources/ReplicaSource'
 import type { MainItem } from '../types/MainItem'
 import type { Execution } from '../types/Execution'
 import type { Field } from '../types/Field'
 
-class ReplicaStoreUtils {
+class replicaStoreUtils {
   static getNewReplica(replicaDetails: MainItem, execution: Execution): MainItem {
     if (replicaDetails.executions) {
       return {
@@ -101,13 +101,13 @@ class ReplicaStore {
   @action execute(replicaId: string, fields?: Field[]): Promise<void> {
     return ReplicaSource.execute(replicaId, fields).then(execution => {
       if (this.replicaDetails && this.replicaDetails.id === replicaId) {
-        this.replicaDetails = ReplicaStoreUtils.getNewReplica(this.replicaDetails, execution)
+        this.replicaDetails = replicaStoreUtils.getNewReplica(this.replicaDetails, execution)
       }
 
       let replicasItemIndex = this.replicas ? this.replicas.findIndex(r => r.id === replicaId) : -1
 
       if (replicasItemIndex > -1) {
-        const updatedReplica = ReplicaStoreUtils.getNewReplica(this.replicas[replicasItemIndex], execution)
+        const updatedReplica = replicaStoreUtils.getNewReplica(this.replicas[replicasItemIndex], execution)
         this.replicas[replicasItemIndex] = updatedReplica
       }
     })
@@ -115,7 +115,7 @@ class ReplicaStore {
 
   @action cancelExecution(replicaId: string, executionId: string): Promise<void> {
     return ReplicaSource.cancelExecution(replicaId, executionId).then(() => {
-      NotificationStore.notify('Cancelled', 'success')
+      notificationStore.notify('Cancelled', 'success')
     })
   }
 
@@ -145,13 +145,13 @@ class ReplicaStore {
   @action deleteDisks(replicaId: string) {
     return ReplicaSource.deleteDisks(replicaId).then(execution => {
       if (this.replicaDetails && this.replicaDetails.id === replicaId) {
-        this.replicaDetails = ReplicaStoreUtils.getNewReplica(this.replicaDetails, execution)
+        this.replicaDetails = replicaStoreUtils.getNewReplica(this.replicaDetails, execution)
       }
 
       let replicasItemIndex = this.replicas ? this.replicas.findIndex(r => r.id === replicaId) : -1
 
       if (replicasItemIndex > -1) {
-        const updatedReplica = ReplicaStoreUtils.getNewReplica(this.replicas[replicasItemIndex], execution)
+        const updatedReplica = replicaStoreUtils.getNewReplica(this.replicas[replicasItemIndex], execution)
         this.replicas[replicasItemIndex] = updatedReplica
       }
     })

src/stores/UserStore.js

@@ -17,8 +17,8 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { observable, action } from 'mobx'
 import type { User, Credentials } from '../types/User'
 import UserSource from '../sources/UserSource'
-import ProjectStore from './ProjectStore'
-import NotificationStore from '../stores/NotificationStore'
+import projectStore from './ProjectStore'
+import notificationStore from '../stores/NotificationStore'
 
 /**
  * This is the authentication / authorization flow:
@@ -42,7 +42,7 @@ class UserStore {
       return this.loginScoped()
     }).then((user: User) => {
       this.loading = false
-      NotificationStore.notify('Signed in', 'success')
+      notificationStore.notify('Signed in', 'success')
       this.user = user
       this.getUserInfo(user)
     }).catch((reason) => {
@@ -54,15 +54,15 @@ class UserStore {
   @action loginScoped(projectId?: string): Promise<User> {
     return new Promise((resolve) => {
       const sourceLoginScoped = () => {
-        UserSource.loginScoped(projectId || ProjectStore.projects[0].id).then((user: User) => {
+        UserSource.loginScoped(projectId || projectStore.projects[0].id).then((user: User) => {
           this.user = { ...user, scoped: true }
           resolve(user)
         })
       }
-      if (ProjectStore.projects && ProjectStore.projects.length) {
+      if (projectStore.projects && projectStore.projects.length) {
         sourceLoginScoped()
       } else {
-        ProjectStore.getProjects().then(() => {
+        projectStore.getProjects().then(() => {
           sourceLoginScoped()
         })
       }
@@ -74,7 +74,7 @@ class UserStore {
       this.user = { ...this.user, ...userData }
     }).catch(reason => {
       console.error('Error while getting user data', reason)
-      NotificationStore.notify('Error while getting user data', 'error')
+      notificationStore.notify('Error while getting user data', 'error')
     })
   }
 
@@ -85,7 +85,7 @@ class UserStore {
     return UserSource.tokenLogin().then(user => {
       this.loading = false
       this.user = { ...this.user, ...user }
-      NotificationStore.notify('Signed in', 'success')
+      notificationStore.notify('Signed in', 'success')
       this.getUserInfo(user)
     }).catch(() => {
       this.loading = false
@@ -93,7 +93,7 @@ class UserStore {
   }
 
   @action switchProject(projectId: string): Promise<void> {
-    NotificationStore.notify('Switching projects')
+    notificationStore.notify('Switching projects')
     return new Promise((resolve, reject) => {
       UserSource.switchProject().then(() => {
         return this.loginScoped(projectId)
@@ -101,7 +101,7 @@ class UserStore {
         resolve()
       }).catch(reason => {
         console.error('Error switching projects', reason)
-        NotificationStore.notify('Error switching projects')
+        notificationStore.notify('Error switching projects')
         this.logout()
         reject()
       })
@@ -111,7 +111,7 @@ class UserStore {
   @action logout(): Promise<void> {
     return UserSource.logout().catch(reason => {
       console.log('Error logging out', reason)
-      NotificationStore.notify('Error logging out')
+      notificationStore.notify('Error logging out')
     })
   }
 }

src/utils/ApiCaller.js

@@ -17,7 +17,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import axios from 'axios'
 import type { AxiosXHRConfig, $AxiosXHR } from 'axios'
 
-import NotificationStore from '../stores/NotificationStore'
+import notificationStore from '../stores/NotificationStore'
 
 type Cancelable = {
   requestId: string,
@@ -90,7 +90,7 @@ class ApiCaller {
           // The request was made and the server responded with a status code
           // that falls out of the range of 2xx
           if (error.response.status !== 401 || window.location.hash !== loginUrl) {
-            NotificationStore.notify(error.response.data.error.message, 'error')
+            notificationStore.notify(error.response.data.error.message, 'error')
           }
 
           if (error.response.status === 401 && window.location.hash !== loginUrl) {
@@ -103,7 +103,7 @@ class ApiCaller {
           // The request was made but no response was received
           // `error.request` is an instance of XMLHttpRequest
           if (window.location.hash !== loginUrl) {
-            NotificationStore.notify('Request failed, there might be a problem with the connection to the server.', 'error')
+            notificationStore.notify('Request failed, there might be a problem with the connection to the server.', 'error')
           }
           console.log(`%cError No Response: ${axiosOptions.url}`, 'color: #D0021B')
           reject({})
@@ -115,7 +115,7 @@ class ApiCaller {
           }
 
           // Something happened in setting up the request that triggered an Error
-          NotificationStore.notify('Request failed, there might be a problem with the connection to the server.', 'error')
+          notificationStore.notify('Request failed, there might be a problem with the connection to the server.', 'error')
           console.log(`%cError Something happened in setting up the request: ${axiosOptions.url}`, 'color: #D0021B')
         }
       })