From 4f843a3419a9547b1f0ff5a3c93b4d23ce7430fc Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Sat, 8 Jun 2024 10:20:34 +0800
Subject: [PATCH] save the trimmed value to draft on submit

---
 .../Subscription/SubscriptionSize/substeps/Size.tsx    | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/pages/settings/Subscription/SubscriptionSize/substeps/Size.tsx b/src/pages/settings/Subscription/SubscriptionSize/substeps/Size.tsx
index 75e0add6dd5e..71a0a6b611ff 100644
--- a/src/pages/settings/Subscription/SubscriptionSize/substeps/Size.tsx
+++ b/src/pages/settings/Subscription/SubscriptionSize/substeps/Size.tsx
@@ -5,6 +5,7 @@ import InputWrapper from '@components/Form/InputWrapper';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
+import useStepFormSubmit from '@hooks/useStepFormSubmit';
 import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {validate} from '@pages/settings/Subscription/SubscriptionSize/utils';
@@ -18,6 +19,13 @@ function Size({onNext}: SizeProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
+    const handleSubmit = useStepFormSubmit<typeof ONYXKEYS.FORMS.SUBSCRIPTION_SIZE_FORM>({
+        formId: ONYXKEYS.FORMS.SUBSCRIPTION_SIZE_FORM,
+        fieldIds: [INPUT_IDS.SUBSCRIPTION_SIZE],
+        onNext,
+        shouldSaveDraft: true,
+    });
+
     const defaultValues = {
         // TODO this is temporary and default value will be replaced in next phase once data in ONYX is ready
         [INPUT_IDS.SUBSCRIPTION_SIZE]: '0',
@@ -27,7 +35,7 @@ function Size({onNext}: SizeProps) {
         <FormProvider
             formID={ONYXKEYS.FORMS.SUBSCRIPTION_SIZE_FORM}
             submitButtonText={translate('common.next')}
-            onSubmit={onNext}
+            onSubmit={handleSubmit}
             validate={validate}
             style={[styles.mh5, styles.flexGrow1]}
         >