Merge branch 'master' into SIW-1742-auth-source

ts/features/bonus/cgn/components/detail/CgnOwnershipInformation.tsx

@@ -1,14 +1,14 @@
-import * as pot from "@pagopa/ts-commons/lib/pot";
-import * as React from "react";
 import {
   Divider,
   ListItemHeader,
   ListItemInfo
 } from "@pagopa/io-app-design-system";
+import * as pot from "@pagopa/ts-commons/lib/pot";
+import * as React from "react";
 import I18n from "../../../../../i18n";
-import { profileSelector } from "../../../../../store/reducers/profile";
 import { useIOSelector } from "../../../../../store/hooks";
-import { capitalize } from "../../../../../utils/strings";
+import { profileSelector } from "../../../../../store/reducers/profile";
+import { capitalizeTextName } from "../../../../../utils/strings";
 
 /**
  * Renders the CGN ownership block for detail screen, including Owner's Fiscal Code (The current user logged in)
@@ -23,12 +23,12 @@ const CgnOwnershipInformation = (): React.ReactElement => {
           <ListItemHeader label={I18n.t("bonus.cgn.detail.ownership")} />
           <ListItemInfo
             label="Nome"
-            value={capitalize(currentProfile.value.name)}
+            value={capitalizeTextName(currentProfile.value.name)}
           />
           <Divider />
           <ListItemInfo
             label="Cognome"
-            value={capitalize(currentProfile.value.family_name)}
+            value={capitalizeTextName(currentProfile.value.family_name)}
           />
           <Divider />
           <ListItemInfo

ts/features/bonus/cgn/screens/CgnDetailScreen.tsx

@@ -37,6 +37,7 @@ import { profileSelector } from "../../../../store/reducers/profile";
 import { GlobalState } from "../../../../store/reducers/types";
 import { formatDateAsShortFormat } from "../../../../utils/dates";
 import { useActionOnFocus } from "../../../../utils/hooks/useOnFocus";
+import { capitalizeTextName } from "../../../../utils/strings";
 import { openWebUrl } from "../../../../utils/url";
 import { availableBonusTypesSelectorFromId } from "../../common/store/selectors";
 import { ID_CGN_TYPE } from "../../common/utils";
@@ -65,7 +66,6 @@ import {
 import { cgnUnsubscribeSelector } from "../store/reducers/unsubscribe";
 import { EYCA_WEBSITE_DISCOUNTS_PAGE_URL } from "../utils/constants";
 import { canEycaCardBeShown } from "../utils/eyca";
-import { capitalize } from "../../../../utils/strings";
 
 type Props = ReturnType<typeof mapStateToProps> &
   ReturnType<typeof mapDispatchToProps>;
@@ -198,9 +198,9 @@ const CgnDetailScreen = (props: Props): React.ReactElement => {
           }}
         >
           {pot.isSome(currentProfile)
-            ? `${capitalize(currentProfile.value.name)} ${capitalize(
-                currentProfile.value.family_name
-              )}`
+            ? `${capitalizeTextName(
+                currentProfile.value.name
+              )} ${capitalizeTextName(currentProfile.value.family_name)}`
             : ""}
         </H4>
       }

ts/utils/__tests__/string.test.ts

@@ -4,7 +4,8 @@ import {
   capitalize,
   isStringNullyOrEmpty,
   maybeNotNullyString,
-  formatBytesWithUnit
+  formatBytesWithUnit,
+  capitalizeTextName
 } from "../strings";
 
 describe("capitalize", () => {
@@ -116,3 +117,29 @@ describe("formatBytesWithUnit", () => {
     expect(formatBytesWithUnit(-1234)).toEqual("0 B");
   });
 });
+
+describe("capitalizeTextName", () => {
+  it("should return a string where each word has the first char in uppercase", () => {
+    expect(capitalizeTextName("capitalize")).toEqual("Capitalize");
+  });
+
+  it("should return a string where each word has the first char in uppercase even after an apostrophe", () => {
+    expect(capitalizeTextName("Capit'Alize")).toEqual("Capit'Alize");
+  });
+
+  it("should return a string where each word has the first char in uppercase even after an apostrophe-2", () => {
+    expect(capitalizeTextName("capit'alize")).toEqual("Capit'Alize");
+  });
+
+  it("should return a string where each word has the first char in uppercase even after an apostrophe-3", () => {
+    expect(capitalizeTextName("Capit'alize")).toEqual("Capit'Alize");
+  });
+
+  it("should return a string where each word has the first char in uppercase even after an apostrophe-4", () => {
+    expect(capitalizeTextName("capit'Alize")).toEqual("Capit'Alize");
+  });
+
+  it("should return a string where each word has the first char in uppercase even after an apostrophe-5", () => {
+    expect(capitalizeTextName("CAPIT'ALIZE")).toEqual("Capit'Alize");
+  });
+});

ts/utils/strings.ts

@@ -182,3 +182,47 @@ export const formatBytesWithUnit = (bytes: number) => {
   const unit = units[Math.min(i, units.length - 1)];
   return `${value} ${unit}`;
 };
+
+/**
+ * Capitalizes the first letter of each word in the given text, preserving leading and trailing spaces.
+ * Words are separated by the specified separator.
+ * Handles words with apostrophes by capitalizing the first letter of each sub-token.
+ *
+ * @param {string} text
+ * @param {string} [separator=" "]
+ * @returns {string}
+ *
+ * @example
+ * capitalizeTextName(" hello world "); // returns " Hello World "
+ *
+ * @example
+ * capitalizeTextName("d'angelo"); //returns "D'Angelo"
+ */
+
+export const capitalizeTextName = (
+  text: string,
+  separator: string = " "
+): string => {
+  // Match leading and trailing spaces
+  const leadingSpacesMatch = /^\s*/.exec(text);
+  const trailingSpacesMatch = /\s*$/.exec(text);
+
+  const leadingSpaces = leadingSpacesMatch ? leadingSpacesMatch[0] : "";
+  const trailingSpaces = trailingSpacesMatch ? trailingSpacesMatch[0] : "";
+
+  // Capitalize the words between the separators
+  const capitalizedText = text
+    .trim() // Remove leading/trailing spaces for processing
+    .split(separator)
+    .map(token =>
+      // Handle words with apostrophes
+      token
+        .split("'")
+        .map(subToken => _.upperFirst(subToken.toLowerCase()))
+        .join("'")
+    )
+    .join(separator);
+
+  // Re-add the leading and trailing spaces
+  return `${leadingSpaces}${capitalizedText}${trailingSpaces}`;
+};