diff --git a/packages/desktop-client/src/components/accounts/MobileAccountDetails.jsx b/packages/desktop-client/src/components/accounts/MobileAccountDetails.jsx
index bd7c60bc4287fcd7941580a27ac9eba4fe5f6ea9..b1dbe957fb99de10f38fe2ee887b1ba19e63898a 100644
--- a/packages/desktop-client/src/components/accounts/MobileAccountDetails.jsx
+++ b/packages/desktop-client/src/components/accounts/MobileAccountDetails.jsx
@@ -43,7 +43,7 @@ function TransactionSearchInput({ accountName, onSearch }) {
/>
}
value={text}
- onUpdate={text => {
+ onChangeValue={text => {
setText(text);
onSearch(text);
}}
diff --git a/packages/desktop-client/src/components/common/Input.tsx b/packages/desktop-client/src/components/common/Input.tsx
index 390473a405cae56456a1b55ab4a52daa671a75c2..7b24ccf45a76fca18dba27e11a9d2cb91e98987c 100644
--- a/packages/desktop-client/src/components/common/Input.tsx
+++ b/packages/desktop-client/src/components/common/Input.tsx
@@ -27,6 +27,7 @@ export type InputProps = InputHTMLAttributes<HTMLInputElement> & {
inputRef?: Ref<HTMLInputElement>;
onEnter?: (event: KeyboardEvent<HTMLInputElement>) => void;
onEscape?: (event: KeyboardEvent<HTMLInputElement>) => void;
+ onChangeValue?: (newValue: string) => void;
onUpdate?: (newValue: string) => void;
focused?: boolean;
};
@@ -36,6 +37,7 @@ export function Input({
inputRef,
onEnter,
onEscape,
+ onChangeValue,
onUpdate,
focused,
...nativeProps
@@ -73,10 +75,12 @@ export function Input({
nativeProps.onKeyDown?.(e);
}}
+ onBlur={e => {
+ onUpdate?.(e.target.value);
+ nativeProps.onBlur?.(e);
+ }}
onChange={e => {
- if (onUpdate) {
- onUpdate(e.target.value);
- }
+ onChangeValue?.(e.target.value);
nativeProps.onChange?.(e);
}}
/>
diff --git a/packages/desktop-client/src/components/common/Search.tsx b/packages/desktop-client/src/components/common/Search.tsx
index 7068ef5783fd8d6706dbf2881c89d42ec871f014..1c7af09102b909a13684a7396ad68b7c2ea1bd4d 100644
--- a/packages/desktop-client/src/components/common/Search.tsx
+++ b/packages/desktop-client/src/components/common/Search.tsx
@@ -1,5 +1,5 @@
// @ts-strict-ignore
-import { type ChangeEvent, type Ref } from 'react';
+import { type Ref } from 'react';
import { SvgRemove, SvgSearchAlternate } from '../../icons/v2';
import { theme } from '../../style';
@@ -83,7 +83,7 @@ export function Search({
onKeyDown={e => {
if (e.key === 'Escape') onChange('');
}}
- onChange={(e: ChangeEvent<HTMLInputElement>) => onChange(e.target.value)}
+ onChangeValue={value => onChange(value)}
/>
);
}
diff --git a/packages/desktop-client/src/components/filters/NameFilter.tsx b/packages/desktop-client/src/components/filters/NameFilter.tsx
index 815860b07691363bd093448150726e171cca886c..3165921f918963032fdf081e9c190ca33f64a028 100644
--- a/packages/desktop-client/src/components/filters/NameFilter.tsx
+++ b/packages/desktop-client/src/components/filters/NameFilter.tsx
@@ -53,7 +53,7 @@ export function NameFilter({
id="name-field"
inputRef={inputRef}
defaultValue={name || ''}
- onUpdate={setName}
+ onChangeValue={setName}
/>
</FormField>
<Button
diff --git a/packages/desktop-client/src/components/manager/ConfigServer.tsx b/packages/desktop-client/src/components/manager/ConfigServer.tsx
index bdaa8586e7a08b21fd1d2beb9958983f6e55892c..742d477b840ca8106a5f0000afabea95b61ae65f 100644
--- a/packages/desktop-client/src/components/manager/ConfigServer.tsx
+++ b/packages/desktop-client/src/components/manager/ConfigServer.tsx
@@ -138,7 +138,7 @@ export function ConfigServer() {
autoFocus={true}
placeholder="https://example.com"
value={url || ''}
- onUpdate={setUrl}
+ onChangeValue={setUrl}
style={{ flex: 1, marginRight: 10 }}
/>
<ButtonWithLoading
diff --git a/packages/desktop-client/src/components/mobile/MobileAmountInput.jsx b/packages/desktop-client/src/components/mobile/MobileAmountInput.jsx
index b9840f7e6c6f11302214084c20c3738b9033d490..0bc83c5bff954acad614893a640e8d3310833076 100644
--- a/packages/desktop-client/src/components/mobile/MobileAmountInput.jsx
+++ b/packages/desktop-client/src/components/mobile/MobileAmountInput.jsx
@@ -163,10 +163,6 @@ export const FocusableAmountInput = memo(function FocusableAmountInput({
props.onUpdate?.(maybeApplyNegative(val, isNegative));
};
- const onChange = val => {
- props.onChange?.(maybeApplyNegative(val, isNegative));
- };
-
return (
<View>
<AmountInput
@@ -174,7 +170,6 @@ export const FocusableAmountInput = memo(function FocusableAmountInput({
value={value}
onFocus={onFocus}
onBlur={onBlur}
- onChange={onChange}
onUpdate={onUpdate}
focused={focused}
style={{
diff --git a/packages/desktop-client/src/components/mobile/MobileForms.jsx b/packages/desktop-client/src/components/mobile/MobileForms.jsx
index 2f1cff5c03c97a4cc37c47c046facf7340825138..e3f46e0b1d424593ff5f33b7127757b3db179e3f 100644
--- a/packages/desktop-client/src/components/mobile/MobileForms.jsx
+++ b/packages/desktop-client/src/components/mobile/MobileForms.jsx
@@ -47,9 +47,7 @@ export const InputField = forwardRef(function InputField(
autoCorrect="false"
autoCapitalize="none"
disabled={disabled}
- onBlur={e => {
- onUpdate?.(e.target.value);
- }}
+ onUpdate={onUpdate}
style={{
...valueStyle,
...style,
diff --git a/packages/desktop-client/src/components/modals/GoCardlessInitialise.tsx b/packages/desktop-client/src/components/modals/GoCardlessInitialise.tsx
index ad7059582c8063a54db872a4e5fb2816c0ab4ce9..a7b1ef7e84e863cfed38520cb0cb63fde27f230b 100644
--- a/packages/desktop-client/src/components/modals/GoCardlessInitialise.tsx
+++ b/packages/desktop-client/src/components/modals/GoCardlessInitialise.tsx
@@ -73,8 +73,10 @@ export const GoCardlessInitialise = ({
id="secret-id-field"
type="password"
value={secretId}
- onUpdate={setSecretId}
- onChange={() => setIsValid(true)}
+ onChangeValue={value => {
+ setSecretId(value);
+ setIsValid(true);
+ }}
/>
</FormField>
@@ -84,8 +86,10 @@ export const GoCardlessInitialise = ({
id="secret-key-field"
type="password"
value={secretKey}
- onUpdate={setSecretKey}
- onChange={() => setIsValid(true)}
+ onChangeValue={value => {
+ setSecretKey(value);
+ setIsValid(true);
+ }}
/>
</FormField>
diff --git a/packages/desktop-client/src/components/modals/ImportTransactions.jsx b/packages/desktop-client/src/components/modals/ImportTransactions.jsx
index 10e79776dd386a6eddc17cd7fd86623c99dc40ec..ef0fec382860cc69b4807cfed1380fc84ba2eec2 100644
--- a/packages/desktop-client/src/components/modals/ImportTransactions.jsx
+++ b/packages/desktop-client/src/components/modals/ImportTransactions.jsx
@@ -544,7 +544,7 @@ function MultiplierOption({
style={{ display: multiplierEnabled ? 'inherit' : 'none' }}
value={multiplierAmount}
placeholder="Multiplier"
- onUpdate={onChangeAmount}
+ onChangeValue={onChangeAmount}
/>
</View>
);
@@ -573,7 +573,7 @@ function InOutOption({
<Input
type="text"
value={outValue}
- onUpdate={onChangeText}
+ onChangeValue={onChangeText}
placeholder="Value for out rows, i.e. Credit"
/>
)}
diff --git a/packages/desktop-client/src/components/modals/SimpleFinInitialise.tsx b/packages/desktop-client/src/components/modals/SimpleFinInitialise.tsx
index 4db5bff8822bc9291ad3989384d479ef0d5c5eca..6398039b04dbed32f8843e321c21cacdcde59fd0 100644
--- a/packages/desktop-client/src/components/modals/SimpleFinInitialise.tsx
+++ b/packages/desktop-client/src/components/modals/SimpleFinInitialise.tsx
@@ -66,8 +66,10 @@ export const SimpleFinInitialise = ({
id="token-field"
type="password"
value={token}
- onUpdate={setToken}
- onChange={() => setIsValid(true)}
+ onChangeValue={value => {
+ setToken(value);
+ setIsValid(true);
+ }}
/>
</FormField>
diff --git a/packages/desktop-client/src/components/modals/SingleInput.tsx b/packages/desktop-client/src/components/modals/SingleInput.tsx
index d6a02c33e37088ea1586b3d78994727ae353696f..5906142a400d7a5f792e50fe603e2f62283b2ccb 100644
--- a/packages/desktop-client/src/components/modals/SingleInput.tsx
+++ b/packages/desktop-client/src/components/modals/SingleInput.tsx
@@ -56,7 +56,8 @@ export function SingleInput({
<Input
placeholder={inputPlaceholder}
style={{ ...styles.mediumText }}
- onUpdate={setValue}
+ value={value}
+ onChangeValue={setValue}
onEnter={e => _onSubmit(e.currentTarget.value)}
/>
</InitialFocus>
diff --git a/packages/desktop-client/src/components/reports/SaveReportName.tsx b/packages/desktop-client/src/components/reports/SaveReportName.tsx
index fb598092168666f59604d749827cd16c02b151e1..7357dd0295671027df783f78f2875a072d2ece2f 100644
--- a/packages/desktop-client/src/components/reports/SaveReportName.tsx
+++ b/packages/desktop-client/src/components/reports/SaveReportName.tsx
@@ -64,7 +64,7 @@ export function SaveReportName({
value={name}
id="name-field"
inputRef={inputRef}
- onUpdate={setName}
+ onChangeValue={setName}
style={{ marginTop: 10 }}
/>
</FormField>
diff --git a/packages/desktop-client/src/components/table.tsx b/packages/desktop-client/src/components/table.tsx
index 38cc9fc919fbb5207b7a4ec2c5c2657f11a9acd5..1259d086596fc05749ed92a67c7d9b92bdeb8bc7 100644
--- a/packages/desktop-client/src/components/table.tsx
+++ b/packages/desktop-client/src/components/table.tsx
@@ -319,7 +319,6 @@ function InputValue({
const [value, setValue] = useState(defaultValue);
function onBlur_(e) {
- onUpdate?.(value);
if (onBlur) {
fireBlur(onBlur, e);
}
@@ -345,8 +344,9 @@ function InputValue({
<Input
{...props}
value={value}
- onUpdate={text => setValue(text)}
+ onChangeValue={text => setValue(text)}
onBlur={onBlur_}
+ onUpdate={onUpdate}
onKeyDown={onKeyDown}
style={{
...inputCellStyle,
@@ -358,8 +358,8 @@ function InputValue({
}
type InputCellProps = ComponentProps<typeof Cell> & {
- inputProps: ComponentProps<typeof InputValue>;
- onUpdate: ComponentProps<typeof InputValue>['onUpdate'];
+ inputProps?: ComponentProps<typeof InputValue>;
+ onUpdate?: ComponentProps<typeof InputValue>['onUpdate'];
onBlur?: ComponentProps<typeof InputValue>['onBlur'];
textAlign?: CSSProperties['textAlign'];
error?: ReactNode;
diff --git a/packages/desktop-client/src/components/util/AmountInput.tsx b/packages/desktop-client/src/components/util/AmountInput.tsx
index fd110d6817fd418aa3367512532ccb1aafc41193..60269b440d8b9598ea52c9a54437fe04b8c9e515 100644
--- a/packages/desktop-client/src/components/util/AmountInput.tsx
+++ b/packages/desktop-client/src/components/util/AmountInput.tsx
@@ -23,7 +23,7 @@ type AmountInputProps = {
inputRef?: Ref<HTMLInputElement>;
value: number;
zeroSign?: '-' | '+';
- onChange?: (value: string) => void;
+ onChangeValue?: (value: string) => void;
onFocus?: FocusEventHandler<HTMLInputElement>;
onBlur?: FocusEventHandler<HTMLInputElement>;
onUpdate?: (amount: number) => void;
@@ -40,7 +40,7 @@ export function AmountInput({
zeroSign = '-', // + or -
onFocus,
onBlur,
- onChange,
+ onChangeValue,
onUpdate,
style,
textStyle,
@@ -77,7 +77,7 @@ export function AmountInput({
function onInputTextChange(val) {
setValue(val ? val : '');
- onChange?.(val);
+ onChangeValue?.(val);
}
function fireUpdate(negate) {
@@ -123,7 +123,7 @@ export function AmountInput({
fireUpdate(negative);
}
}}
- onUpdate={onInputTextChange}
+ onChangeValue={onInputTextChange}
onBlur={onInputAmountBlur}
onFocus={onFocus}
/>
diff --git a/upcoming-release-notes/2381.md b/upcoming-release-notes/2381.md
new file mode 100644
index 0000000000000000000000000000000000000000..0edbd9689dd2827445594e65af384cb09d262175
--- /dev/null
+++ b/upcoming-release-notes/2381.md
@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [joel-jeremy]
+---
+
+Update Input onChangeValue and onUpdate prop naming for consistency.