fix(app): use Keyboard.onInit hook to set the initial value of the ke…

…yboard. (#16147)
Opentrons · Aug 28, 2024 · b3ad084 · b3ad084
1 parent cd1a05b
commit b3ad084
Show file tree

Hide file tree

Showing 8 changed files with 10 additions and 0 deletions.
diff --git a/app/src/atoms/SoftwareKeyboard/NumericalKeyboard/index.tsx b/app/src/atoms/SoftwareKeyboard/NumericalKeyboard/index.tsx
@@ -13,6 +13,7 @@ interface NumericalKeyboardProps {
   isDecimal?: boolean
   hasHyphen?: boolean
   debug?: boolean
+  initialValue?: string
 }
 
 // the default keyboard layout intKeyboard that doesn't have decimal point and hyphen.
@@ -22,6 +23,7 @@ export function NumericalKeyboard({
   isDecimal = false,
   hasHyphen = false,
   debug = false,
+  initialValue = '',
 }: NumericalKeyboardProps): JSX.Element {
   const layoutName = `${isDecimal ? 'float' : 'int'}${
     hasHyphen ? 'NegKeyboard' : 'Keyboard'
@@ -35,6 +37,7 @@ export function NumericalKeyboard({
     <Keyboard
       keyboardRef={r => (keyboardRef.current = r)}
       theme={'hg-theme-default oddTheme1 numerical-keyboard'}
+      onInit={keyboard => {keyboard.setInput(initialValue)}}
       onChange={onChange}
       display={numericalCustom}
       useButtonTag={true}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/AirGap.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/AirGap.tsx
@@ -205,6 +205,7 @@ export function AirGap(props: AirGapProps): JSX.Element {
           >
             <NumericalKeyboard
               keyboardRef={keyboardRef}
+              initialValue={String(volume)}
               onChange={e => {
                 setVolume(Number(e))
               }}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/Delay.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/Delay.tsx
@@ -262,6 +262,7 @@ export function Delay(props: DelayProps): JSX.Element {
           >
             <NumericalKeyboard
               keyboardRef={keyboardRef}
+              initialValue={String(position)}
               onChange={e => {
                 setPosition(Number(e))
               }}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/FlowRate.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/FlowRate.tsx
@@ -141,6 +141,7 @@ export function FlowRateEntry(props: FlowRateEntryProps): JSX.Element {
         >
           <NumericalKeyboard
             keyboardRef={keyboardRef}
+            initialValue={String(flowRate)}
             onChange={e => {
               setFlowRate(Number(e))
             }}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/Mix.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/Mix.tsx
@@ -202,6 +202,7 @@ export function Mix(props: MixProps): JSX.Element {
           >
             <NumericalKeyboard
               keyboardRef={keyboardRef}
+              initialValue={String(mixVolume)}
               onChange={e => {
                 setMixVolume(Number(e))
               }}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/PipettePath.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/PipettePath.tsx
@@ -199,6 +199,7 @@ export function PipettePath(props: PipettePathProps): JSX.Element {
           >
             <NumericalKeyboard
               keyboardRef={keyboardRef}
+              initialValue={String(disposalVolume)}
               onChange={e => {
                 setDisposalVolume(Number(e))
               }}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/TipPosition.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/TipPosition.tsx
@@ -132,6 +132,7 @@ export function TipPositionEntry(props: TipPositionEntryProps): JSX.Element {
         >
           <NumericalKeyboard
             keyboardRef={keyboardRef}
+            initialValue={String(tipPosition)}
             onChange={e => {
               setTipPosition(Number(e))
             }}

diff --git a/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/TouchTip.tsx b/app/src/organisms/QuickTransferFlow/QuickTransferAdvancedSettings/TouchTip.tsx
@@ -194,6 +194,7 @@ export function TouchTip(props: TouchTipProps): JSX.Element {
           >
             <NumericalKeyboard
               keyboardRef={keyboardRef}
+              initialValue={String(position)}
               onChange={e => {
                 setPosition(Number(e))
               }}