Customise mandate language

swan-io · Feb 13, 2024 · 78e6d72 · 78e6d72
1 parent 6eac0a6
commit 78e6d72
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/clients/payment/package.json b/clients/payment/package.json
@@ -21,6 +21,7 @@
  "@swan-io/shared-business": "4.9.0",
  "core-js": "3.35.1",
  "dayjs": "1.11.10",
+ "iban": "0.0.14",
  "nanoid": "5.0.5",
  "react": "18.2.0",
  "react-dom": "18.2.0",
@@ -31,6 +32,7 @@
  "wonka": "6.3.4"
  },
  "devDependencies": {
+ "@types/iban": "0.0.35",
  "@types/react": "18.2.55",
  "@types/react-dom": "18.2.19",
  "@types/react-native": "0.72.8",

diff --git a/clients/payment/src/pages/PaymentPage.tsx b/clients/payment/src/pages/PaymentPage.tsx
@@ -20,6 +20,7 @@ import {
  validateIban,
  validateRequired,
 } from "@swan-io/shared-business/src/utils/validation";
+import { electronicFormat } from "iban";
 import { StyleSheet } from "react-native";
 import { combineValidators, hasDefinedKeys, useForm } from "react-ux-form";
 import { P, match } from "ts-pattern";
@@ -29,8 +30,9 @@ import {
  AddSepaDirectDebitPaymentMandateFromPaymentLinkDocument,
  GetMerchantPaymentLinkQuery,
  InitiateSddPaymentCollectionDocument,
+ Language,
 } from "../graphql/unauthenticated";
-import { t } from "../utils/i18n";
+import { locale, t } from "../utils/i18n";
 
 const styles = StyleSheet.create({
  segmentedControlDesktop: {
@@ -150,7 +152,7 @@ export const PaymentPage = ({ paymentLink, setMandateUrl, nonEeaCountries }: Pro
  input: {
  paymentLinkId: paymentLink.id,
  debtor: {
- iban,
+ iban: electronicFormat(iban),
  name,
  address: {
  addressLine1,
@@ -159,6 +161,7 @@ export const PaymentPage = ({ paymentLink, setMandateUrl, nonEeaCountries }: Pro
  postalCode,
  },
  },
+ language: locale.language as Language,
  },
  })
  .mapOk(data => data.addSepaDirectDebitPaymentMandateFromPaymentLink)