valitydev/checkout
14
0
Fork 0
mirror of https://github.com/valitydev/checkout.git synced 2024-11-06 02:25:18 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

EMP-78: Use qrcode.react; Add leave alert (#359)

Browse Source
This commit is contained in:
Ildar Galeev 2024-10-31 19:23:38 +07:00 committed by GitHub
parent 9f8a7e6431
commit 088f181c6e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
20 changed files with 140 additions and 440 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
package-lock.json generated
View File

@ -23,8 +23,8 @@
"framer-motion": "10.12.18",
"ismobilejs": "1.1.1",
"js-base64": "3.7.7",
"kjua": "0.9.0",
"libphonenumber-js": "1.10.37",
"qrcode.react": "4.1.0",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-error-boundary": "4.0.11",
@ -7174,10 +7174,6 @@
"node": ">=4.0"
}
},
"node_modules/kjua": {
"version": "0.9.0",
"license": "MIT"
},
"node_modules/kleur": {
"version": "3.0.3",
"dev": true,
@ -7956,6 +7952,14 @@
],
"license": "MIT"
},
"node_modules/qrcode.react": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/qrcode.react/-/qrcode.react-4.1.0.tgz",
"integrity": "sha512-uqXVIIVD/IPgWLYxbOczCNAQw80XCM/LulYDADF+g2xDsPj5OoRwSWtIS4jGyp295wyjKstfG1qIv/I2/rNWpQ==",
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/querystringify": {
"version": "2.2.0",
"dev": true,

2
package.json
View File

@ -30,8 +30,8 @@
"framer-motion": "10.12.18",
"ismobilejs": "1.1.1",
"js-base64": "3.7.7",
"kjua": "0.9.0",
"libphonenumber-js": "1.10.37",
"qrcode.react": "4.1.0",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-error-boundary": "4.0.11",

4
src/assets/locale/ar.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "التالي",
"form.p2p.destinations.heading": "الدفع",
"form.p2p.copied": "تم النسخ!",
"leave.alert.header": "هل أنت متأكد؟",
"leave.alert.body": "لم تكتمل عملية الدفع بعد.",
"leave.alert.footer.button.no": "لا",
"leave.alert.footer.button.yes": "نعم",
"InvalidPaymentTool": "أداة دفع غير صالحة",
"AccountLimitsExceeded": "تجاوز الحد الأقصى للحساب",
"InsufficientFunds": "الأموال غير كافية",

4
src/assets/locale/az.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "Növbəti",
"form.p2p.destinations.heading": "Ödəniş",
"form.p2p.copied": "Kopyalandı!",
"leave.alert.header": "Əminsiniz?",
"leave.alert.body": "Ödənişiniz hələ tamamlanmayıb.",
"leave.alert.footer.button.no": "Xeyr",
"leave.alert.footer.button.yes": "Bəli",
"InvalidPaymentTool": "Yanlış ödəniş aləti",
"AccountLimitsExceeded": "Hesab limiti aşıldı",
"InsufficientFunds": "Kifayət qədər vəsait yoxdur",

104
src/assets/locale/bn.json
View File

@ -1,104 +0,0 @@
{
"info.back": "পিছনে",
"info.details": "বিস্তারিত",
"info.modal.no.available.payment.method": "কোনো পেমেন্ট পদ্ধতি উপলব্ধ নেই",
"form.header.payment.methods.label": "দয়া করে একটি পেমেন্ট পদ্ধতি চয়ন করুন",
"form.header.netbanking.label": "একটি ব্যাংক চয়ন করুন",
"form.header.pay.card.label": "কার্ড দিয়ে পরিশোধ করুন",
"form.header.final.success.label": "সফল পেমেন্ট",
"form.header.final.invoice.paid.label": "সফল",
"form.header.final.invoice.paid.already.label": "ইতিমধ্যে সম্পূর্ণরূপে পরিশোধিত",
"form.header.final.invoice.cancelled.label": "চালান বাতিল করা হয়েছে",
"form.header.final.invoice.fulfilled.label": "চালান পরিশোধিত হয়েছে",
"form.header.final.error.label": "ত্রুটি",
"form.header.final.started.label": "মুলতুবি",
"form.header.final.failed.label": "পরিশোধ হয়নি",
"form.header.final.refunded.label": "ফেরত দেওয়া হয়েছে",
"form.header.final.pending.label": "মুলতুবি",
"form.header.final.pending.description": "",
"form.header.final.cancelled.label": "বাতিল করা হয়েছে",
"form.final.failed.cancelled.text": "পেমেন্ট বাতিল করা হয়েছে",
"form.final.started.pay.text": "পেমেন্ট মুলতুবি আছে",
"form.final.need.help": "সমস্যা সমাধানে কীভাবে সাহায্য করা যায়?",
"form.input.phone.placeholder": "ফোন নম্বর",
"form.input.card.placeholder": "কার্ড নম্বর",
"form.input.expiry.placeholder": "মাস / বছর",
"form.input.secure.placeholder": "সিভিভি",
"form.input.cardholder.placeholder": "কার্ডধারীর নাম",
"form.input.email.placeholder": "ইমেইল",
"form.input.amount.placeholder": "পরিমাণ",
"form.button.back.to.website": "ওয়েবসাইটে ফিরে যান",
"form.button.reload": "পুনরায় লোড করুন",
"form.button.next.label": "পরবর্তী",
"form.button.pay.again.label": "আবার চেষ্টা করুন",
"form.button.pay.label": "পরিশোধ করুন",
"form.button.copy.label": "অনুলিপি",
"form.button.copied.label": "অনুলিপি হয়েছে!",
"form.payment.method.name.card.label": "কার্ড",
"form.payment.method.name.others.label": "সমস্ত পেমেন্ট পদ্ধতি",
"form.serviceProvidersGrid.search": "অনুসন্ধান",
"form.qr.code": "পেমেন্ট সম্পন্ন করতে আপনার ব্যাংকিং অ্যাপ বা ফোনের ক্যামেরা দিয়ে কিউআর কোড স্ক্যান করুন",
"form.p2p.error": "অন্য একটি পরিমাণের জন্য আবেদন করুন অথবা পরে আবার চেষ্টা করুন।",
"form.p2p.destination.info": "নিম্নলিখিত বিবরণ ব্যবহার করে ট্রান্সফার করুন:",
"form.p2p.destination.bank.card.pan": "কার্ড নম্বর:",
"form.p2p.destination.bank.name": "ব্যাংক:",
"form.p2p.destination.bank.recipient": "প্রাপক:",
"form.p2p.destination.spb.phone": "ফোন নম্বর:",
"form.p2p.destination.bank.account.account": "অ্যাকাউন্ট নম্বর:",
"form.p2p.destination.bank.account.bic": "BIC:",
"form.p2p.destination.bank.account.purpose": "প্রদানের উদ্দেশ্য:",
"form.p2p.destination.qrCode.description": "অনুগ্রহ করে আপনার ব্যাংকিং অ্যাপ বা ফোন ক্যামেরা দিয়ে কিউআর কোড স্ক্যান করুন",
"form.p2p.complete.info": "ট্রান্সফার সম্পন্ন হওয়ার পর নিচের বোতাম চাপুন। পেমেন্ট প্রক্রিয়াকরণে ৫ মিনিট সময় লাগতে পারে।",
"form.p2p.complete.button": "ট্রান্সফার সম্পন্ন",
"form.p2p.complete.loading": "অনুগ্রহ করে অপেক্ষা করুন",
"form.p2p.destination.amount": "পরিমাণ:",
"form.p2p.destination.randomizeAmountDescription": "আমরা আপনার অর্থ জমা করার প্রক্রিয়া দ্রুত করার জন্য আমানতের পরিমাণ পরিবর্তন করেছি।",
"form.p2p.alert.li": [
"অর্ডারে উল্লিখিত সঠিক পরিমাণ ট্রান্সফার করুন।",
"পুরো পরিমাণ একবারে পরিশোধ করুন।",
"১৫ মিনিটের মধ্যে স্থানান্তর সম্পন্ন করুন।",
"স্থানান্তর সম্পন্ন করার পর, \"স্থানান্তর সম্পন্ন হয়েছে\" বোতামে ক্লিক করুন।"
],
"form.p2p.alert.p": "অন্যথায়, পেমেন্ট গৃহীত হবে না।",
"form.p2p.gateway.selector.heading": "একটি পদ্ধতি বা ব্যাংক চয়ন করুন",
"form.p2p.default.pane.label": "যেকোনো ব্যাংক",
"form.p2p.next.button": "পরবর্তী",
"form.p2p.destinations.heading": "পেমেন্ট",
"form.p2p.copied": "অনুলিপি হয়েছে!",
"InvalidPaymentTool": "অবৈধ পেমেন্ট যন্ত্র",
"AccountLimitsExceeded": "অ্যাকাউন্টের সীমা অতিক্রম করা হয়েছে",
"InsufficientFunds": "অপর্যাপ্ত তহবিল",
"PreauthorizationFailed": "প্রাক-অনুমোদন ব্যর্থ হয়েছে",
"RejectedByIssuer": "জারি করা ব্যাংকের দ্বারা প্রত্যাখ্যান করা হয়েছে",
"PaymentRejected": "পেমেন্ট প্রত্যাখ্যান করা হয়েছে",
"p2p.gateways": {
"sberbank": "sberbank",
"сбер": "sberbank",
"sber": "sberbank",
"сбербанк": "sberbank",
"сбр": "sberbank",
"sbr": "sberbank",
"tinkoff": "Tinkoff",
"raiffeisen": "Raiffeisen",
"sbp": "SBP",
"kapital": "Kapital",
"abb": "ABB"
},
"p2p.notification": {
"verified": "পেমেন্ট করার আগে অনুগ্রহ করে নিশ্চিত করুন যে আপনার MPAY ওয়ালেট অ্যাকাউন্ট যাচাই করা হয়েছে।"
},
"metadata.addons": {
"pinikle": {
"label": "আপনার কি ভাউচার নেই?",
"link": "কিনুন"
}
},
"loaderMessages": [
"লোড হচ্ছে... দয়া করে পৃষ্ঠাটি বন্ধ করবেন না।",
"এখনও কাজ চলছে... এতে বেশি সময় লাগবে না।",
"অপেক্ষা করুন! আমরা আপনার অনুরোধ প্রক্রিয়া করছি...",
"দয়া করে অপেক্ষা করুন... আপনার অনুরোধটি প্রক্রিয়া করা হচ্ছে।",
"দয়া করে অপেক্ষা করুন... আমরা প্রায় শেষ করেছি!",
"প্রায় হয়ে গেছে... অপেক্ষার জন্য ধন্যবাদ!"
]
}

4
src/assets/locale/en.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "Next",
"form.p2p.destinations.heading": "Payment",
"form.p2p.copied": "Copied!",
"leave.alert.header": "Are you sure?",
"leave.alert.body": "Your payment isn’t complete yet.",
"leave.alert.footer.button.no": "No",
"leave.alert.footer.button.yes": "Yes",
"InvalidPaymentTool": "Invalid payment instrument",
"AccountLimitsExceeded": "Account limit is exceeded",
"InsufficientFunds": "Insufficient funds",

104
src/assets/locale/ja.json
View File

@ -1,104 +0,0 @@
{
"info.back": "戻る",
"info.details": "詳細",
"info.modal.no.available.payment.method": "利用できる支払方法はありません",
"form.header.payment.methods.label": "お支払い方法を選択してください",
"form.header.netbanking.label": "銀行を選択してください",
"form.header.pay.card.label": "カードで支払う",
"form.header.final.success.label": "支払い完了",
"form.header.final.invoice.paid.label": "全額支払い済み",
"form.header.final.invoice.paid.already.label": "すでに支払い済み",
"form.header.final.invoice.cancelled.label": "請求書がキャンセルされました",
"form.header.final.invoice.fulfilled.label": "請求書は支払い済みです",
"form.header.final.error.label": "エラー",
"form.header.final.started.label": "保留中",
"form.header.final.failed.label": "未払い",
"form.header.final.refunded.label": "返金済み",
"form.header.final.pending.label": "保留中",
"form.header.final.pending.description": "",
"form.header.final.cancelled.label": "キャンセル済",
"form.final.failed.cancelled.text": "支払いがキャンセルされました",
"form.final.started.pay.text": "支払いは保留中です",
"form.final.need.help": "問題を解決するには？",
"form.input.phone.placeholder": "電話番号",
"form.input.card.placeholder": "カード番号",
"form.input.expiry.placeholder": "MM / YY",
"form.input.secure.placeholder": "CVV",
"form.input.cardholder.placeholder": "クレジットカード名義人氏名",
"form.input.email.placeholder": "Email",
"form.input.amount.placeholder": "金額",
"form.button.back.to.website": "サイトに戻る",
"form.button.reload": "リロード",
"form.button.next.label": "次",
"form.button.pay.again.label": "もう一度お試しください",
"form.button.pay.label": "支払う",
"form.button.copy.label": "コピー",
"form.button.copied.label": "コピーしました！",
"form.payment.method.name.card.label": "カード",
"form.payment.method.name.others.label": "すべての支払い方法",
"form.serviceProvidersGrid.search": "検索",
"form.qr.code": "お支払いを完了するために、銀行アプリまたは電話のカメラでQRコードをスキャンしてください",
"form.p2p.error": "別の金額を選択するか、後ほどお試しください",
"form.p2p.destination.info": "以下の詳細を使用して送金してください:",
"form.p2p.destination.bank.card.pan": "カード番号:",
"form.p2p.destination.bank.name": "銀行名:",
"form.p2p.destination.bank.recipient": "名前:",
"form.p2p.destination.spb.phone": "電話番号:",
"form.p2p.destination.bank.account.account": "口座番号:",
"form.p2p.destination.bank.account.bic": "BIC:",
"form.p2p.destination.bank.account.purpose": "支払い目的:",
"form.p2p.destination.qrCode.description": "銀行アプリまたは携帯電話のカメラでQRコードをスキャンしてください",
"form.p2p.complete.info": "送金完了後、以下のボタンを押してください。",
"form.p2p.complete.button": "支払い完了",
"form.p2p.complete.loading": "読み込み中...",
"form.p2p.destination.amount": "金額:",
"form.p2p.destination.randomizeAmountDescription": "資金の入金を迅速に行うために、預金額を変更しました。",
"form.p2p.alert.li": [
"正確な金額を振り込んでください",
"全額を一回の取引で振り込んでください",
"15分以内に振り込みを完了してください。",
"振り込みが完了したら、「振り込み完了」ボタンをクリックしてください。"
],
"form.p2p.alert.p": "そうしない場合、支払いは認められません。",
"form.p2p.gateway.selector.heading": "方法または銀行を選択してください",
"form.p2p.default.pane.label": "任意の銀行",
"form.p2p.next.button": "次",
"form.p2p.destinations.heading": "支払い",
"form.p2p.copied": "コピーしました！",
"InvalidPaymentTool": "無効な支払い手段です",
"AccountLimitsExceeded": "アカウントの上限を超えました",
"InsufficientFunds": "残高不足",
"PreauthorizationFailed": "事前認証に失敗しました",
"RejectedByIssuer": "信用状発行銀行に拒否されました",
"PaymentRejected": "支払いが却下されました",
"p2p.gateways": {
"sberbank": "sberbank",
"сбер": "sberbank",
"sber": "sberbank",
"сбербанк": "sberbank",
"сбр": "sberbank",
"sbr": "sberbank",
"tinkoff": "Tinkoff",
"raiffeisen": "Raiffeisen",
"sbp": "SBP",
"kapital": "Kapital",
"abb": "ABB"
},
"p2p.notification": {
"verified": "支払いを行う前に、MPAYウォレットのアカウントが認証されていることを確認してください。"
},
"metadata.addons": {
"pinikle": {
"label": "バウチャーがありませんか？",
"link": "購入"
}
},
"loaderMessages": [
"読み込み中... ページを閉じないでください。",
"まだ作業中です... もう少しお待ちください。",
"お待ちください！リクエストを処理しています...",
"少々お待ちください... リクエストを処理中です。",
"少々お待ちください... もうすぐです！",
"ほぼ完了です... お待ちいただきありがとうございます！"
]
}

104
src/assets/locale/ko.json
View File

@ -1,104 +0,0 @@
{
"info.back": "뒤로",
"info.details": "상세",
"info.modal.no.available.payment.method": "사용 가능한 결제 수단이 없습니다",
"form.header.payment.methods.label": "결제 수단을 선택하십시오",
"form.header.netbanking.label": "은행을 선택해주세요",
"form.header.pay.card.label": "카드로 지불하기",
"form.header.final.success.label": "결제 성공",
"form.header.final.invoice.paid.label": "전액 결제됨",
"form.header.final.invoice.paid.already.label": "이미 전액 결제됨",
"form.header.final.invoice.cancelled.label": "송장이 취소되었습니다",
"form.header.final.invoice.fulfilled.label": "송장이 결제되었습니다",
"form.header.final.error.label": "오류",
"form.header.final.started.label": "대기 중",
"form.header.final.failed.label": "미결제",
"form.header.final.refunded.label": "환불됨",
"form.header.final.pending.label": "대기 중",
"form.header.final.pending.description": "입금이 승인되었습니다. 10분안에 충전이 완료됩니다.",
"form.header.final.cancelled.label": "취소됨",
"form.final.failed.cancelled.text": "결제가 취소되었습니다",
"form.final.started.pay.text": "결제가 승인되어 처리 중입니다. 5-15분 내에 승인될 것으로 예상입니다",
"form.final.need.help": "문제가 생기셨습니까?",
"form.input.phone.placeholder": "전화번호",
"form.input.card.placeholder": "카드 번호",
"form.input.expiry.placeholder": "MM / YY",
"form.input.secure.placeholder": "CVV",
"form.input.cardholder.placeholder": "카드 소유자 이름",
"form.input.email.placeholder": "이메일",
"form.input.amount.placeholder": "합계",
"form.button.back.to.website": "웹사이트로 돌아가기",
"form.button.reload": "새로 고침",
"form.button.next.label": "다음",
"form.button.pay.again.label": "다시 시도해주십시오",
"form.button.pay.label": "결제",
"form.button.copy.label": "복사",
"form.button.copied.label": "복사됨!",
"form.payment.method.name.card.label": "카드",
"form.payment.method.name.others.label": "모든 결제 수단",
"form.serviceProvidersGrid.search": "검색",
"form.qr.code": "은행 앱으로 QR 코드를 스캔하여 결제를 완료하십시오",
"form.p2p.error": "다른 금액을 선택하거나 나중에 다시 시도하십시오.",
"form.p2p.destination.info": "다음 세부 정보를 사용하여 이체하세요:",
"form.p2p.destination.bank.card.pan": "카드 번호:",
"form.p2p.destination.bank.name": "은행:",
"form.p2p.destination.bank.recipient": "수령인:",
"form.p2p.destination.spb.phone": "전화번호:",
"form.p2p.destination.bank.account.account": "계좌 번호:",
"form.p2p.destination.bank.account.bic": "BIC:",
"form.p2p.destination.bank.account.purpose": "지급 목적:",
"form.p2p.destination.qrCode.description": "은행 앱 또는 휴대폰 카메라로 QR 코드를 스캔하세요",
"form.p2p.complete.info": "이체를 완료한 후 아래 버튼을 누르십시오. 결제 처리에는 최대 5분이 소요될 수 있습니다.",
"form.p2p.complete.button": "이체 완료",
"form.p2p.complete.loading": "기다려 주십시오",
"form.p2p.destination.amount": "금액:",
"form.p2p.destination.randomizeAmountDescription": "자금 입금을 신속하게 처리하기 위해 입금 금액을 변경했습니다.",
"form.p2p.alert.li": [
"요청한 정확한 금액을 이체하십시오.",
"전체 금액을 한 번에 이체하십시오.",
"15분 이내에 이체를 완료하세요.",
"이체 완료 후 \"이체 완료\" 버튼을 클릭하세요."
],
"form.p2p.alert.p": "그렇지 않으면 결제가 인정되지 않습니다.",
"form.p2p.gateway.selector.heading": "방법 또는 은행 선택",
"form.p2p.default.pane.label": "어떤 은행이든",
"form.p2p.next.button": "다음",
"form.p2p.destinations.heading": "결제",
"form.p2p.copied": "복사됨!",
"InvalidPaymentTool": "잘못된 결제 수단",
"AccountLimitsExceeded": "계정 한도 초과",
"InsufficientFunds": "자금 부족",
"PreauthorizationFailed": "사전 승인 실패",
"RejectedByIssuer": "발급 은행에 의해 거부됨",
"PaymentRejected": "결제 거부됨",
"p2p.gateways": {
"sberbank": "sberbank",
"сбер": "sberbank",
"sber": "sberbank",
"сбербанк": "sberbank",
"сбр": "sberbank",
"sbr": "sberbank",
"tinkoff": "Tinkoff",
"raiffeisen": "Raiffeisen",
"sbp": "SBP",
"kapital": "Kapital",
"abb": "ABB"
},
"p2p.notification": {
"verified": "결제를 진행하기 전에 MPAY 지갑 계정이 인증되었는지 확인하십시오."
},
"metadata.addons": {
"pinikle": {
"label": "바우처가 없으신가요?",
"link": "구매"
}
},
"loaderMessages": [
"로딩 중... 페이지를 닫지 마세요.",
"아직 작업 중입니다... 오래 걸리지 않을 것입니다.",
"잠시만 기다려 주세요! 요청을 처리 중입니다...",
"잠시만 기다려 주세요... 요청을 처리 중입니다.",
"잠시만 기다려 주세요... 거의 다 됐습니다!",
"거의 다 됐습니다... 기다려 주셔서 감사합니다!"
]
}

4
src/assets/locale/pt.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "Próximo",
"form.p2p.destinations.heading": "Pagamento",
"form.p2p.copied": "Copiado!",
"leave.alert.header": "Tem certeza?",
"leave.alert.body": "Seu pagamento ainda não está completo.",
"leave.alert.footer.button.no": "Não",
"leave.alert.footer.button.yes": "Sim",
"InvalidPaymentTool": "Instrumento de pagamento inválido",
"AccountLimitsExceeded": "Limite da conta excedido",
"InsufficientFunds": "Sem fundos",

4
src/assets/locale/ru.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "Далее",
"form.p2p.destinations.heading": "Оплата",
"form.p2p.copied": "Скопировано!",
"leave.alert.header": "Вы уверены?",
"leave.alert.body": "Ваш платеж еще не завершен.",
"leave.alert.footer.button.no": "Нет",
"leave.alert.footer.button.yes": "Да",
"InvalidPaymentTool": "Недопустимое средство оплаты",
"AccountLimitsExceeded": "Превышен лимит",
"InsufficientFunds": "Недостаточно средств",

4
src/assets/locale/tj.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "Баъдӣ",
"form.p2p.destinations.heading": "Пардохт",
"form.p2p.copied": "Нусхабардорӣ шуд!",
"leave.alert.header": "Шумо мутмаин ҳастед?",
"leave.alert.body": "Пардохти шумо ҳоло анҷом наёфтааст.",
"leave.alert.footer.button.no": "Не",
"leave.alert.footer.button.yes": "Ҳа",
"InvalidPaymentTool": "Абрези пардохт ғайриқонунӣ аст",
"AccountLimitsExceeded": "Меъёри ҳисоб зиёд шуд",
"InsufficientFunds": "Пули кофӣ нест",

4
src/assets/locale/tr.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "İleri",
"form.p2p.destinations.heading": "Ödeme",
"form.p2p.copied": "Kopyalandı!",
"leave.alert.header": "Emin misiniz?",
"leave.alert.body": "Ödemeniz henüz tamamlanmadı.",
"leave.alert.footer.button.no": "Hayır",
"leave.alert.footer.button.yes": "Evet",
"InvalidPaymentTool": "Geçersiz ödeme aracı",
"AccountLimitsExceeded": "Hesap limiti aşıldı",
"InsufficientFunds": "Yetersiz bakiye",

4
src/assets/locale/uz.json
View File

@ -67,6 +67,10 @@
"form.p2p.next.button": "Кейинги",
"form.p2p.destinations.heading": "Тўлов",
"form.p2p.copied": "Нусхаланди!",
"leave.alert.header": "Ishonchingiz komilmi?",
"leave.alert.body": "To'lovingiz hali tugallanmagan.",
"leave.alert.footer.button.no": "Yo'q",
"leave.alert.footer.button.yes": "Ha",
"InvalidPaymentTool": "Нотўғри тўлов воситаси",
"AccountLimitsExceeded": "Ҳисоб лимити ошиб кетди",
"InsufficientFunds": "Етарли маблағ йўқ",

28
src/common/components/QRCode.tsx
View File

@ -1,30 +1,20 @@
import { Center, useTheme } from '@chakra-ui/react';
import kjua from 'kjua';
import { QRCodeSVG } from 'qrcode.react';
export type QRCodeProps = {
text: string;
value: string;
size?: number;
};
export function QRCode({ text, size = 224 }: QRCodeProps) {
export function QRCode({ value, size = 224 }: QRCodeProps) {
const {
QRCode: { back, fill },
colors,
ViewContainer: { viewContainerBg },
} = useTheme();
return (
<Center
dangerouslySetInnerHTML={{
__html: kjua({
size,
back,
fill,
rounded: 100,
crisp: true,
ecLevel: 'H',
quiet: 0,
mode: 'plain',
text,
}).outerHTML,
}}
/>
<Center>
<QRCodeSVG bgColor={viewContainerBg} fgColor={colors.brand[500]} size={size} value={value} />
</Center>
);
}

6
src/components/ViewContainer/ApiExtensionView/Destinations/DestinationQRCodeAccountInfo.tsx
View File

@ -8,7 +8,7 @@ import { HiOutlineDuplicate } from 'react-icons/hi';
import { QRCode } from 'checkout/components';
import { LocaleContext } from 'checkout/contexts';
const QR_CODE_SIZE = 192;
const QR_CODE_SIZE = 160;
export type DestinationQRCodeAccountInfoProps = {
qrCode: string;
@ -36,11 +36,11 @@ export function DestinationQRCodeAccountInfo({ qrCode }: DestinationQRCodeAccoun
};
return (
<VStack align="stretch">
<VStack align="stretch" spacing={4}>
<Text fontSize="sm" textAlign="center">
{l['form.p2p.destination.qrCode.description']}
</Text>
<QRCode size={QR_CODE_SIZE} text={decodedUrl} />
<QRCode size={QR_CODE_SIZE} value={decodedUrl} />
{isRedirect ? (
<Button
borderRadius="xl"

76
src/components/ViewContainer/ApiExtensionView/Destinations/Destinations.tsx
View File

@ -1,11 +1,12 @@
/* eslint-disable react/jsx-max-depth */
import { VStack, Text, Button, Spacer, LightMode } from '@chakra-ui/react';
import { VStack, Text, Button, Spacer, LightMode, useDisclosure } from '@chakra-ui/react';
import { useContext, useEffect } from 'react';
import { Destination } from 'checkout/backend/p2p';
import { LocaleContext, PaymentContext, PaymentModelContext } from 'checkout/contexts';
import { DestinationInfo } from './DestinationInfo';
import { LeaveAlert } from './LeaveAlert';
import { P2PAlert } from './P2PAlert';
import { ApiExtensionViewContext } from '../ApiExtensionViewContext';
import { P2PApiError } from '../P2PApiError';
@ -22,6 +23,7 @@ export function Destinations({ destinations }: DestinationsProps) {
const {
paymentModel: { initContext },
} = useContext(PaymentModelContext);
const { isOpen, onOpen, onClose } = useDisclosure();
const {
completeState: { status },
@ -35,44 +37,42 @@ export function Destinations({ destinations }: DestinationsProps) {
}, [status]);
return (
<VStack align="stretch" minH="md" spacing={5}>
<P2PAlert />
<VStack align="stretch" spacing={3}>
{destinations.map((destination, index) => (
<DestinationInfo key={index} destination={destination} />
))}
</VStack>
<Spacer />
<VStack align="stretch" spacing={3}>
<Text fontSize="sm" textAlign="center">
{l['form.p2p.complete.info']}
</Text>
<VStack align="stretch" spacing={4}>
<LightMode>
<Button
borderRadius="xl"
colorScheme="brand"
isLoading={status === 'LOADING' || status === 'SUCCESS'}
loadingText={l['form.p2p.complete.loading']}
size="lg"
onClick={complete}
>
{l['form.p2p.complete.button']}
</Button>
{initContext?.redirectUrl && (
<Button
colorScheme="brand"
size="lg"
variant="link"
onClick={() => window.open(initContext.redirectUrl, '_self')}
>
{l['form.button.back.to.website']}
</Button>
)}
</LightMode>
<>
<VStack align="stretch" minH="md" spacing={5}>
<P2PAlert />
<VStack align="stretch" spacing={3}>
{destinations.map((destination, index) => (
<DestinationInfo key={index} destination={destination} />
))}
</VStack>
<Spacer />
<VStack align="stretch" spacing={3}>
<Text fontSize="sm" textAlign="center">
{l['form.p2p.complete.info']}
</Text>
<VStack align="stretch" spacing={4}>
<LightMode>
<Button
borderRadius="xl"
colorScheme="brand"
isLoading={status === 'LOADING' || status === 'SUCCESS'}
loadingText={l['form.p2p.complete.loading']}
size="lg"
onClick={complete}
>
{l['form.p2p.complete.button']}
</Button>
{initContext?.redirectUrl && (
<Button colorScheme="brand" pt={4} size="lg" variant="link" onClick={() => onOpen()}>
{l['form.button.back.to.website']}
</Button>
)}
</LightMode>
</VStack>
{status === 'FAILURE' && <P2PApiError l={l} />}
</VStack>
{status === 'FAILURE' && <P2PApiError l={l} />}
</VStack>
</VStack>
<LeaveAlert isOpen={isOpen} onClose={onClose} />
</>
);
}

45
src/components/ViewContainer/ApiExtensionView/Destinations/LeaveAlert.tsx Normal file
View File

@ -0,0 +1,45 @@
import {
AlertDialog,
AlertDialogBody,
AlertDialogCloseButton,
AlertDialogContent,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogOverlay,
Button,
} from '@chakra-ui/react';
import { useContext, useRef } from 'react';
import { LocaleContext, PaymentModelContext } from 'checkout/contexts';
export type LeaveAlertProps = {
isOpen: boolean;
onClose: () => void;
};
export function LeaveAlert({ isOpen, onClose }: LeaveAlertProps) {
const { l } = useContext(LocaleContext);
const cancelRef = useRef();
const {
paymentModel: { initContext },
} = useContext(PaymentModelContext);
return (
<AlertDialog isOpen={isOpen} leastDestructiveRef={cancelRef} motionPreset="slideInBottom" onClose={onClose}>
<AlertDialogOverlay />
<AlertDialogContent borderRadius="xl">
<AlertDialogHeader>{l['leave.alert.header']}</AlertDialogHeader>
<AlertDialogCloseButton />
<AlertDialogBody>{l['leave.alert.body']}</AlertDialogBody>
<AlertDialogFooter>
<Button ref={cancelRef} borderRadius="xl" onClick={onClose}>
{l['leave.alert.footer.button.no']}
</Button>
<Button borderRadius="xl" ml={4} onClick={() => window.open(initContext.redirectUrl, '_self')}>
{l['leave.alert.footer.button.yes']}
</Button>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
);
}

2
src/components/ViewContainer/QrCodeView/QrCodeView.tsx
View File

@ -63,7 +63,7 @@ export function QrCodeView() {
<Text fontWeight="medium" textAlign="center">
{l['form.qr.code']}
</Text>
<QRCode text={interaction.qrCode} />
<QRCode value={interaction.qrCode} />
{initContext.redirectUrl && (
<>
<Divider />

3
src/theme/index.ts
View File

@ -2,7 +2,7 @@ import { theme as chakraTheme } from '@chakra-ui/react';
import { Menu } from './components/Menu';
const { Button, Spinner, Divider, Heading, Alert, Drawer, Input } = chakraTheme.components;
const { Button, Spinner, Divider, Heading, Alert, Modal, Drawer, Input } = chakraTheme.components;
export const common = {
useSystemColorMode: false,
@ -12,6 +12,7 @@ export const common = {
Divider,
Heading,
Alert,
Modal,
Menu,
Drawer,
Input,

60
types/kjua.d.ts vendored
View File

@ -1,60 +0,0 @@
declare module 'kjua' {
interface KjuaOptions {
// render method: 'canvas' or 'image'
render?: 'canvas' | 'image';
// render pixel-perfect lines
crisp?: true;
// minimum version: 1..40
minVersion?: number;
// error correction level: 'L', 'M', 'Q' or 'H'
ecLevel?: 'L' | 'M' | 'Q' | 'H';
// size in pixel
size?: number;
// pixel-ratio, null for devicePixelRatio
ratio?: number;
// code color
fill?: string;
// background color
back?: string;
// content
text: string;
// roundend corners in pc: 0..100
rounded?: number;
// quiet zone in modules
quiet?: number;
// modes: 'plain', 'label' or 'image'
mode?: 'plain' | 'label' | 'image';
// label/image size and pos in pc: 0..100
mSize?: number;
mPosX?: number;
mPosY?: number;
// label
label?: string;
fontname?: string;
fontcolor?: string;
// image element
image?: HTMLImageElement;
}
function kjua<T extends KjuaOptions['render'] = 'image'>(
options: KjuaOptions & { render?: T },
): T extends 'canvas' ? HTMLCanvasElement : HTMLImageElement;
namespace kjua {
export { KjuaOptions as Options };
}
export = kjua;
}