aboutsummaryrefslogtreecommitdiff
path: root/packages/taler-wallet-webextension
diff options
context:
space:
mode:
Diffstat (limited to 'packages/taler-wallet-webextension')
-rw-r--r--packages/taler-wallet-webextension/src/pageEntryPoint.ts4
-rw-r--r--packages/taler-wallet-webextension/src/pages/tip.tsx75
-rw-r--r--packages/taler-wallet-webextension/src/wxApi.ts11
-rw-r--r--packages/taler-wallet-webextension/static/tip.html8
4 files changed, 90 insertions, 8 deletions
diff --git a/packages/taler-wallet-webextension/src/pageEntryPoint.ts b/packages/taler-wallet-webextension/src/pageEntryPoint.ts
index 216cb83c3..0e2b67b5d 100644
--- a/packages/taler-wallet-webextension/src/pageEntryPoint.ts
+++ b/packages/taler-wallet-webextension/src/pageEntryPoint.ts
@@ -27,6 +27,7 @@ import { createWelcomePage } from "./pages/welcome";
import { createPayPage } from "./pages/pay";
import { createRefundPage } from "./pages/refund";
import { setupI18n } from "taler-wallet-core";
+import { createTipPage } from './pages/tip';
function main(): void {
try {
@@ -52,6 +53,9 @@ function main(): void {
case "refund.html":
mainElement = createRefundPage();
break;
+ case "tip.html":
+ mainElement = createTipPage();
+ break;
default:
throw Error(`page '${page}' not implemented`);
}
diff --git a/packages/taler-wallet-webextension/src/pages/tip.tsx b/packages/taler-wallet-webextension/src/pages/tip.tsx
index 1290037e7..6f57854d2 100644
--- a/packages/taler-wallet-webextension/src/pages/tip.tsx
+++ b/packages/taler-wallet-webextension/src/pages/tip.tsx
@@ -15,14 +15,81 @@
*/
/**
- * Page shown to the user to confirm creation
- * of a reserve, usually requested by the bank.
+ * Page shown to the user to accept or ignore a tip from a merchant.
*
- * @author Florian Dold
+ * @author Florian Dold <dold@taler.net>
*/
import * as React from "react";
+import { useEffect, useState } from "react";
+import { PrepareTipResult } from "taler-wallet-core";
+import { AmountView } from "../renderHtml";
+import * as wxApi from "../wxApi";
+
+function TalerTipDialog({ talerTipUri }: { talerTipUri: string }): JSX.Element {
+ const [updateCounter, setUpdateCounter] = useState<number>(0);
+ const [prepareTipResult, setPrepareTipResult] = useState<
+ PrepareTipResult | undefined
+ >();
+
+ const [tipIgnored, setTipIgnored] = useState(false);
+
+ useEffect(() => {
+ const doFetch = async (): Promise<void> => {
+ const p = await wxApi.prepareTip({ talerTipUri });
+ setPrepareTipResult(p);
+ };
+ doFetch();
+ }, [talerTipUri, updateCounter]);
+
+ const doAccept = async () => {
+ if (!prepareTipResult) {
+ return;
+ }
+ await wxApi.acceptTip({ walletTipId: prepareTipResult?.walletTipId });
+ setUpdateCounter(updateCounter + 1);
+ };
+
+ const doIgnore = () => {
+ setTipIgnored(true);
+ };
+
+ if (tipIgnored) {
+ return <span>You've ignored the tip.</span>;
+ }
+
+ if (!prepareTipResult) {
+ return <span>Loading ...</span>;
+ }
+
+ if (prepareTipResult.accepted) {
+ return (
+ <span>
+ Tip from <code>{prepareTipResult.merchantBaseUrl}</code> accepted.
+ Check your transactions list for more details.
+ </span>
+ );
+ } else {
+ return (
+ <div>
+ <p>
+ The merchant <code>{prepareTipResult.merchantBaseUrl}</code> is
+ offering you a tip of{" "}
+ <strong><AmountView amount={prepareTipResult.tipAmountEffective} /></strong> via the
+ exchange <code>{prepareTipResult.exchangeBaseUrl}</code>
+ </p>
+ <button onClick={doAccept}>Accept tip</button>
+ <button onClick={doIgnore}>Ignore</button>
+ </div>
+ );
+ }
+}
export function createTipPage(): JSX.Element {
- return <span>not implemented</span>;
+ const url = new URL(document.location.href);
+ const talerTipUri = url.searchParams.get("talerTipUri");
+ if (!talerTipUri) {
+ throw Error("invalid parameter");
+ }
+ return <TalerTipDialog talerTipUri={talerTipUri} />;
}
diff --git a/packages/taler-wallet-webextension/src/wxApi.ts b/packages/taler-wallet-webextension/src/wxApi.ts
index 9b7697c99..0434bb6d3 100644
--- a/packages/taler-wallet-webextension/src/wxApi.ts
+++ b/packages/taler-wallet-webextension/src/wxApi.ts
@@ -33,6 +33,9 @@ import {
WithdrawUriInfoResponse,
TransactionsResponse,
ApplyRefundResponse,
+ PrepareTipRequest,
+ PrepareTipResult,
+ AcceptTipRequest,
} from "taler-wallet-core";
export interface ExtendedPermissionsResponse {
@@ -188,6 +191,14 @@ export function getWithdrawalDetailsForUri(
return callBackend("getWithdrawalDetailsForUri", req);
}
+export function prepareTip(req: PrepareTipRequest): Promise<PrepareTipResult> {
+ return callBackend("prepareTip", req);
+}
+
+export function acceptTip(req: AcceptTipRequest): Promise<void> {
+ return callBackend("acceptTip", req);
+}
+
export function onUpdateNotification(f: () => void): () => void {
const port = chrome.runtime.connect({ name: "notifications" });
const listener = (): void => {
diff --git a/packages/taler-wallet-webextension/static/tip.html b/packages/taler-wallet-webextension/static/tip.html
index 00ed4d248..9c074e129 100644
--- a/packages/taler-wallet-webextension/static/tip.html
+++ b/packages/taler-wallet-webextension/static/tip.html
@@ -4,10 +4,10 @@
<meta charset="UTF-8" />
<title>Taler Wallet: Received Tip</title>
- <link rel="icon" href="/img/icon.png" />
- <link rel="stylesheet" type="text/css" href="/style/pure.css" />
- <link rel="stylesheet" type="text/css" href="/style/wallet.css" />
- <script src="/pageEntryPoint.js"></script>
+ <link rel="icon" href="/static/img/icon.png" />
+ <link rel="stylesheet" type="text/css" href="/static/style/pure.css" />
+ <link rel="stylesheet" type="text/css" href="/static/style/wallet.css" />
+ <script src="/dist/pageEntryPoint.js"></script>
</head>
<body>