modify a component name

protocol-designer/src/pages/Designer/ProtocolSteps/Timeline/SubstepsToolbox.tsx

@@ -22,12 +22,12 @@ import { ThermocyclerProfileSubsteps } from './ThermocyclerProfileSubsteps'
 import type { SubstepIdentifier } from '../../../../steplist'
 import type { HoverOnSubstepAction } from '../../../../ui/steps'
 
-interface SubstepsToolboxProps {
+interface SubStepsToolboxProps {
   stepId: string
 }
 
-export function SubstepsToolbox(
-  props: SubstepsToolboxProps
+export function SubStepsToolbox(
+  props: SubStepsToolboxProps
 ): JSX.Element | null {
   const { stepId } = props
   const { t, i18n } = useTranslation([

protocol-designer/src/pages/Designer/ProtocolSteps/Timeline/index.ts

@@ -1,2 +1,2 @@
-export * from './SubstepsToolbox'
+export * from './SubStepsToolbox'
 export * from './TimelineToolbox'

protocol-designer/src/pages/Designer/ProtocolSteps/__tests__/ProtocolSteps.test.tsx

@@ -19,8 +19,9 @@ import {
 import { getEnableHotKeysDisplay } from '../../../../feature-flags/selectors'
 import { DeckSetupContainer } from '../../DeckSetup'
 import { OffDeck } from '../../Offdeck'
+import { SubStepsToolbox } from '../Timeline'
 import { ProtocolSteps } from '..'
-import { SubstepsToolbox, TimelineToolbox } from '../Timeline'
+
 import type { SavedStepFormState } from '../../../../step-forms'
 
 vi.mock('../../Offdeck')
@@ -64,15 +65,15 @@ describe('ProtocolSteps', () => {
       timeline: [],
       errors: [],
     })
-    vi.mocked(TimelineToolbox).mockReturnValue(<div>mock TimelineToolbox</div>)
+    // vi.mocked(TimelineToolbox).mockReturnValue(<div>mock TimelineToolbox</div>)
     vi.mocked(DeckSetupContainer).mockReturnValue(
       <div>mock DeckSetupContainer</div>
     )
     vi.mocked(getSelectedTerminalItemId).mockReturnValue(null)
     vi.mocked(OffDeck).mockReturnValue(<div>mock OffDeck</div>)
     vi.mocked(getUnsavedForm).mockReturnValue(null)
     vi.mocked(getSelectedSubstep).mockReturnValue(null)
-    vi.mocked(SubstepsToolbox).mockReturnValue(<div>mock SubstepsToolbox</div>)
+    vi.mocked(SubStepsToolbox).mockReturnValue(<div>mock SubStepsToolbox</div>)
     vi.mocked(getEnableHotKeysDisplay).mockReturnValue(true)
     vi.mocked(getSavedStepForms).mockReturnValue(
       MOCK_STEP_FORMS as SavedStepFormState
@@ -84,7 +85,7 @@ describe('ProtocolSteps', () => {
 
   it('renders each component in ProtocolSteps', () => {
     render()
-    screen.getByText('mock TimelineToolbox')
+    // screen.getByText('mock TimelineToolbox')
     screen.getByText('mock DeckSetupContainer')
   })
 
@@ -98,7 +99,7 @@ describe('ProtocolSteps', () => {
   it('renders the substepToolbox when selectedSubstep is not null', () => {
     vi.mocked(getSelectedSubstep).mockReturnValue('mockId')
     render()
-    screen.getByText('mock SubstepsToolbox')
+    screen.getByText('mock SubStepsToolbox')
   })
 
   it('renders the hot keys display', () => {

protocol-designer/src/pages/Designer/ProtocolSteps/index.tsx

@@ -32,7 +32,7 @@ import {
 } from '../../../ui/steps/selectors'
 import { DeckSetupContainer } from '../DeckSetup'
 import { OffDeck } from '../Offdeck'
-import { SubstepsToolbox } from './Timeline'
+import { SubStepsToolbox } from './Timeline'
 import { StepForm } from './StepForm'
 import { StepSummary } from './StepSummary'
 import { BatchEditToolbox } from './BatchEditToolbox'
@@ -173,7 +173,7 @@ export function ProtocolSteps(): JSX.Element {
         ) : null}
       </Flex>
       {formData == null && selectedSubstep ? (
-        <SubstepsToolbox stepId={selectedSubstep} />
+        <SubStepsToolbox stepId={selectedSubstep} />
       ) : null}
       <StepForm />
       {isMultiSelectMode ? <BatchEditToolbox /> : null}