feat(app): add support for toggling boolean RTPs and restoring defaul…

…ts (#14770) closes [AUTH-117](https://opentrons.atlassian.net/browse/AUTH-117)
Opentrons · May 20, 2024 · c5e0ead · c5e0ead
1 parent 187f200
commit c5e0ead
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 7 deletions.
diff --git a/app/src/organisms/ProtocolSetupParameters/ResetValuesModal.tsx b/app/src/organisms/ProtocolSetupParameters/ResetValuesModal.tsx
@@ -14,13 +14,18 @@ import {
 import { SmallButton } from '../../atoms/buttons'
 import { Modal } from '../../molecules/Modal'
 
+import type { RunTimeParameter } from '@opentrons/shared-data'
 import type { ModalHeaderBaseProps } from '../../molecules/Modal/types'
 
 interface ResetValuesModalProps {
+  runTimeParametersOverrides: RunTimeParameter[]
+  setRunTimeParametersOverrides: (parameters: RunTimeParameter[]) => void
   handleGoBack: () => void
 }
 
 export function ResetValuesModal({
+  runTimeParametersOverrides,
+  setRunTimeParametersOverrides,
   handleGoBack,
 }: ResetValuesModalProps): JSX.Element {
   const { t } = useTranslation(['protocol_setup', 'shared'])
@@ -33,7 +38,12 @@ export function ResetValuesModal({
 
   // ToDo (kk:03/18/2024) reset values function will be implemented
   const handleResetValues = (): void => {
-    console.log('todo add reset values function')
+    setRunTimeParametersOverrides(
+      runTimeParametersOverrides.map(param => {
+        return { ...param, value: param.default }
+      })
+    )
+    handleGoBack()
   }
 
   const modalProps = {

diff --git a/app/src/organisms/ProtocolSetupParameters/__tests__/ResetValuesModal.test.tsx b/app/src/organisms/ProtocolSetupParameters/__tests__/ResetValuesModal.test.tsx
@@ -5,8 +5,10 @@ import { fireEvent, screen } from '@testing-library/react'
 import { renderWithProviders } from '../../../__testing-utils__'
 import { i18n } from '../../../i18n'
 import { ResetValuesModal } from '../ResetValuesModal'
+import { RunTimeParameter } from '@opentrons/shared-data'
 
 const mockGoBack = vi.fn()
+const mockSetRunTimeParametersOverrides = vi.fn()
 
 const render = (props: React.ComponentProps<typeof ResetValuesModal>) => {
   return renderWithProviders(<ResetValuesModal {...props} />, {
@@ -19,6 +21,8 @@ describe('ResetValuesModal', () => {
 
   beforeEach(() => {
     props = {
+      runTimeParametersOverrides: [] as RunTimeParameter[],
+      setRunTimeParametersOverrides: mockSetRunTimeParametersOverrides,
       handleGoBack: mockGoBack,
     }
   })
@@ -42,5 +46,11 @@ describe('ResetValuesModal', () => {
   })
 
   // ToDo (kk: 03/18/2024) reset value button test will be added
-  it.todo('should call a mock function when tapping reset values button')
+  it('should call a mock function when tapping reset values button', () => {
+    render(props)
+    const resetValuesButton = screen.getByText('Reset values')
+    fireEvent.click(resetValuesButton)
+    expect(mockSetRunTimeParametersOverrides)
+    expect(mockGoBack).toHaveBeenCalled()
+  })
 })
diff --git a/app/src/organisms/ProtocolSetupParameters/index.tsx b/app/src/organisms/ProtocolSetupParameters/index.tsx
@@ -3,13 +3,13 @@ import { useTranslation } from 'react-i18next'
 import { useHistory } from 'react-router-dom'
 import { useCreateRunMutation, useHost } from '@opentrons/react-api-client'
 import { useQueryClient } from 'react-query'
-import { formatRunTimeParameterValue } from '@opentrons/shared-data'
 import {
   ALIGN_CENTER,
   DIRECTION_COLUMN,
   Flex,
   SPACING,
 } from '@opentrons/components'
+import { formatRunTimeParameterValue } from '@opentrons/shared-data'
 
 import { ProtocolSetupStep } from '../../pages/ProtocolSetup'
 import { ChildNavigation } from '../ChildNavigation'
@@ -179,8 +179,14 @@ export function ProtocolSetupParameters({
   const [resetValuesModal, showResetValuesModal] = React.useState<boolean>(
     false
   )
-  const parameters = runTimeParameters ?? []
-  //    TODO(jr, 3/20/24): modify useCreateRunMutation to take in optional run time parameters
+
+  // todo (nd:04/01/2024): remove mock and look at runTimeParameters prop
+  // const parameters = runTimeParameters ?? []
+  const parameters = runTimeParameters ?? mockData
+  const [
+    runTimeParametersOverrides,
+    setRunTimeParametersOverrides,
+  ] = React.useState<RunTimeParameter[]>(parameters)
   const { createRun, isLoading } = useCreateRunMutation({
     onSuccess: data => {
       queryClient
@@ -197,7 +203,11 @@ export function ProtocolSetupParameters({
   return (
     <>
       {resetValuesModal ? (
-        <ResetValuesModal handleGoBack={() => showResetValuesModal(false)} />
+        <ResetValuesModal
+          runTimeParametersOverrides={runTimeParametersOverrides}
+          setRunTimeParametersOverrides={setRunTimeParametersOverrides}
+          handleGoBack={() => showResetValuesModal(false)}
+        />
       ) : null}
 
       <ChildNavigation
@@ -218,7 +228,7 @@ export function ProtocolSetupParameters({
         alignItems={ALIGN_CENTER}
         flexDirection={DIRECTION_COLUMN}
         gridGap={SPACING.spacing8}
-        paddingX={SPACING.spacing8}
+        paddingX={SPACING.spacing40}
       >
         {parameters.map((parameter, index) => {
           return (