add PayoutMethod, getReferralPayments,

add translates

src/app/ui/inputs/bank-card-inpit.tsx

@@ -0,0 +1,32 @@
+'use client'
+
+import { useState, ChangeEvent, useEffect } from 'react';
+import { InputMask } from '@react-input/mask';
+import styles from '@/app/styles/module/login.module.scss';
+
+interface BankCardProps {
+	bankCardState: string | undefined;
+	validateHandler: (e: ChangeEvent<HTMLInputElement>) => void;
+	clearCondition?: string | undefined | null
+}
+
+export default function BankCardInput({ bankCardState, validateHandler }: BankCardProps) {
+	const [bankCard, setBankCard] = useState<string | undefined>(bankCardState ? bankCardState : '');
+
+	return (
+		<InputMask
+			type="phone"
+			id="bankCard"
+			name="bankCard"
+			className={`${styles['form-input']}`}
+			mask="____ ____ ____ ____"
+			replacement={{ _: /\d/ }}
+			value={bankCard}
+			onChange={(e) => {
+				setBankCard(e.target.value);
+				validateHandler(e);
+			}}
+			placeholder="1234 1234 1234 1234"
+		/>
+	)
+}