add toast for payments method save

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

@@ -18,7 +18,7 @@ export default function BankCardInput({ bankCardState, validateHandler, disabled
 	useEffect(() => {
 		if (bankCardState) {
 			if (disabled) {
-				setBankCard(format(bankCardState, {
+				setBankCard(format(bankCardState.slice(-4), {
 					mask: "**** **** **** ____",
 					replacement: { _: /\d/ }
 				}));

src/app/ui/referral-page/setting-referral-program.tsx

@@ -7,6 +7,7 @@ import BankCardInput from '@/app/ui/inputs/bank-card-inpit';
 import { addPayoutMethod, PayoutMethodFormState, getPayoutMethods, PayoutMethods } from '@/app/actions/referralsActions';
 import { bankCardFormSchema } from '@/app/actions/definitions';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { toast } from 'sonner';
 
 export default function SettingReferralProgram() {
 	const [state, formAction, isPending] = useActionState(
@@ -40,7 +41,11 @@ export default function SettingReferralProgram() {
 
 	useEffect(() => {
 		setFormState(state);
-		queryClient.invalidateQueries({ queryKey: ['payoutMethods'] });
+		if (state?.success) {
+			toast.success('success');
+			queryClient.invalidateQueries({ queryKey: ['payoutMethods'] });
+		}
+
 	}, [state]);
 
 	useEffect(() => {