From 18c16b3040b35c474908c9aab1a4c53e5a297b61 Mon Sep 17 00:00:00 2001 From: Thomas Heartman Date: Thu, 10 Mar 2022 10:07:28 +0100 Subject: [PATCH] fix: make sure customer type is included in the payload. Because it previously set it via a reducer and submitted the form in the same step, the customer type wouldn't be set correctly before the form was submitted, causing it to show up as "undefined". We're doing double the work now, but I think that's an acceptable trade-off for now. --- website/src/components/UserFeedback/index.tsx | 21 ++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/website/src/components/UserFeedback/index.tsx b/website/src/components/UserFeedback/index.tsx index 43309ef1385..cdb86f2ec70 100644 --- a/website/src/components/UserFeedback/index.tsx +++ b/website/src/components/UserFeedback/index.tsx @@ -7,6 +7,12 @@ const join = (...cs: string[]) => cs.join(' '); type CustomerType = 'open source' | 'paying'; +type FormData = { + score: number; + comment: undefined | string; + customerType: undefined | CustomerType; +}; + type InitialData = { currentStep: number; data: { @@ -173,13 +179,13 @@ export const FeedbackWrapper: React.FC = ({ seedData, open }) => { const setCustomerType = (customerType: CustomerType) => dispatch({ kind: 'set customer type', data: customerType }); - const submitFeedback = () => { + const submitFeedback = (data: FormData) => { if (feedbackTargetUrl) { fetch(feedbackTargetUrl, { method: 'post', body: JSON.stringify({ data: { - ...state.data, + ...data, openedManually: manuallyOpened, currentPage: location.pathname, }, @@ -380,7 +386,16 @@ export const FeedbackWrapper: React.FC = ({ seedData, open }) => { onSubmit={(e) => { e.preventDefault(); setCustomerType(value); - submitFeedback(); + + // To ensure that we get the correct customer type included. + // We can't rely on the reducer to set it because it won't + // happen until the component re-renders, causing customer + // type to have an old or empty value. + const finalState = stateReducer(state, { + kind: 'set customer type', + data: value, + }); + submitFeedback(finalState.data); }} >