add useFeatureFlag and update test

app/src/organisms/ProtocolSetupParameters/__tests__/ProtocolSetupParameters.test.tsx

@@ -12,8 +12,14 @@ import { renderWithProviders } from '../../../__testing-utils__'
 import { ProtocolSetupParameters } from '..'
 import { ChooseEnum } from '../ChooseEnum'
 import { mockRunTimeParameterData } from '../../../pages/ProtocolDetails/fixtures'
+import { useFeatureFlag } from '../../../redux/config'
+
 import type * as ReactRouterDom from 'react-router-dom'
 import type { HostConfig } from '@opentrons/api-client'
+import type {
+  CompletedProtocolAnalysis,
+  RunTimeParameter,
+} from '@opentrons/shared-data'
 
 const mockGoBack = vi.fn()
 
@@ -27,16 +33,24 @@ vi.mock('react-router-dom', async importOriginal => {
     useHistory: () => ({ goBack: mockGoBack } as any),
   }
 })
+vi.mock('../../../redux/config')
+
 const MOCK_HOST_CONFIG: HostConfig = { hostname: 'MOCK_HOST' }
 const mockCreateProtocolAnalysis = vi.fn()
 const mockCreateRun = vi.fn()
+const mockMostRecentAnalysis = ({
+  commands: [],
+  labware: [],
+} as unknown) as CompletedProtocolAnalysis
+
 const render = (
   props: React.ComponentProps<typeof ProtocolSetupParameters>
 ) => {
   return renderWithProviders(<ProtocolSetupParameters {...props} />, {
     i18nInstance: i18n,
   })
 }
+
 describe('ProtocolSetupParameters', () => {
   let props: React.ComponentProps<typeof ProtocolSetupParameters>
 
@@ -45,6 +59,7 @@ describe('ProtocolSetupParameters', () => {
       protocolId: 'mockId',
       labwareOffsets: [],
       runTimeParameters: mockRunTimeParameterData,
+      mostRecentAnalysis: mockMostRecentAnalysis,
     }
     vi.mocked(ChooseEnum).mockReturnValue(<div>mock ChooseEnum</div>)
     vi.mocked(useHost).mockReturnValue(MOCK_HOST_CONFIG)
@@ -54,6 +69,9 @@ describe('ProtocolSetupParameters', () => {
     when(vi.mocked(useCreateRunMutation))
       .calledWith(expect.anything())
       .thenReturn({ createRun: mockCreateRun } as any)
+    when(vi.mocked(useFeatureFlag))
+      .calledWith('enableCsvFile')
+      .thenReturn(false)
   })
 
   it('renders the parameters labels and mock data', () => {
@@ -109,4 +127,36 @@ describe('ProtocolSetupParameters', () => {
     fireEvent.click(screen.getByRole('button', { name: 'Go back' }))
     expect(title).not.toBeInTheDocument()
   })
+
+  it('render csv file when a protocol requires a csv file', () => {
+    when(vi.mocked(useFeatureFlag)).calledWith('enableCsvFile').thenReturn(true)
+    const mockMostRecentAnalysisForCsv = ({
+      commands: [],
+      labware: [],
+      result: 'parameter-value-required',
+    } as unknown) as CompletedProtocolAnalysis
+    const mockCSVData = {
+      file: { id: 'test', file: { name: 'mock.csv' } as File },
+      displayName: 'My CSV File',
+      variableName: 'CSVFILE',
+      description: 'CSV File for a protocol',
+      type: 'csv_file' as const,
+    } as RunTimeParameter
+    const mockRunTimeParameterDataForCsv = [
+      ...mockRunTimeParameterData,
+      mockCSVData,
+    ]
+
+    render({
+      ...props,
+      runTimeParameters: mockRunTimeParameterDataForCsv,
+      mostRecentAnalysis: mockMostRecentAnalysisForCsv,
+    })
+    screen.getByText('CSV File')
+    screen.getByText('Required')
+  })
+
+  it.todo(
+    'render csv file name when a protocol analysis result is not parameter-value-required'
+  )
 })

app/src/organisms/ProtocolSetupParameters/index.tsx

@@ -24,8 +24,10 @@ import { ChildNavigation } from '../ChildNavigation'
 import { ResetValuesModal } from './ResetValuesModal'
 import { ChooseEnum } from './ChooseEnum'
 import { ChooseNumber } from './ChooseNumber'
+import { useFeatureFlag } from '../../redux/config'
 
 import type {
+  CompletedProtocolAnalysis,
   ChoiceParameter,
   NumberParameter,
   RunTimeParameter,
@@ -37,14 +39,17 @@ interface ProtocolSetupParametersProps {
   protocolId: string
   runTimeParameters: RunTimeParameter[]
   labwareOffsets?: LabwareOffsetCreateData[]
+  mostRecentAnalysis?: CompletedProtocolAnalysis | null
 }
 
 export function ProtocolSetupParameters({
   protocolId,
   labwareOffsets,
   runTimeParameters,
+  mostRecentAnalysis,
 }: ProtocolSetupParametersProps): JSX.Element {
   const { t } = useTranslation('protocol_setup')
+  const enableCsvFile = useFeatureFlag('enableCsvFile')
   const history = useHistory()
   const host = useHost()
   const queryClient = useQueryClient()
@@ -184,7 +189,9 @@ export function ProtocolSetupParameters({
                   hasRightIcon={!(parameter.type === 'bool')}
                   hasLeftIcon={false}
                   status={
-                    parameter.type === 'csv_file' ? 'not ready' : 'inform'
+                    enableCsvFile && parameter.type === 'csv_file'
+                      ? 'not ready'
+                      : 'inform'
                   }
                   title={
                     parameter.type === 'csv_file'
@@ -195,7 +202,9 @@ export function ProtocolSetupParameters({
                     handleSetParameter(parameter)
                   }}
                   detail={
-                    parameter.type === 'csv_file'
+                    enableCsvFile && // ToDo this line will be removed
+                    parameter.type === 'csv_file' &&
+                    mostRecentAnalysis?.result === 'parameter-value-required'
                       ? t('required')
                       : formatRunTimeParameterValue(parameter, t)
                   }

app/src/pages/ProtocolDetails/index.tsx

@@ -459,6 +459,7 @@ export function ProtocolDetails(): JSX.Element | null {
       protocolId={protocolId}
       labwareOffsets={labwareOffsets}
       runTimeParameters={runTimeParameters}
+      mostRecentAnalysis={mostRecentAnalysis}
     />
   ) : (
     <>