From 242c0524cd1074b51f668480c66d9044814f7c2e Mon Sep 17 00:00:00 2001 From: ikusteu Date: Tue, 11 Jul 2023 16:25:38 +0200 Subject: [PATCH] Small fix: Make the surname particles case insensitive when checking whether or not to shorten the word --- .../client/src/pages/self_register/index.tsx | 3 +- .../e2e/integration/athlete_self_register.ts | 35 +++++++++++++++++++ packages/translations/src/dict/en.json | 3 +- packages/translations/src/dict/it.json | 3 +- packages/translations/src/translations.ts | 1 + .../ui/src/Forms/CustomerForm/FormSelfReg.tsx | 10 ++++-- .../ui/src/utils/__tests__/helpers.test.ts | 16 +++++---- packages/ui/src/utils/helpers.ts | 2 +- 8 files changed, 61 insertions(+), 12 deletions(-) diff --git a/packages/client/src/pages/self_register/index.tsx b/packages/client/src/pages/self_register/index.tsx index e3bb44631..12f4ec313 100644 --- a/packages/client/src/pages/self_register/index.tsx +++ b/packages/client/src/pages/self_register/index.tsx @@ -54,7 +54,7 @@ const SelfRegisterPage: React.FC = () => { // to more correctly control the 'isSubmitting' state const submitForm: Parameters< typeof CustomerForm.SelfReg - >[0]["onSave"] = async (values, { setErrors }) => { + >[0]["onSave"] = async (values, { setErrors, setSubmitting }) => { const { secretKey, codeOk } = await customerSelfRegister(values)( dispatch, getState, @@ -68,6 +68,7 @@ const SelfRegisterPage: React.FC = () => { setErrors({ registrationCode: t(ValidationMessage.InvalidRegistrationCode), }); + setSubmitting(false); } if (secretKey) { diff --git a/packages/e2e/integration/athlete_self_register.ts b/packages/e2e/integration/athlete_self_register.ts index 2c5c39fac..e6468a4e1 100644 --- a/packages/e2e/integration/athlete_self_register.ts +++ b/packages/e2e/integration/athlete_self_register.ts @@ -91,4 +91,39 @@ describe("Athlete self registration", () => { t(Alerts.ContactEmail, { email: __emailFrom__ }).replace(/<\/?a.*>/g, "") ); }); + + it("checks for a spinner on the submit button while the submit request is processing", () => { + cy.getAttrWith("aria-label", t(AuthTitle.SignInWithEmail)).click(); + + const randomString = uuid().slice(0, 10); + const newEmail = `${randomString}@email.com`; + + cy.getAttrWith("type", "email").type(newEmail); + cy.clickButton(t(ActionButton.Next)); + cy.contains(t(AuthTitle.CreateAccount)); + + cy.getAttrWith("type", "password").type("non-relevant-password"); + cy.clickButton(t(ActionButton.Save)); + + cy.intercept( + { + method: "POST", + url: "**/customerSelfRegister", + }, + (req) => { + req.on("response", (res) => { + console.log("waiting"); + res.setDelay(3000); + }); + } + ); + + cy.getAttrWith("name", "name").type(saul.name); + cy.getAttrWith("name", "surname").type(saul.surname); + cy.getAttrWith("name", "birthday").type(saul.birthday); + + cy.getAttrWith("name", "registrationCode").type(__registrationCode__); + cy.clickButton(t(ActionButton.Save)); + cy.contains(t(ActionButton.Loading)); + }); }); diff --git a/packages/translations/src/dict/en.json b/packages/translations/src/dict/en.json index d41b62dd4..bd824a6b9 100644 --- a/packages/translations/src/dict/en.json +++ b/packages/translations/src/dict/en.json @@ -230,7 +230,8 @@ "Verify": "Verify", "Add": "Add", "Edit": "Edit", - "Delete": "Delete" + "Delete": "Delete", + "Loading": "Loading" }, "Notification": { diff --git a/packages/translations/src/dict/it.json b/packages/translations/src/dict/it.json index 0b5dac844..32688be3c 100644 --- a/packages/translations/src/dict/it.json +++ b/packages/translations/src/dict/it.json @@ -230,7 +230,8 @@ "Verify": "Verifica", "Edit": "Modifica", "Add": "Aggiungi", - "Delete": "Elimina" + "Delete": "Elimina", + "Loading": "Caricamento" }, "Notification": { diff --git a/packages/translations/src/translations.ts b/packages/translations/src/translations.ts index b64891f99..3eaf85515 100644 --- a/packages/translations/src/translations.ts +++ b/packages/translations/src/translations.ts @@ -245,6 +245,7 @@ export enum ActionButton { Add = "ActionButton.Add", Edit = "ActionButton.Edit", Delete = "ActionButton.Delete", + Loading = "ActionButton.Loading", } // #endregion dialog diff --git a/packages/ui/src/Forms/CustomerForm/FormSelfReg.tsx b/packages/ui/src/Forms/CustomerForm/FormSelfReg.tsx index 18098e968..c5b7ab4c4 100644 --- a/packages/ui/src/Forms/CustomerForm/FormSelfReg.tsx +++ b/packages/ui/src/Forms/CustomerForm/FormSelfReg.tsx @@ -62,7 +62,6 @@ const FormSelfReg: React.FC = ({ initialValues={initialValues} onSubmit={(values, formikHelpers) => { onSave(values, formikHelpers); - formikHelpers.setSubmitting(false); }} > {({ isSubmitting, resetForm }) => ( @@ -92,7 +91,14 @@ const FormSelfReg: React.FC = ({ color={FormButtonColor.Green} disabled={isSubmitting} > - {t(ActionButton.Save)} + {isSubmitting ? ( + <> +
+ {t(ActionButton.Loading)} + + ) : ( + t(ActionButton.Save) + )}
diff --git a/packages/ui/src/utils/__tests__/helpers.test.ts b/packages/ui/src/utils/__tests__/helpers.test.ts index 7a9fb1087..2cf696df3 100644 --- a/packages/ui/src/utils/__tests__/helpers.test.ts +++ b/packages/ui/src/utils/__tests__/helpers.test.ts @@ -40,34 +40,38 @@ describe("Test helpers", () => { test("should not shorten if there's only one name and one surname", () => { const name = "John"; const surname = "Doe"; - expect(shortName(name, surname)).toBe(["John", "Doe"]); + expect(shortName(name, surname)).toEqual(["John", "Doe"]); }); test("should shorten the name and surname and return a string containing full first name and last name with all other names shortened", () => { const name = "John Ronald Reuel"; const surname = "Tolkien"; - expect(shortName(name, surname)).toBe(["John R. R.", "Tolkien"]); + expect(shortName(name, surname)).toEqual(["John R. R.", "Tolkien"]); const name2 = "Thomas"; const surname2 = "Tailor Thomas"; - expect(shortName(name2, surname2)).toBe(["Thomas", "T. Thomas"]); + expect(shortName(name2, surname2)).toEqual(["Thomas", "T. Thomas"]); }); test("should leave the surname particles (common in a lot of languages) intact", () => { const name = "John"; const surname = "de la Cruz"; - expect(shortName(name, surname)).toBe(["John", "de la Cruz"]); + expect(shortName(name, surname)).toEqual(["John", "de la Cruz"]); const name2 = "Ludwig"; const surname2 = "van Beethoven"; - expect(shortName(name2, surname2)).toBe(["Ludwig", "van Beethoven"]); + expect(shortName(name2, surname2)).toEqual(["Ludwig", "van Beethoven"]); + + const name3 = "Robert"; + const surname3 = "De Niro"; + expect(shortName(name3, surname3)).toEqual(["Robert", "De Niro"]); }); test("should shorten the last names even if there prepended with a particle", () => { const name = "Pablo Diego José Francisco"; const surname = "de Paula Juan Nepomuceno María de los Remedios Cipriano de la Santísima Trinidad Ruiz y Picasso"; - expect(shortName(name, surname)).toBe([ + expect(shortName(name, surname)).toEqual([ "Pablo D. J. F.", "de P. J. N. M. de los R. C. de la S. T. R. y Picasso", ]); diff --git a/packages/ui/src/utils/helpers.ts b/packages/ui/src/utils/helpers.ts index ba3cfc799..4484488b6 100644 --- a/packages/ui/src/utils/helpers.ts +++ b/packages/ui/src/utils/helpers.ts @@ -46,7 +46,7 @@ export const shortName = (name: string, surname: string) => { .map((word, i, o) => i === o.length - 1 ? word - : surnameParticles.includes(word) + : surnameParticles.includes(word.toLowerCase()) ? word : `${word[0]}.` )