/*
This file is part of GNU Taler
(C) 2021 Taler Systems S.A.
GNU Taler is free software; you can redistribute it and/or modify it under the
terms of the GNU General Public License as published by the Free Software
Foundation; either version 3, or (at your option) any later version.
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with
GNU Taler; see the file COPYING. If not, see
*/
/**
*
* @author Sebastian Javier Marchano (sebasjm)
*/
import { Fragment, h, render, VNode } from "preact";
import { render as renderToString } from "preact-render-to-string";
import { useEffect } from "preact/hooks";
import { Footer } from "../components/Footer";
import "../css/pure-min.css";
import "../css/style.css";
import { QR } from "../components/QR";
import { Page, QRPlaceholder, WalletLink } from "../styled";
/**
* This page creates a payment request QR code
*
* It will build into a mustache html template for server side rendering
*
* server side rendering params:
* - order_status_url
* - taler_pay_qrcode_svg
* - taler_pay_uri
* - order_summary
*
* request params:
* - pay_uri
* - order_summary
* - order_status_url
*/
interface Props {
payURI?: string;
order_status_url?: string;
qr_code?: string;
}
function Head({ order_summary }: { order_summary?: string }): VNode {
return (
Payment requested for{" "}
{order_summary ? order_summary : `{{ order_summary }}`}
);
}
export function RequestPayment({
payURI,
qr_code,
order_status_url,
}: Props): VNode {
useEffect(() => {
const longpollDelayMs = 60 * 1000;
let checkUrl: URL;
try {
checkUrl = new URL(
order_status_url ? order_status_url : "{{& order_status_url }}"
);
} catch (e) {
return;
}
checkUrl.searchParams.set("timeout_s", longpollDelayMs.toString());
function check() {
let retried = false;
function retryOnce() {
if (!retried) {
retried = true;
check();
}
}
const req = new XMLHttpRequest();
req.onreadystatechange = function () {
if (req.readyState === XMLHttpRequest.DONE) {
if (req.status === 200) {
try {
const resp = JSON.parse(req.responseText);
if (resp.fulfillment_url) {
window.location.replace(resp.fulfillment_url);
}
} catch (e) {
console.error("could not parse response:", e);
}
}
if (req.status === 202) {
try {
const resp = JSON.parse(req.responseText);
if (resp.fulfillment_url) {
window.location.replace(resp.fulfillment_url);
}
} catch (e) {
console.error("could not parse response:", e);
}
}
if (req.status === 402) {
try {
const resp = JSON.parse(req.responseText);
if (resp.already_paid_order_id && resp.fulfillment_url) {
window.location.replace(resp.fulfillment_url);
}
} catch (e) {
console.error("could not parse response:", e);
}
}
setTimeout(retryOnce, 500);
}
};
req.onerror = function () {
setTimeout(retryOnce, 500);
};
req.ontimeout = function () {
setTimeout(retryOnce, 500);
};
req.timeout = longpollDelayMs;
req.open("GET", checkUrl.href);
req.send();
}
setTimeout(check, 500);
});
return (