diff options
Diffstat (limited to 'packages/taler-wallet-webextension/src/popupEntryPoint.tsx')
-rw-r--r-- | packages/taler-wallet-webextension/src/popupEntryPoint.tsx | 205 |
1 files changed, 110 insertions, 95 deletions
diff --git a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx index fa0e6e3df..02ab0df2c 100644 --- a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx +++ b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx @@ -17,10 +17,10 @@ /** * Main entry point for extension pages. * - * @author Florian Dold <dold@taler.net> + * @author sebasjm <dold@taler.net> */ -import { setupI18n } from "@gnu-taler/taler-util"; +import { setupI18n, i18n } from "@gnu-taler/taler-util"; import { createHashHistory } from "history"; import { Fragment, h, render, VNode } from "preact"; import Router, { route, Route } from "preact-router"; @@ -29,6 +29,7 @@ import { useEffect } from "preact/hooks"; import { PopupBox } from "./components/styled"; import { DevContextProvider } from "./context/devContext"; import { IoCProviderForRuntime } from "./context/iocContext"; +import { TranslationProvider } from "./context/translation"; import { useTalerActionURL } from "./hooks/useTalerActionURL"; import { strings } from "./i18n/strings"; import { Pages, PopupNavBar } from "./NavigationBar"; @@ -77,103 +78,117 @@ function CheckTalerActionComponent(): VNode { function Application(): VNode { const hash_history = createHashHistory(); return ( - // <div> - <DevContextProvider> - {({ devMode }: { devMode: boolean }) => ( - <IoCProviderForRuntime> - <Match> - {({ path }: { path: string }) => <PopupNavBar path={path} />} - </Match> - <CheckTalerActionComponent /> - <PopupBox devMode={devMode}> - <Router history={hash_history}> - <Route path={Pages.dev} component={DeveloperPage} /> - - <Route - path={Pages.balance} - component={BalancePage} - goToWalletManualWithdraw={() => - goToWalletPage( - Pages.balance_manual_withdraw.replace(":currency?", ""), - ) - } - goToWalletDeposit={(currency: string) => - goToWalletPage( - Pages.balance_deposit.replace(":currency", currency), - ) - } - goToWalletHistory={(currency: string) => - goToWalletPage( - Pages.balance_history.replace(":currency", currency), - ) - } - /> - <Route - path={Pages.cta} - component={function Action({ action }: { action: string }) { - const [, setDismissed] = useTalerActionURL(); - - return ( - <TalerActionFound - url={decodeURIComponent(action)} - onDismiss={() => { - setDismissed(true); - route(Pages.balance); - }} - /> - ); - }} - /> - - <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); - }} - /> - - <Route - path={Pages.settings_exchange_add} - component={ExchangeAddPage} - onBack={() => { - route(Pages.balance); - }} - /> - - <Route default component={Redirect} to={Pages.balance} /> - </Router> - </PopupBox> - </IoCProviderForRuntime> - )} - </DevContextProvider> - // </div> + <TranslationProvider> + <DevContextProvider> + {({ devMode }: { devMode: boolean }) => ( + <IoCProviderForRuntime> + <Match> + {({ path }: { path: string }) => <PopupNavBar path={path} />} + </Match> + <CheckTalerActionComponent /> + <PopupBox devMode={devMode}> + <Router history={hash_history}> + <Route + path={Pages.balance} + component={BalancePage} + goToWalletManualWithdraw={() => + route( + Pages.balance_manual_withdraw.replace(":currency?", ""), + ) + } + goToWalletDeposit={(currency: string) => + route(Pages.balance_deposit.replace(":currency", currency)) + } + goToWalletHistory={(currency: string) => + route(Pages.balance_history.replace(":currency", currency)) + } + /> + + <Route + path={Pages.cta} + component={function Action({ action }: { action: string }) { + const [, setDismissed] = useTalerActionURL(); + + return ( + <TalerActionFound + url={decodeURIComponent(action)} + onDismiss={() => { + setDismissed(true); + route(Pages.balance); + }} + /> + ); + }} + /> + + <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.balance_manual_withdraw} + component={RedirectToWalletPage} + /> + <Route + path={Pages.balance_deposit} + component={RedirectToWalletPage} + /> + <Route + path={Pages.balance_history} + component={RedirectToWalletPage} + /> + <Route + path={Pages.backup_provider_add} + component={RedirectToWalletPage} + /> + <Route path={Pages.settings} component={RedirectToWalletPage} /> + <Route + path={Pages.settings_exchange_add} + component={RedirectToWalletPage} + /> + <Route path={Pages.dev} component={RedirectToWalletPage} /> + + <Route default component={Redirect} to={Pages.balance} /> + </Router> + </PopupBox> + </IoCProviderForRuntime> + )} + </DevContextProvider> + </TranslationProvider> ); } -async function goToWalletPage(page: Pages | string): Promise<void> { - // eslint-disable-next-line no-undef - await chrome.tabs.create({ - active: true, - // eslint-disable-next-line no-undef - url: chrome.runtime.getURL(`/static/wallet.html#${page}`), +function RedirectToWalletPage(): VNode { + const page = document.location.hash || "#/"; + useEffect(() => { + chrome.tabs + .create({ + active: true, + // eslint-disable-next-line no-undef + url: chrome.runtime.getURL(`/static/wallet.html${page}`), + }) + .then(() => { + window.close(); + }); }); - window.close(); - // return null; + return ( + <span> + <i18n.Translate> + this popup is being closed and you are being redirected to {page} + </i18n.Translate> + </span> + ); } function Redirect({ to }: { to: string }): null { |