From ddfb40e50cef0abddc7690b23562b1ca5aeb3fdd Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Fri, 25 Mar 2022 16:57:27 -0300
Subject: new dev environment

---
 .../src/wallet/Application.tsx                     | 263 +++++++++++++++++++++
 1 file changed, 263 insertions(+)
 create mode 100644 packages/taler-wallet-webextension/src/wallet/Application.tsx

(limited to 'packages/taler-wallet-webextension/src/wallet/Application.tsx')

diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
new file mode 100644
index 000000000..2116b500e
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -0,0 +1,263 @@
+/*
+ This file is part of GNU Taler
+ (C) 2020 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 <http://www.gnu.org/licenses/>
+ */
+
+/**
+ * Main entry point for extension pages.
+ *
+ * @author sebasjm
+ */
+
+import { createHashHistory } from "history";
+import { Fragment, h, VNode } from "preact";
+import Router, { route, Route } from "preact-router";
+import Match from "preact-router/match";
+import { useEffect, useState } from "preact/hooks";
+import { LogoHeader } from "../components/LogoHeader";
+import PendingTransactions from "../components/PendingTransactions";
+import { SuccessBox, WalletBox } from "../components/styled";
+import { DevContextProvider } from "../context/devContext";
+import { IoCProviderForRuntime } from "../context/iocContext";
+import {
+  TranslationProvider,
+  useTranslationContext,
+} from "../context/translation";
+import { PayPage } from "../cta/Pay";
+import { RefundPage } from "../cta/Refund";
+import { TipPage } from "../cta/Tip";
+import { WithdrawPage } from "../cta/Withdraw";
+import { Pages, WalletNavBar } from "../NavigationBar";
+import { DeveloperPage } from "../popup/DeveloperPage";
+import { BackupPage } from "./BackupPage";
+import { DepositPage } from "./DepositPage";
+import { ExchangeAddPage } from "./ExchangeAddPage";
+import { HistoryPage } from "./History";
+import { ManualWithdrawPage } from "./ManualWithdrawPage";
+import { ProviderAddPage } from "./ProviderAddPage";
+import { ProviderDetailPage } from "./ProviderDetailPage";
+import { SettingsPage } from "./Settings";
+import { TransactionPage } from "./Transaction";
+import { WelcomePage } from "./Welcome";
+
+export function Application(): VNode {
+  const [globalNotification, setGlobalNotification] = useState<
+    VNode | undefined
+  >(undefined);
+  const hash_history = createHashHistory();
+  function clearNotification(): void {
+    setGlobalNotification(undefined);
+  }
+  function clearNotificationWhenMovingOut(): void {
+    // const movingOutFromNotification =
+    //   globalNotification && e.url !== globalNotification.to;
+    if (globalNotification) {
+      //&& movingOutFromNotification) {
+      setGlobalNotification(undefined);
+    }
+  }
+  const { i18n } = useTranslationContext();
+
+  return (
+    <TranslationProvider>
+      <DevContextProvider>
+        <IoCProviderForRuntime>
+          {/* <Match/> won't work in the first render if <Router /> is not called first */}
+          {/* https://github.com/preactjs/preact-router/issues/415 */}
+          <Router history={hash_history} />
+          <Match>
+            {({ path }: { path: string }) => {
+              if (path && path.startsWith("/cta")) return;
+              return (
+                <Fragment>
+                  <LogoHeader />
+                  <WalletNavBar path={path} />
+                  <div
+                    style={{
+                      backgroundColor: "lightcyan",
+                      display: "flex",
+                      justifyContent: "center",
+                    }}
+                  >
+                    <PendingTransactions
+                      goToTransaction={(txId: string) =>
+                        route(Pages.balance_transaction.replace(":tid", txId))
+                      }
+                    />
+                  </div>
+                </Fragment>
+              );
+            }}
+          </Match>
+          <WalletBox>
+            {globalNotification && (
+              <SuccessBox onClick={clearNotification}>
+                <div>{globalNotification}</div>
+              </SuccessBox>
+            )}
+            <Router
+              history={hash_history}
+              onChange={clearNotificationWhenMovingOut}
+            >
+              <Route path={Pages.welcome} component={WelcomePage} />
+
+              {/**
+               * BALANCE
+               */}
+
+              <Route
+                path={Pages.balance_history}
+                component={HistoryPage}
+                goToWalletDeposit={(currency: string) =>
+                  route(Pages.balance_deposit.replace(":currency", currency))
+                }
+                goToWalletManualWithdraw={(currency?: string) =>
+                  route(
+                    Pages.balance_manual_withdraw.replace(
+                      ":currency?",
+                      currency || "",
+                    ),
+                  )
+                }
+              />
+              <Route
+                path={Pages.balance_transaction}
+                component={TransactionPage}
+                goToWalletHistory={(currency?: string) => {
+                  route(
+                    Pages.balance_history.replace(":currency?", currency || ""),
+                  );
+                }}
+              />
+
+              <Route
+                path={Pages.balance_manual_withdraw}
+                component={ManualWithdrawPage}
+                onCancel={() => {
+                  route(Pages.balance);
+                }}
+              />
+
+              <Route
+                path={Pages.balance_deposit}
+                component={DepositPage}
+                onCancel={(currency: string) => {
+                  route(Pages.balance_history.replace(":currency?", currency));
+                }}
+                onSuccess={(currency: string) => {
+                  route(Pages.balance_history.replace(":currency?", currency));
+                  setGlobalNotification(
+                    <i18n.Translate>
+                      All done, your transaction is in progress
+                    </i18n.Translate>,
+                  );
+                }}
+              />
+              {/**
+               * PENDING
+               */}
+              <Route path={Pages.settings} component={SettingsPage} />
+
+              {/**
+               * BACKUP
+               */}
+              <Route
+                path={Pages.backup}
+                component={BackupPage}
+                onAddProvider={() => {
+                  route(Pages.backup_provider_add);
+                }}
+              />
+              <Route
+                path={Pages.backup_provider_detail}
+                component={ProviderDetailPage}
+                onBack={() => {
+                  route(Pages.backup);
+                }}
+              />
+              <Route
+                path={Pages.backup_provider_add}
+                component={ProviderAddPage}
+                onBack={() => {
+                  route(Pages.backup);
+                }}
+              />
+
+              {/**
+               * SETTINGS
+               */}
+              <Route
+                path={Pages.settings_exchange_add}
+                component={ExchangeAddPage}
+                onBack={() => {
+                  route(Pages.balance);
+                }}
+              />
+
+              {/**
+               * DEV
+               */}
+
+              <Route path={Pages.dev} component={DeveloperPage} />
+
+              {/**
+               * CALL TO ACTION
+               */}
+              <Route
+                path={Pages.cta_pay}
+                component={PayPage}
+                goToWalletManualWithdraw={(currency?: string) =>
+                  route(
+                    Pages.balance_manual_withdraw.replace(
+                      ":currency?",
+                      currency || "",
+                    ),
+                  )
+                }
+                goBack={() => route(Pages.balance)}
+              />
+              <Route path={Pages.cta_refund} component={RefundPage} />
+              <Route path={Pages.cta_tips} component={TipPage} />
+              <Route path={Pages.cta_withdraw} component={WithdrawPage} />
+
+              {/**
+               * NOT FOUND
+               * all redirects should be at the end
+               */}
+              <Route
+                path={Pages.balance}
+                component={Redirect}
+                to={Pages.balance_history.replace(":currency?", "")}
+              />
+
+              <Route
+                default
+                component={Redirect}
+                to={Pages.balance_history.replace(":currency?", "")}
+              />
+            </Router>
+          </WalletBox>
+        </IoCProviderForRuntime>
+      </DevContextProvider>
+    </TranslationProvider>
+  );
+}
+
+function Redirect({ to }: { to: string }): null {
+  useEffect(() => {
+    console.log("got some wrong route", to);
+    route(to, true);
+  });
+  return null;
+}
-- 
cgit v1.2.3