show kyc requirement

2 files changed, 24 insertions, 18 deletions

diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
index 4c4ba1855..7bd4195ee 100644
--- a/packages/taler-wallet-webextension/src/wallet/Application.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -90,6 +90,10 @@ export function Application(): VNode {
   async function redirectToTxInfo(tid: string): Promise<void> {
     redirectTo(Pages.balanceTransaction({ tid }));
   }
+  function redirectToURL(str: string): void {
+    window.location.href = new URL(str).href
+  }
+
   return (
     <TranslationProvider source={strings}>
       <IoCProviderForRuntime>
@@ -97,7 +101,7 @@ export function Application(): VNode {
           <Route
             path={Pages.welcome}
             component={() => (
-              <WalletTemplate>
+              <WalletTemplate goToURL={redirectToURL}>
                 <WelcomePage />
               </WalletTemplate>
             )}
@@ -106,7 +110,7 @@ export function Application(): VNode {
           <Route
             path={Pages.qr}
             component={() => (
-              <WalletTemplate goToTransaction={redirectToTxInfo}>
+              <WalletTemplate goToTransaction={redirectToTxInfo} goToURL={redirectToURL}>
                 <QrReaderPage
                   onDetected={(talerActionUrl: TalerUri) => {
                     redirectTo(
@@ -123,7 +127,7 @@ export function Application(): VNode {
           <Route
             path={Pages.settings}
             component={() => (
-              <WalletTemplate goToTransaction={redirectToTxInfo}>
+              <WalletTemplate goToTransaction={redirectToTxInfo} goToURL={redirectToURL}>
                 <SettingsPage />
               </WalletTemplate>
             )}
@@ -131,7 +135,7 @@ export function Application(): VNode {
           <Route
             path={Pages.notifications}
             component={() => (
-              <WalletTemplate>
+              <WalletTemplate goToURL={redirectToURL}>
                 <NotificationsPage />
               </WalletTemplate>
             )}
@@ -142,7 +146,7 @@ export function Application(): VNode {
           <Route
             path={Pages.settingsExchangeAdd.pattern}
             component={() => (
-              <WalletTemplate>
+              <WalletTemplate goToURL={redirectToURL}>
                 <AddExchange onBack={() => redirectTo(Pages.balance)} />
               </WalletTemplate>
             )}
@@ -151,7 +155,7 @@ export function Application(): VNode {
           <Route
             path={Pages.balanceHistory.pattern}
             component={({ currency }: { currency?: string }) => (
-              <WalletTemplate path="balance" goToTransaction={redirectToTxInfo}>
+              <WalletTemplate path="balance" goToTransaction={redirectToTxInfo} goToURL={redirectToURL}>
                 <HistoryPage
                   currency={currency}
                   goToWalletDeposit={(currency: string) =>
@@ -171,7 +175,7 @@ export function Application(): VNode {
           <Route
             path={Pages.sendCash.pattern}
             component={({ amount }: { amount?: string }) => (
-              <WalletTemplate path="balance">
+              <WalletTemplate path="balance" goToURL={redirectToURL}>
                 <DestinationSelectionPage
                   type="send"
                   amount={amount}
@@ -188,7 +192,7 @@ export function Application(): VNode {
           <Route
             path={Pages.receiveCash.pattern}
             component={({ amount }: { amount?: string }) => (
-              <WalletTemplate path="balance">
+              <WalletTemplate path="balance" goToURL={redirectToURL}>
                 <DestinationSelectionPage
                   type="get"
                   amount={amount}
@@ -206,7 +210,7 @@ export function Application(): VNode {
           <Route
             path={Pages.balanceTransaction.pattern}
             component={({ tid }: { tid: string }) => (
-              <WalletTemplate path="balance">
+              <WalletTemplate path="balance" goToURL={redirectToURL}>
                 <TransactionPage
                   tid={tid}
                   goToWalletHistory={(currency?: string) =>
@@ -220,7 +224,7 @@ export function Application(): VNode {
           <Route
             path={Pages.balanceDeposit.pattern}
             component={({ amount }: { amount: string }) => (
-              <WalletTemplate path="balance">
+              <WalletTemplate path="balance" goToURL={redirectToURL}>
                 <DepositPage
                   amount={amount}
                   onCancel={(currency: string) => {
@@ -237,7 +241,7 @@ export function Application(): VNode {
           <Route
             path={Pages.backup}
             component={() => (
-              <WalletTemplate path="backup" goToTransaction={redirectToTxInfo}>
+              <WalletTemplate path="backup" goToTransaction={redirectToTxInfo} goToURL={redirectToURL}>
                 <BackupPage
                   onAddProvider={() => redirectTo(Pages.backupProviderAdd)}
                 />
@@ -247,7 +251,7 @@ export function Application(): VNode {
           <Route
             path={Pages.backupProviderDetail.pattern}
             component={({ pid }: { pid: string }) => (
-              <WalletTemplate>
+              <WalletTemplate goToURL={redirectToURL}>
                 <ProviderDetailPage
                   pid={pid}
                   onPayProvider={(uri: string) =>
@@ -264,7 +268,7 @@ export function Application(): VNode {
           <Route
             path={Pages.backupProviderAdd}
             component={() => (
-              <WalletTemplate>
+              <WalletTemplate goToURL={redirectToURL}>
                 <AddBackupProviderPage
                   onPaymentRequired={(uri: string) =>
                     redirectTo(`${Pages.ctaPay}?talerPayUri=${uri}`)
@@ -284,7 +288,7 @@ export function Application(): VNode {
           <Route
             path={Pages.dev}
             component={() => (
-              <WalletTemplate path="dev" goToTransaction={redirectToTxInfo}>
+              <WalletTemplate path="dev" goToTransaction={redirectToTxInfo} goToURL={redirectToURL}>
                 <DeveloperPage />
               </WalletTemplate>
             )}
@@ -595,10 +599,12 @@ function WalletTemplate({
   path,
   children,
   goToTransaction,
+  goToURL,
 }: {
   path?: WalletNavBarOptions;
   children: ComponentChildren;
   goToTransaction?: (id: string) => Promise<void>;
+  goToURL: (url: string) => void;
 }): VNode {
   const online = useIsOnline();
   const { i18n } = useTranslationContext();
@@ -611,9 +617,9 @@ function WalletTemplate({
       )}
       <LogoHeader />
       <WalletNavBar path={path} />
-      {goToTransaction ? (
-        <PendingTransactions goToTransaction={goToTransaction} />
-      ) : undefined}
+      <PendingTransactions
+        goToTransaction={goToTransaction}
+        goToURL={goToURL} />
       <WalletBox>
         <AlertProvider>
           <CurrentAlerts />
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 076110522..fcedc12f0 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -258,7 +258,7 @@ function TransactionTemplate({
                   <div>
                     <i18n.Translate>
                       Follow this link to the{` `}
-                      <a href={transaction.kycUrl}>KYC verifier</a>
+                      <a rel="noreferrer" target="_bank" href={transaction.kycUrl}>KYC verifier</a>
                     </i18n.Translate>
                   </div>
                 ) : (