feat(frontend): add details for parents, sin and contact information …

…on review page (#314)

* add details for parents, sin and contact information on review page

* refactor(frontend): cleanup of `string-utils.ts`

* refactor(frontend): cleanup of `string-utils.ts`

* removed empty string check from other names on personnal detail

---------

Co-authored-by: Greg Baker <gregory.j.baker@hrsdc-rhdcc.gc.ca>

frontend/app/.server/locales/protected-en.json

@@ -349,7 +349,10 @@
     "edit-secondary-identity-document": "Edit secondary identity document",
     "edit-current-name": "Edit current name",
     "edit-personal-details": "Edit personal details",
-    "edit-birth-details": "Edit birth details"
+    "edit-birth-details": "Edit birth details",
+    "edit-parent-details": "Edit parent details",
+    "edit-previous-sin": "Edit previous sin",
+    "edit-contact-information": "Edit contact information"
   },
   "search-sin": {
     "page-title": "Search for a SIN",

frontend/app/.server/locales/protected-fr.json

@@ -350,7 +350,10 @@
     "edit-secondary-identity-document": "Modifier le document d'identité secondaire",
     "edit-current-name": "Modifier le nom actuel",
     "edit-personal-details": "Modifier les détails personnels",
-    "edit-birth-details": "Modifier les détails de naissance"
+    "edit-birth-details": "Modifier les détails de naissance",
+    "edit-parent-details": "Modifier les détails des parents",
+    "edit-previous-sin": "Modifier les NAS précédent",
+    "edit-contact-information": "Modifier les informations de contact"
   },
   "search-sin": {
     "page-title": "Search for a SIN",

frontend/app/components/address.tsx

@@ -0,0 +1,32 @@
+import type { ComponentProps, JSX } from 'react';
+
+import { formatAddress } from '~/utils/string-utils';
+import { cn } from '~/utils/tailwind-utils';
+
+type Address = {
+  addressLine1?: string;
+  addressLine2?: string;
+  city?: string;
+  postalZipCode?: string;
+  provinceState?: string;
+  country: string;
+};
+
+type AddressProps = ComponentProps<'address'> & {
+  address: Address;
+  /**
+   * The format of the address
+   *
+   * - `standard`: The standard address format, with the address line, city, province/state, postal/zip code, and country.
+   * - `alternative`: An alternative address format, with the address line, city, province/state, postal/zip code, and country on separate lines.
+   */
+  format?: 'standard' | 'alternative';
+};
+
+export function Address({ address, format, className, ...rest }: AddressProps): JSX.Element {
+  return (
+    <address className={cn('whitespace-pre-wrap not-italic', className)} data-testid="address-id" {...rest}>
+      {formatAddress(address, format)}
+    </address>
+  );
+}