fix(app): properly enable/disable robot update from file button (#6483)

Fixes #5429

app/src/buildroot/selectors.js

@@ -2,7 +2,12 @@
 import semver from 'semver'
 import { createSelector } from 'reselect'
 
-import { getViewableRobots, getRobotApiVersion } from '../discovery/selectors'
+import {
+  HEALTH_STATUS_OK,
+  getViewableRobots,
+  getRobotApiVersion,
+  getRobotByName,
+} from '../discovery'
 import * as Constants from './constants'
 
 import type { State } from '../types'
@@ -14,6 +19,15 @@ import type {
   RobotSystemType,
 } from './types'
 
+// TODO(mc, 2020-08-02): i18n
+const UPDATE_SERVER_UNAVAILABLE =
+  "Unable to update because your robot's update server is not responding."
+const OTHER_ROBOT_UPDATING =
+  'Unable to update because the app is currently updating a different robot.'
+const NO_UPDATE_FILES =
+  'Unable to retrieve update for this robot. Ensure your computer is connected to the internet and try again later.'
+const UNAVAILABLE = 'Update unavailable'
+
 export function getBuildrootUpdateVersion(state: State): string | null {
   return state.buildroot.version || null
 }
@@ -87,19 +101,16 @@ export const getBuildrootRobot: State => ViewableRobot | null = createSelector(
   }
 )
 
-export function getBuildrootUpdateAvailable(
-  state: State,
-  robot: ViewableRobot
-): BuildrootUpdateType | null {
-  const updateVersion = getBuildrootUpdateVersion(state)
-  const currentVersion = getRobotApiVersion(robot)
-
+const getBuildrootUpdateType = (
+  currentVersion: string | null,
+  updateVersion: string | null
+): BuildrootUpdateType | null => {
   const validCurrent: string | null = semver.valid(currentVersion)
   const validUpdate: string | null = semver.valid(updateVersion)
   let type = null
 
-  if (validUpdate) {
-    if (!validCurrent || semver.gt(validUpdate, validCurrent)) {
+  if (validUpdate && validCurrent) {
+    if (semver.gt(validUpdate, validCurrent)) {
       type = Constants.UPGRADE
     } else if (semver.lt(validUpdate, validCurrent)) {
       type = Constants.DOWNGRADE
@@ -111,6 +122,55 @@ export function getBuildrootUpdateAvailable(
   return type
 }
 
+export function getBuildrootUpdateAvailable(
+  state: State,
+  robot: ViewableRobot
+): BuildrootUpdateType | null {
+  const currentVersion = getRobotApiVersion(robot)
+  const updateVersion = getBuildrootUpdateVersion(state)
+
+  return getBuildrootUpdateType(currentVersion, updateVersion)
+}
+
+export const getBuildrootUpdateDisplayInfo: (
+  state: State,
+  robotName: string
+) => {|
+  autoUpdateAction: string,
+  autoUpdateDisabledReason: string | null,
+  updateFromFileDisabledReason: string | null,
+|} = createSelector(
+  getRobotByName,
+  state => getBuildrootRobot(state),
+  state => getBuildrootUpdateVersion(state),
+  (robot, currentUpdatingRobot, updateVersion) => {
+    const robotVersion = robot ? getRobotApiVersion(robot) : null
+    const autoUpdateType = getBuildrootUpdateType(robotVersion, updateVersion)
+    const autoUpdateAction = autoUpdateType ?? UNAVAILABLE
+    let autoUpdateDisabledReason = null
+    let updateFromFileDisabledReason = null
+
+    if (robot?.serverHealthStatus !== HEALTH_STATUS_OK) {
+      autoUpdateDisabledReason = UPDATE_SERVER_UNAVAILABLE
+      updateFromFileDisabledReason = UPDATE_SERVER_UNAVAILABLE
+    } else if (
+      currentUpdatingRobot !== null &&
+      currentUpdatingRobot.name !== robot?.name
+    ) {
+      autoUpdateDisabledReason = OTHER_ROBOT_UPDATING
+      updateFromFileDisabledReason = OTHER_ROBOT_UPDATING
+    } else if (autoUpdateType === null) {
+      autoUpdateDisabledReason = NO_UPDATE_FILES
+    }
+
+    return {
+      autoUpdateAction,
+      autoUpdateDisabledReason,
+      updateFromFileDisabledReason,
+    }
+  }
+)
+
 export function getRobotSystemType(
   robot: ViewableRobot
 ): RobotSystemType | null {

app/src/components/ConnectPanel/RobotItem.js

@@ -31,8 +31,7 @@ export function RobotItemComponent(props: RobotItemProps): React.Node {
     return getBuildrootUpdateAvailable(state, robot) === UPGRADE
   })
   const isConnectable = status === CONNECTABLE
-  // NOTE(mc, 2020-03-30): redundant && true to satisfy Flow
-  const isConnected = Boolean(robot.connected && true)
+  const isConnected = robot.connected
   const isSelected = robot.name === match.params.name
   const connectInProgress = useSelector(
     (state: State) => RobotSelectors.getConnectRequest(state).inProgress

app/src/components/RobotSettings/AdvancedSettingsCard.js

@@ -23,7 +23,7 @@ import {
   Icon,
 } from '@opentrons/components'
 
-import { UploadRobotUpdate } from './UploadRobotUpdate'
+import { UpdateFromFileControl } from './UpdateFromFileControl'
 import { OpenJupyterControl } from './OpenJupyterControl'
 
 import type { State, Dispatch } from '../../types'
@@ -62,7 +62,7 @@ export function AdvancedSettingsCard(
   )
   const robotLogsDownloading = useSelector(getRobotLogsDownloading)
   const dispatch = useDispatch<Dispatch>()
-  const disabled = status !== CONNECTABLE
+  const controlsDisabled = status !== CONNECTABLE
   const logsAvailable = health && health.logs
 
   const showLogOptoutModal = settings.some(
@@ -76,7 +76,7 @@ export function AdvancedSettingsCard(
   }, [dispatch, name])
 
   return (
-    <Card title={TITLE} disabled={disabled}>
+    <Card title={TITLE}>
       <LabeledButton
         label="Download Logs"
         buttonProps={{
@@ -85,7 +85,7 @@ export function AdvancedSettingsCard(
           ) : (
             'Download'
           ),
-          disabled: disabled || !logsAvailable || robotLogsDownloading,
+          disabled: controlsDisabled || !logsAvailable || robotLogsDownloading,
           onClick: () => dispatch(downloadLogs(robot)),
         }}
       >
@@ -94,26 +94,30 @@ export function AdvancedSettingsCard(
       <LabeledButton
         label="Factory Reset"
         buttonProps={{
-          disabled,
+          disabled: controlsDisabled,
           Component: Link,
           to: resetUrl,
           children: 'Reset',
         }}
       >
         <p>Restore robot to factory configuration</p>
       </LabeledButton>
+      <UpdateFromFileControl
+        robotName={name}
+        borderBottom={BORDER_SOLID_LIGHT}
+      />
       <OpenJupyterControl robotIp={ip} borderBottom={BORDER_SOLID_LIGHT} />
       {settings.map(({ id, title, description, value }) => (
         <LabeledToggle
           key={id}
           label={title}
           toggledOn={value === true}
+          disabled={controlsDisabled}
           onClick={() => dispatch(updateSetting(name, id, !value))}
         >
           <p>{description}</p>
         </LabeledToggle>
       ))}
-      <UploadRobotUpdate robotName={name} />
       {showLogOptoutModal && (
         <Portal>
           <AlertModal

app/src/components/RobotSettings/ConnectionCard.js

@@ -23,7 +23,7 @@ const STATUS_REFRESH_MS = 5000
 
 export function ConnectionCard(props: Props): React.Node {
   const { robot } = props
-  const { name: robotName, status, local } = robot
+  const { name: robotName, status, local, ip } = robot
   const dispatch = useDispatch<Dispatch>()
   const internetStatus = useSelector((state: State) =>
     getInternetStatus(state, robotName)
@@ -36,10 +36,12 @@ export function ConnectionCard(props: Props): React.Node {
   useInterval(() => dispatch(fetchStatus(robotName)), STATUS_REFRESH_MS, true)
 
   return (
-    <Card key={robotName} title={CONNECTIVITY} disabled={disabled}>
+    <Card key={robotName} title={CONNECTIVITY}>
       <ConnectionStatusMessage
         type={local ? 'USB' : 'Wi-Fi'}
-        status={internetStatus}
+        status={status}
+        internetStatus={internetStatus}
+        ipAddress={ip}
       />
       <ConnectionInfo connection={wifi} title="Wi-Fi" disabled={disabled}>
         <SelectNetwork robotName={robotName} />

app/src/components/RobotSettings/ControlsCard.js

@@ -37,6 +37,7 @@ type Props = {|
 
 const TITLE = 'Robot Controls'
 
+const CANNOT_CONNECT = 'Cannot connect to robot'
 const CONNECT_TO_ROBOT = 'Connect to robot to control'
 const PROTOCOL_IS_RUNNING = 'Protocol is running'
 const BAD_DECK_CALIBRATION =
@@ -76,7 +77,9 @@ export function ControlsCard(props: Props): React.Node {
   )
 
   let buttonDisabledReason = null
-  if (notConnectable || !robot.connected) {
+  if (notConnectable) {
+    buttonDisabledReason = CANNOT_CONNECT
+  } else if (!robot.connected) {
     buttonDisabledReason = CONNECT_TO_ROBOT
   } else if (isRunning) {
     buttonDisabledReason = PROTOCOL_IS_RUNNING
@@ -95,7 +98,7 @@ export function ControlsCard(props: Props): React.Node {
   const buttonDisabled = Boolean(buttonDisabledReason)
 
   return (
-    <Card title={TITLE} disabled={notConnectable}>
+    <Card title={TITLE}>
       <DeckCalibrationControl
         robotName={robotName}
         buttonDisabled={buttonDisabled}
@@ -127,6 +130,7 @@ export function ControlsCard(props: Props): React.Node {
         label="Lights"
         toggledOn={Boolean(lightsOn)}
         onClick={toggleLights}
+        disabled={buttonDisabled}
       >
         <p>Control lights on deck.</p>
       </LabeledToggle>