diff --git a/framer/Donation_Form.tsx b/framer/Donation_Form.tsx
index 88868dd..1f877be 100644
--- a/framer/Donation_Form.tsx
+++ b/framer/Donation_Form.tsx
@@ -50,7 +50,9 @@ const setField = (Component: any, field: string): ComponentType => {
const onTap = () => {
const element = document.querySelector(`.${props.className}`);
const value = element != null ? element.textContent : "";
- setStore({ [field]: value });
+ setStore({
+ [field]: field === "amount" ? parseFormatAmount(value) : value,
+ });
};
return ;
@@ -186,15 +188,14 @@ export const inputAmount = (Component: any): ComponentType => {
return (props: any) => {
const [store, setStore] = useStore();
- const onValueChange = (amount: string) =>
- setStore({ amount: toAmount(amount) });
+ const onValueChange = (amount: string) => setStore({ amount });
const frequency = parseFrequency(store.frequency);
return (
@@ -202,12 +203,27 @@ export const inputAmount = (Component: any): ComponentType => {
};
};
+export const showDonateAmount = (Component: any): ComponentType => {
+ return (props) => {
+ const [store] = useStore();
+ const amount = parseFormatAmount(store.amount);
+ const frequency = parseFrequency(store.frequency);
+ const currency =
+ frequency === "match"
+ ? (store.fundraiserMatchCurrency ?? "kr.")
+ : frequency === "monthly"
+ ? "kr. pr. md."
+ : "kr.";
+ return ;
+ };
+};
+
export const showCurrency = (Component: any): ComponentType => {
return (props) => {
const [store] = useStore();
const frequency = parseFrequency(store.frequency);
const currency =
- frequency === "match" ? (store.fundraiserMatchCurrency ?? "kr") : "kr";
+ frequency === "match" ? (store.fundraiserMatchCurrency ?? "kr.") : "kr.";
return ;
};
};
@@ -341,7 +357,8 @@ export const withRecipientVaccinerTilSpædbørn = (
export const showAmount = (Component: any): ComponentType => {
return (props) => {
const [store] = useStore();
- return ;
+ const amount = parseFormatAmount(store.amount);
+ return ;
};
};
@@ -374,7 +391,8 @@ const withVariant = (Component: any, getVariant: any): ComponentType => {
export const withVariantAmount = (Component: any): ComponentType => {
return withVariant(Component, (store: any, setStore: any) => {
const frequency = parseFrequency(store.frequency);
- return [`${frequency}/${store.amount}`, `${frequency}/None`];
+ const amount = parseFormatAmount(store.amount);
+ return [`${frequency}/${amount} kr`, `${frequency}/None`];
});
};
diff --git a/framer/Wealth_Calculator.tsx b/framer/Wealth_Calculator.tsx
index c053a8e..a70dbc5 100644
--- a/framer/Wealth_Calculator.tsx
+++ b/framer/Wealth_Calculator.tsx
@@ -41,12 +41,7 @@ const setIncomeInput = (Component, adultNo: number): ComponentType => {
const [store, setStore] = useStore();
const field = `income${adultNo}`;
- const onValueChange = (value: string) => {
- const newNumber = Number.parseFloat(value);
- if (value === "" || !Number.isNaN(newNumber)) {
- setStore({ [field]: value });
- }
- };
+ const onValueChange = (value: string) => setStore({ [field]: value });
return (
{
return calculateTotalPostTaxIncome(store) * (store.donationPct / 100);
};
-const calculatePostTax = (income: number): number => {
+const calculatePostTax = (amount: string): number => {
+ const income = parseAmount(amount);
const amBidrag = income * AM_BIDRAG_PCT;
const taxable = Math.max(0, income - amBidrag - PERSONFRADRAG);
const bundSkat = taxable * BUNDSKAT_PCT;
@@ -399,6 +395,9 @@ export const showDebug = (Component): ComponentType => {
text={`${JSON.stringify(
{
...store,
+ income1: parseAmount(store.income1),
+ income2: parseAmount(store.income2),
+ income3: parseAmount(store.income3),
householdPostTaxIncome: roundNumber(
calculateTotalPostTaxIncome(store),
),
diff --git a/framer/helpers-donation.ts b/framer/helpers-donation.ts
index bafae83..6c21eab 100644
--- a/framer/helpers-donation.ts
+++ b/framer/helpers-donation.ts
@@ -1,7 +1,10 @@
const canSubmitStep1 = (store: any): boolean => {
+ const amount = parseAmount(store.amount);
+ const frequency = parseFrequency(store.frequency);
return (
- store.frequency !== "" &&
- store.amount !== "" &&
+ frequency !== "" &&
+ amount !== "" &&
+ (frequency === "match" ? amount > 0 : amount >= 1) &&
isCprCvrValid(store.taxDeductible, store.tin)
);
};
@@ -58,25 +61,8 @@ const isCprPlausible = (tin: string): boolean => {
return sum % 11 === 0;
};
-const toAmount = (value: string): string => {
- const parsed = /^[\d\.]+$/.test(value)
- ? parseInputAmount(value)
- : parseAmount(value);
- return parsed === "" ? "" : `${parsed.toLocaleString("da-DK")} kr`;
-};
-
-const parseInputAmount = (value: string): number | "" => {
- return value === "" ? "" : Number.parseFloat(value);
-};
-
-const parseAmount = (value: string): number | "" => {
- return value === ""
- ? ""
- : Number.parseFloat(value.replace(/\./g, "").replace(/,/g, "."));
-};
-
const parseRecipient = (value: string): string => {
- let index = value ? value.indexOf("(") : -1;
+ const index = value ? value.indexOf("(") : -1;
return index > -1 ? value.slice(0, index).trim() : value;
};
@@ -127,12 +113,17 @@ const prepareDonationPayload = (store: any) => {
};
};
+type DonationResponse = {
+ redirect?: string;
+ bank?: { account: string; message: string };
+};
+
const submitDonation = async (store: any, setStore: any) => {
try {
setStore({ isLoading: true });
track("Donation form step 2 submitted", parseAmount(store.amount));
- const response = await submitForm(
+ const response: DonationResponse = await submitForm(
store.env,
"donation",
prepareDonationPayload(store),
diff --git a/framer/helpers.ts b/framer/helpers.ts
index 52531d1..19af125 100644
--- a/framer/helpers.ts
+++ b/framer/helpers.ts
@@ -17,18 +17,23 @@ const track = (event: string, amount?: number | "") => {
}
};
-// Server communication
+// Danish amount inputs
+
+const parseAmount = (value: string): number | "" => {
+ const amount =
+ value === ""
+ ? ""
+ : Number.parseFloat(value.replace(/\./g, "").replace(/,/g, "."));
+ return Number.isNaN(amount) ? "" : amount;
+};
-type DonationResponse = {
- redirect?: string;
- bank?: { account: string; message: string };
+const parseFormatAmount = (value: string): string => {
+ return parseAmount(value).toLocaleString("da-DK");
};
-const submitForm = async (
- env: string,
- path: string,
- payload: any,
-): Promise => {
+// Server communication
+
+const submitForm = async (env: string, path: string, payload: any) => {
const response = await fetch(apiUrl(env, path), {
method: "POST",
headers: { "Content-type": "application/json;charset=UTF-8" },
diff --git a/framer/justfile b/framer/justfile
index d6beffd..9f4a874 100644
--- a/framer/justfile
+++ b/framer/justfile
@@ -23,4 +23,4 @@ stats:
@cat Stats.tsx helpers.ts
wealth-calculator:
- @cat Wealth_Calculator.tsx
+ @cat Wealth_Calculator.tsx helpers.ts