From 30f03e8079b84c57c995c604068dae753d284263 Mon Sep 17 00:00:00 2001
From: Julian Dominguez-Schatz <julian.dominguezschatz@gmail.com>
Date: Sun, 4 Feb 2024 11:50:36 -0500
Subject: [PATCH] Save name fields on unfocus (#2327)
---
.../src/components/accounts/Header.jsx | 3 ++-
.../src/components/common/Input.tsx | 6 +++++
.../components/sidebar/SidebarWithData.tsx | 25 +++++++++++--------
upcoming-release-notes/2327.md | 6 +++++
4 files changed, 28 insertions(+), 12 deletions(-)
create mode 100644 upcoming-release-notes/2327.md
diff --git a/packages/desktop-client/src/components/accounts/Header.jsx b/packages/desktop-client/src/components/accounts/Header.jsx
index 3c4f79a78..4e181a514 100644
--- a/packages/desktop-client/src/components/accounts/Header.jsx
+++ b/packages/desktop-client/src/components/accounts/Header.jsx
@@ -126,7 +126,8 @@ export function AccountHeader({
<Input
defaultValue={accountName}
onEnter={e => onSaveName(e.target.value)}
- onBlur={() => onExposeName(false)}
+ onBlur={e => onSaveName(e.target.value)}
+ onEscape={() => onExposeName(false)}
style={{
fontSize: 25,
fontWeight: 500,
diff --git a/packages/desktop-client/src/components/common/Input.tsx b/packages/desktop-client/src/components/common/Input.tsx
index 342c1e75c..390473a40 100644
--- a/packages/desktop-client/src/components/common/Input.tsx
+++ b/packages/desktop-client/src/components/common/Input.tsx
@@ -26,6 +26,7 @@ export type InputProps = InputHTMLAttributes<HTMLInputElement> & {
style?: CSSProperties;
inputRef?: Ref<HTMLInputElement>;
onEnter?: (event: KeyboardEvent<HTMLInputElement>) => void;
+ onEscape?: (event: KeyboardEvent<HTMLInputElement>) => void;
onUpdate?: (newValue: string) => void;
focused?: boolean;
};
@@ -34,6 +35,7 @@ export function Input({
style,
inputRef,
onEnter,
+ onEscape,
onUpdate,
focused,
...nativeProps
@@ -65,6 +67,10 @@ export function Input({
onEnter(e);
}
+ if (e.key === 'Escape' && onEscape) {
+ onEscape(e);
+ }
+
nativeProps.onKeyDown?.(e);
}}
onChange={e => {
diff --git a/packages/desktop-client/src/components/sidebar/SidebarWithData.tsx b/packages/desktop-client/src/components/sidebar/SidebarWithData.tsx
index 32668b248..af8010f64 100644
--- a/packages/desktop-client/src/components/sidebar/SidebarWithData.tsx
+++ b/packages/desktop-client/src/components/sidebar/SidebarWithData.tsx
@@ -59,6 +59,17 @@ function EditableBudgetName({ prefs, savePrefs }: EditableBudgetNameProps) {
{ name: 'close', text: 'Close file' },
];
+ const onSaveChanges = async e => {
+ const inputEl = e.target;
+ const newBudgetName = inputEl.value;
+ if (newBudgetName.trim() !== '') {
+ await savePrefs({
+ budgetName: inputEl.value,
+ });
+ setEditing(false);
+ }
+ };
+
if (editing) {
return (
<InitialFocus>
@@ -69,17 +80,9 @@ function EditableBudgetName({ prefs, savePrefs }: EditableBudgetNameProps) {
fontWeight: 500,
}}
defaultValue={prefs.budgetName}
- onEnter={async e => {
- const inputEl = e.target as HTMLInputElement;
- const newBudgetName = inputEl.value;
- if (newBudgetName.trim() !== '') {
- await savePrefs({
- budgetName: inputEl.value,
- });
- setEditing(false);
- }
- }}
- onBlur={() => setEditing(false)}
+ onEnter={onSaveChanges}
+ onBlur={onSaveChanges}
+ onEscape={() => setEditing(false)}
/>
</InitialFocus>
);
diff --git a/upcoming-release-notes/2327.md b/upcoming-release-notes/2327.md
new file mode 100644
index 000000000..5d1de94fc
--- /dev/null
+++ b/upcoming-release-notes/2327.md
@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [jfdoming]
+---
+
+Save budget/account name fields on blur
--
GitLab