Make requested changes

app/src/calibration/__tests__/reducer.test.js

@@ -2,7 +2,7 @@
 
 import * as Fixtures from '../__fixtures__'
 import * as LabwareFixtures from '../labware/__fixtures__'
-import { actions as LabwareActions } from '../labware'
+import { labware as LabwareFunctions } from '../'
 import * as Actions from '../actions'
 import { calibrationReducer } from '../reducer'
 
@@ -19,7 +19,7 @@ describe('calibration reducer', () => {
     })
   })
   it('should handle a FETCH_LABWARE_CALIBRATION_SUCCESS', () => {
-    const action = LabwareActions.fetchLabwareCalibrationSuccess(
+    const action = LabwareFunctions.fetchLabwareCalibrationSuccess(
       'robot-name',
       LabwareFixtures.mockAllLabwareCalibraton,
       {}

app/src/calibration/index.js

@@ -1,5 +1,8 @@
 // @flow
 // calibration data actions, selectors and constants
+import * as labware from './labware'
+
 export * from './actions'
 export * from './constants'
 export * from './selectors'
+export { labware }

app/src/calibration/labware/__fixtures__/labware-calibration.js

@@ -17,11 +17,11 @@ export const mockLabwareCalibration: LabwareCalibrationObjects = {
     calibrationData: {
       offset: {
         value: [0.0, 0.0, 0.0],
-        lastModified: '2020-03-27 19:43:24.642318',
+        lastModified: '2020-04-05T14:30',
       },
       tipLength: {
         value: 30,
-        lastModified: '2020-03-27 19:43:24.642318',
+        lastModified: '2007-05-05T0:30',
       },
     },
     loadName: 'opentrons_96_tiprack_10ul',

app/src/calibration/labware/selectors.js

@@ -6,6 +6,6 @@ import type { LabwareCalibrationObjects } from './../types'
 export const getListOfLabwareCalibrations = (
   state: State,
   robotName: string
-): Array<?LabwareCalibrationObjects> | null => {
+): Array<LabwareCalibrationObjects | null> | null => {
   return state.calibration[robotName]?.labwareCalibration?.data ?? null
 }

app/src/calibration/reducer.js

@@ -1,6 +1,6 @@
 // @flow
 import * as Constants from './constants'
-import { constants as LabwareConstants } from './labware'
+import { labware } from '.'
 
 import type { Action } from '../types'
 import type { CalibrationState } from './types'
@@ -22,7 +22,7 @@ export function calibrationReducer(
         },
       }
     }
-    case LabwareConstants.FETCH_LABWARE_CALIBRATION_SUCCESS: {
+    case labware.FETCH_LABWARE_CALIBRATION_SUCCESS: {
       const { robotName, labwareCalibration } = action.payload
       return {
         ...state,

app/src/components/FileInfo/ProtocolLabwareList.js

@@ -1,23 +1,24 @@
 // @flow
 import * as React from 'react'
+import { css } from 'styled-components'
 
 import {
-  DIRECTION_COLUMN,
+  DIRECTION_ROW,
   Flex,
   Text,
   Icon,
   Tooltip,
   useHoverTooltip,
-  FLEX_AUTO,
   JUSTIFY_SPACE_BETWEEN,
   FONT_SIZE_BODY_1,
   FONT_WEIGHT_REGULAR,
   C_DARK_GRAY,
   TOOLTIP_AUTO,
   SPACING_1,
+  SIZE_1,
+  C_MED_GRAY,
 } from '@opentrons/components'
 import { SectionContentFlex } from '../layout'
-import styles from './styles.css'
 
 export type ProtocolLabwareListProps = {|
   labware: Array<?string>,
@@ -34,19 +35,19 @@ export function ProtocolLabwareList({
     placement: TOOLTIP_AUTO,
   })
   const iconComponent = (
-    <Icon name="information" className={styles.calibration_data_info_icon} />
+    <Icon name="information" size={SIZE_1} color={C_MED_GRAY} />
   )
+  const TOOL_TIP_MESSAGE = 'calibrated offset from labware origin point'
   const toolTipComponent = (
-    <Tooltip {...tooltipProps}>
-      calibrated offset from labware origin point
-    </Tooltip>
+    <Tooltip {...tooltipProps}>{TOOL_TIP_MESSAGE}</Tooltip>
   )
-  const LABWARE_TYPE = "Type"
-  const LABWARE_QUANTITY = "Quantity"
-  const CALIBRATION_DATA = "Calibration Data"
+  const LABWARE_TYPE = 'Type'
+  const LABWARE_QUANTITY = 'Quantity'
+  const CALIBRATION_DATA = 'Calibration Data'
+
   return (
     <Flex
-      flexDirection={DIRECTION_COLUMN}
+      flexDirection={DIRECTION_ROW}
       justifyContent={JUSTIFY_SPACE_BETWEEN}
       fontSize={FONT_SIZE_BODY_1}
       fontWeight={FONT_WEIGHT_REGULAR}
@@ -59,17 +60,20 @@ export function ProtocolLabwareList({
       </SectionContentFlex>
       <SectionContentFlex title={LABWARE_QUANTITY}>
         {quantity.map((item, index) => (
-          <Text key={`${index}`}>{item}</Text>
+          <Text key={index}>{item}</Text>
         ))}
       </SectionContentFlex>
       <SectionContentFlex
         title={CALIBRATION_DATA}
-        width={FLEX_AUTO}
         icon={iconComponent}
         toolTipComponent={toolTipComponent}
         toolTipProps={targetProps}
       >
-        <table style={{ borderSpacing: { SPACING_1 } }}>
+        <table
+          css={css`
+            border-spacing: ${SPACING_1};
+          `}
+        >
           <tbody>{calibration}</tbody>
         </table>
       </SectionContentFlex>

app/src/components/FileInfo/__tests__/continue.test.js

@@ -1,6 +1,6 @@
 // @flow
 import * as React from 'react'
-import { Provider } from 'react-redux'
+import { Link } from 'react-router-dom'
 import { mount } from 'enzyme'
 
 import { getCalibrateLocation, getRunLocation } from '../../../nav'
@@ -27,6 +27,8 @@ const mockCalPath = '/path/to/cal'
 describe('Continue to run or calibration button component', () => {
   let mockStore
   let render
+  let props
+  let optional_link
 
   const CALIBRATE_SELECTOR = {
     id: 'calibrate',
@@ -47,17 +49,21 @@ describe('Continue to run or calibration button component', () => {
   beforeEach(() => {
     mockGetCalNavigation.mockReturnValue(CALIBRATE_SELECTOR)
     mockGetRunNavigation.mockReturnValue(RUN_SELECTOR)
+    props = {
+      labwareCalibrated: false,
+    }
+    optional_link = mockCalPath
 
     mockStore = {
       subscribe: () => {},
       getState: () => ({ state: true }),
       dispatch: jest.fn(),
     }
-    render = (labwareCalibrated: boolean = false) =>
+    render = props =>
       mount(
-        <Provider store={mockStore}>
-          <Continue labwareCalibrated={labwareCalibrated} />
-        </Provider>
+        <Link to={optional_link}>
+          <Continue {...props} />
+        </Link>
       )
   })
 

app/src/components/FileInfo/index.js

@@ -17,10 +17,7 @@ import { UploadError } from '../UploadError'
 import styles from './styles.css'
 
 import { selectors as robotSelectors } from '../../robot'
-import {
-  selectors as labwareCalibrationSelectors,
-  actions as labwareActions,
-} from '../../calibration'
+import { labware as labwareFunctions } from '../../calibration'
 
 import type { State, Dispatch } from '../../types'
 
@@ -40,15 +37,15 @@ export function FileInfo(props: FileInfoProps): React.Node {
   const { robot, sessionLoaded, sessionHasSteps } = props
   const { name: robotName } = robot
   React.useEffect(() => {
-    dispatch(labwareActions.fetchAllLabwareCalibrations(robotName))
+    dispatch(labwareFunctions.fetchAllLabwareCalibrations(robotName))
   }, [dispatch, robotName])
   let uploadError = props.uploadError
 
   const labware = useSelector((state: State) =>
     robotSelectors.getLabware(state)
   )
   const labwareCalibrations = useSelector((state: State) =>
-    labwareCalibrationSelectors.getListOfLabwareCalibrations(state, robotName)
+    labwareFunctions.getListOfLabwareCalibrations(state, robotName)
   )
 
   if (sessionLoaded && !uploadError && !sessionHasSteps) {

app/src/components/FileInfo/styles.css

@@ -115,12 +115,6 @@
   margin: 0.5rem 0.5rem 0.5rem 0;
 }
 
-.calibration_data_info_icon {
-    height: 1rem;
-    width: 1rem;
-    fill: var(--c-med-gray);
-  }
-
 .warning_info_wrapper {
   display: flex;
   align-items: center;