feat(app): add parameters tab in protocol setup page

add parameters tab in protocol setup page but without update chips. the chip part will be
implemented in a following PR.

close AUTH-102

app/src/App/types.ts

@@ -31,7 +31,11 @@ export type AppSettingsTab =
   | 'advanced'
   | 'feature-flags'
 
-export type ProtocolRunDetailsTab = 'setup' | 'module-controls' | 'run-preview'
+export type ProtocolRunDetailsTab =
+  | 'setup'
+  | 'module-controls'
+  | 'run-preview'
+  | 'runtime-parameters'
 
 /**
  * desktop app route params type definition

app/src/assets/localization/en/protocol_setup.json

@@ -57,6 +57,7 @@
   "deck_conflict_info": "<block>Update the deck configuration by removing the <strong>{{currentFixture}}</strong> in location <strong>{{cutout}}</strong>. Either remove the fixture from the deck configuration or update the protocol.</block>",
   "deck_conflict": "Deck location conflict",
   "deck_map": "Deck Map",
+  "default_values": "Default values",
   "example": "Example",
   "extension_mount": "extension mount",
   "extra_attention_warning_title": "Secure labware and modules before proceeding to run",
@@ -177,6 +178,7 @@
   "on_deck": "On deck",
   "on-deck_labware": "{{count}} on-deck labware",
   "opening": "Opening...",
+  "parameters": "Parameters",
   "pipette_mismatch": "Pipette generation mismatch.",
   "pipette_missing": "Pipette missing",
   "pipette_offset_cal_description_bullet_1": "Perform Pipette Offset calibration the first time you attach a pipette to a new mount.",

app/src/assets/localization/en/run_details.json

@@ -1,59 +1,62 @@
 {
   "analysis_failure_on_robot": "An error occurred while attempting to analyze {{protocolName}} on {{robotName}}. Fix the following error and try running this protocol again.",
   "analyzing_on_robot": "Analyzing on robot",
-  "anticipated": "Anticipated steps",
   "anticipated_step": "Anticipated steps",
+  "anticipated": "Anticipated steps",
   "apply_stored_data": "Apply stored data",
   "apply_stored_labware_offset_data": "Apply stored Labware Offset data?",
-  "cancel_run": "Cancel run",
   "cancel_run_alert_info": "Doing so will terminate this run, drop any attached tips in the trash container and home your robot.",
+  "cancel_run_and_restart": "Cancel the run and restart setup to edit",
   "cancel_run_modal_back": "No, go back",
   "cancel_run_modal_confirm": "Yes, cancel run",
   "cancel_run_modal_heading": "Are you sure you want to cancel this run?",
   "cancel_run_module_info": "Additionally, any hardware modules used within the protocol will remain active and maintain their current states until deactivated.",
-  "canceling_run": "Canceling Run",
+  "cancel_run": "Cancel run",
   "canceling_run_dot": "canceling run...",
-  "clear_protocol": "Clear protocol",
+  "canceling_run": "Canceling Run",
   "clear_protocol_to_make_available": "Clear protocol from robot to make it available.",
+  "clear_protocol": "Clear protocol",
   "close_door_to_resume": "Close robot door to resume run",
   "close_door": "Close robot door",
   "closing_protocol": "Closing Protocol",
-  "comment": "Comment",
   "comment_step": "Comment",
+  "comment": "Comment",
   "complete_protocol_to_download": "Complete the protocol to download the run log",
   "contact_information": "Download the robot logs from the Opentrons App and send it to [email protected] for assistance.",
-  "current_step": "Current Step",
-  "current_step_pause": "Current Step - Paused by User",
   "current_step_pause_timer": "Timer",
+  "current_step_pause": "Current Step - Paused by User",
+  "current_step": "Current Step",
   "current_temperature": "Current: {{temperature}} °C",
+  "custom_values": "Custom values",
   "data_out_of_date": "This data is likely out of date",
   "door_is_open": "Robot door is open",
   "door_open_pause": "Current Step - Paused - Door Open",
   "download_run_log": "Download run log",
   "downloading_run_log": "Downloading run log",
   "drop_tip": "Dropping tip in {{well_name}} of {{labware}} in {{labware_location}}",
   "duration": "Duration",
-  "end": "End",
   "end_of_protocol": "End of protocol",
   "end_step_time": "End",
+  "end": "End",
   "error_info": "Error {{errorCode}}: {{errorType}}",
   "error_type": "Error: {{errorType}}",
   "failed_step": "Failed step",
   "final_step": "Final Step",
   "ignore_stored_data": "Ignore stored data",
-  "labware": "labware",
   "labware_offset_data": "labware offset data",
+  "labware": "labware",
   "left": "Left",
-  "load_labware_info_protocol_setup": "Load {{labware}} in {{module_name}} in Slot {{slot_name}}",
-  "load_labware_info_protocol_setup_adapter": "Load {{labware}} in {{adapter_name}} in Slot {{slot_name}}",
+  "listed_values": "Listed values are view-only",
   "load_labware_info_protocol_setup_adapter_module": "Load {{labware}} in {{adapter_name}} in {{module_name}} in Slot {{slot_name}}",
   "load_labware_info_protocol_setup_adapter_off_deck": "Load {{labware}} in {{adapter_name}} off deck",
+  "load_labware_info_protocol_setup_adapter": "Load {{labware}} in {{adapter_name}} in Slot {{slot_name}}",
   "load_labware_info_protocol_setup_no_module": "Load {{labware}} in Slot {{slot_name}}",
   "load_labware_info_protocol_setup_off_deck": "Load {{labware}} off deck",
   "load_labware_info_protocol_setup_plural": "Load {{labware}} in {{module_name}}",
+  "load_labware_info_protocol_setup": "Load {{labware}} in {{module_name}} in Slot {{slot_name}}",
   "load_liquids_info_protocol_setup": "Load {{liquid}} into {{labware}}",
-  "load_module_protocol_setup": "Load {{module}} in Slot {{slot_name}}",
   "load_module_protocol_setup_plural": "Load {{module}}",
+  "load_module_protocol_setup": "Load {{module}} in Slot {{slot_name}}",
   "load_pipette_protocol_setup": "Load {{pipette_name}} in {{mount_name}} Mount",
   "loading_protocol": "Loading Protocol",
   "location": "location",
@@ -65,9 +68,10 @@
   "not_available_for_a_run_in_progress": "not available for a run in progress",
   "not_started_yet": "Not started yet",
   "off_deck": "Off deck",
-  "pause": "Pause",
+  "parameters": "Parameters",
   "pause_protocol": "Pause protocol",
   "pause_run": "Pause run",
+  "pause": "Pause",
   "paused_for": "Paused For",
   "pickup_tip": "Picking up tip from {{well_name}} of {{labware}} in {{labware_location}}",
   "plus_more": "+{{count}} more",
@@ -89,34 +93,33 @@
   "right": "Right",
   "robot_has_previous_offsets": "This robot has stored Labware Offset data from previous protocol runs. Do you want to apply that data to this protocol run? You can still adjust any offsets with Labware Position Check.",
   "robot_was_recalibrated": "This robot was recalibrated after this Labware Offset data was stored.",
-  "run": "Run",
   "run_again": "Run again",
-  "run_canceled": "Run canceled.",
   "run_canceled_splash": "Run canceled",
-  "run_complete": "Run completed",
+  "run_canceled": "Run canceled.",
   "run_complete_splash": "Run completed",
+  "run_complete": "Run completed",
   "run_completed": "Run completed.",
   "run_cta_disabled": "Complete required steps on Protocol tab before starting the run",
-  "run_failed": "Run failed.",
   "run_failed_modal_body": "Error occurred when protocol was {{command}}",
-  "run_failed_modal_description": "Please contact [email protected] with relevant information for assistance with troubleshooting.",
   "run_failed_modal_description_desktop": "Download the run log and send it to [email protected] for assistance.",
+  "run_failed_modal_description": "Please contact [email protected] with relevant information for assistance with troubleshooting.",
   "run_failed_modal_header": "{{errorName}}: {{errorCode}} at protocol step {{count}}",
   "run_failed_modal_title": "Run failed",
   "run_failed_splash": "Run failed",
+  "run_failed": "Run failed.",
   "run_has_diverged_from_predicted": "Run has diverged from predicted state. Cannot anticipate new steps.",
   "run_preview": "Run Preview",
   "run_protocol": "Run Protocol",
   "run_status": "Status: {{status}}",
   "run_time": "Run Time",
-  "setup": "Setup",
+  "run": "Run",
   "setup_incomplete": "Complete required steps in Setup tab",
+  "setup": "Setup",
   "slot": "Slot {{slotName}}",
-  "start": "Start",
   "start_run": "Start run",
   "start_step_time": "Start",
   "start_time": "Start Time",
-  "status": "Status",
+  "start": "Start",
   "status_blocked-by-open-door": "Paused - door open",
   "status_failed": "Failed",
   "status_finishing": "Finishing",
@@ -127,6 +130,7 @@
   "status_stop-requested": "Stop requested",
   "status_stopped": "Canceled",
   "status_succeeded": "Completed",
+  "status": "Status",
   "step_failed": "Step failed",
   "step_number": "Step {{step_number}}:",
   "steps_total": "{{count}} steps total",
@@ -135,11 +139,11 @@
   "temperature_not_available": "{{temperature_type}}: n/a",
   "thermocycler_error_tooltip": "Module encountered an anomaly, please contact support",
   "total_elapsed_time": "Total elapsed time",
-  "total_step_count": "{{count}} step total",
   "total_step_count_plural": "{{count}} steps total",
+  "total_step_count": "{{count}} step total",
   "unable_to_determine_steps": "Unable to determine steps",
   "view_analysis_error_details": "View <errorLink>error details</errorLink>",
   "view_current_step": "View current step",
-  "view_error": "View error",
-  "view_error_details": "View error details"
+  "view_error_details": "View error details",
+  "view_error": "View error"
 }

app/src/organisms/Devices/ProtocolRun/ProtocolRunRunTimeParameters.tsx

@@ -0,0 +1,188 @@
+import * as React from 'react'
+import { useTranslation } from 'react-i18next'
+import {
+  ALIGN_CENTER,
+  COLORS,
+  DIRECTION_COLUMN,
+  DIRECTION_ROW,
+  Flex,
+  SPACING,
+  TYPOGRAPHY,
+} from '@opentrons/components'
+
+import { StyledText } from '../../../atoms/text'
+import { NoParameter } from '../../ProtocolDetails/ProtocolParameters/NoParameter'
+import { useMostRecentCompletedAnalysis } from '../../LabwarePositionCheck/useMostRecentCompletedAnalysis'
+
+import { RunTimeParameter } from '@opentrons/shared-data'
+
+const mockData: RunTimeParameter[] = [
+  {
+    displayName: 'Dry Run',
+    variableName: 'DRYRUN',
+    description: 'Is this a dry or wet run? Wet is true, dry is false',
+    type: 'boolean',
+    default: false,
+  },
+  {
+    displayName: 'Use Gripper',
+    variableName: 'USE_GRIPPER',
+    description: 'For using the gripper.',
+    type: 'boolean',
+    default: true,
+  },
+  {
+    displayName: 'Trash Tips',
+    variableName: 'TIP_TRASH',
+    description:
+      'to throw tip into the trash or to not throw tip into the trash',
+    type: 'boolean',
+    default: true,
+  },
+  {
+    displayName: 'Deactivate Temperatures',
+    variableName: 'DEACTIVATE_TEMP',
+    description: 'deactivate temperature on the module',
+    type: 'boolean',
+    default: true,
+  },
+  {
+    displayName: 'Columns of Samples',
+    variableName: 'COLUMNS',
+    description: 'How many columns do you want?',
+    type: 'int',
+    min: 1,
+    max: 14,
+    default: 4,
+  },
+  {
+    displayName: 'PCR Cycles',
+    variableName: 'PCR_CYCLES',
+    description: 'number of PCR cycles on a thermocycler',
+    type: 'int',
+    min: 1,
+    max: 10,
+    default: 6,
+  },
+  {
+    displayName: 'EtoH Volume',
+    variableName: 'ETOH_VOLUME',
+    description: '70% ethanol volume',
+    type: 'float',
+    suffix: 'mL',
+    min: 1.5,
+    max: 10.0,
+    default: 6.5,
+  },
+  {
+    displayName: 'Default Module Offsets',
+    variableName: 'DEFAULT_OFFSETS',
+    description: 'default module offsets for temp, H-S, and none',
+    type: 'str',
+    choices: [
+      {
+        displayName: 'No offsets',
+        value: 'none',
+      },
+      {
+        displayName: 'temp offset',
+        value: '1',
+      },
+      {
+        displayName: 'heater-shaker offset',
+        value: '2',
+      },
+    ],
+    default: 'none',
+  },
+  {
+    displayName: 'pipette mount',
+    variableName: 'mont',
+    description: 'pipette mount',
+    type: 'str',
+    choices: [
+      {
+        displayName: 'Left',
+        value: 'left',
+      },
+      {
+        displayName: 'Right',
+        value: 'right',
+      },
+    ],
+    default: 'left',
+  },
+  {
+    displayName: 'short test case',
+    variableName: 'short 2 options',
+    description: 'this play 2 short options',
+    type: 'str',
+    choices: [
+      {
+        displayName: 'OT-2',
+        value: 'ot2',
+      },
+      {
+        displayName: 'Flex',
+        value: 'flex',
+      },
+    ],
+    default: 'flex',
+  },
+  {
+    displayName: 'long test case',
+    variableName: 'long 2 options',
+    description: 'this play 2 long options',
+    type: 'str',
+    choices: [
+      {
+        displayName: 'I am kind of long text version',
+        value: 'ot2',
+      },
+      {
+        displayName: 'I am kind of long text version. Today is 3/15',
+        value: 'flex',
+      },
+    ],
+    default: 'flex',
+  },
+]
+
+interface ProtocolRunRuntimeParametersProps {
+  runId: string
+}
+export function ProtocolRunRuntimeParameters({
+  runId,
+}: ProtocolRunRuntimeParametersProps): JSX.Element {
+  const { t } = useTranslation('protocol_setup')
+  const mostRecentAnalysis = useMostRecentCompletedAnalysis(runId)
+  const parameters = mostRecentAnalysis?.runTimeParameters ?? mockData
+  const isNoParameter = parameters.length < 1
+  return (
+    <Flex flexDirection={DIRECTION_COLUMN}>
+      <Flex backgroundColor={COLORS.white} padding={SPACING.spacing16}>
+        <Flex
+          flexDirection={DIRECTION_ROW}
+          gridGap={SPACING.spacing8}
+          alignItems={ALIGN_CENTER}
+        >
+          <StyledText as="h3" fontWeight={TYPOGRAPHY.fontWeightSemiBold}>
+            {t('parameters')}
+          </StyledText>
+          {!isNoParameter ? (
+            <StyledText as="label" color={COLORS.grey60}>
+              {t('default_values')}
+            </StyledText>
+          ) : null}
+        </Flex>
+      </Flex>
+      <Flex backgroundColor={COLORS.white} padding={SPACING.spacing16}>
+        {isNoParameter ? (
+          <NoParameter />
+        ) : (
+          <StyledText>{'parameters'}</StyledText>
+        )}
+      </Flex>
+    </Flex>
+  )
+}