header rendering
This commit is contained in:
parent
ac60a0559c
commit
a01ad4758f
@ -23,7 +23,7 @@
|
||||
"date-fns": "^2.28.0",
|
||||
"history": "4.10.1",
|
||||
"preact": "^10.5.13",
|
||||
"preact-router": "^3.2.1",
|
||||
"preact-router": "3.2.1",
|
||||
"qrcode-generator": "^1.4.4",
|
||||
"tslib": "^2.3.1"
|
||||
},
|
||||
@ -74,4 +74,4 @@
|
||||
],
|
||||
"exclude": []
|
||||
}
|
||||
}
|
||||
}
|
@ -26,21 +26,20 @@
|
||||
*/
|
||||
import { i18n } from "@gnu-taler/taler-util";
|
||||
import { ComponentChildren, h, VNode } from "preact";
|
||||
import Match from "preact-router/match";
|
||||
import { PopupNavigation } from "./components/styled";
|
||||
|
||||
export enum Pages {
|
||||
welcome = "/welcome",
|
||||
balance = "/balance",
|
||||
balance_history = "/balance/history/:currency",
|
||||
manual_withdraw = "/manual-withdraw/:currency?",
|
||||
deposit = "/deposit/:currency",
|
||||
manual_withdraw = "/balance/manual-withdraw/:currency?",
|
||||
deposit = "/balance/deposit/:currency",
|
||||
transaction = "/balance/transaction/:tid",
|
||||
settings = "/settings",
|
||||
dev = "/dev",
|
||||
cta = "/cta/:action",
|
||||
backup = "/backup",
|
||||
last_activity = "/last-activity",
|
||||
transaction = "/transaction/:tid",
|
||||
provider_detail = "/provider/:pid",
|
||||
provider_add = "/provider/add",
|
||||
exchange_add = "/exchange/add",
|
||||
@ -73,7 +72,13 @@ function Tab(props: TabProps): VNode {
|
||||
);
|
||||
}
|
||||
|
||||
export function NavBar({ devMode, path }: { path: string; devMode: boolean }) {
|
||||
export function NavBar({
|
||||
devMode,
|
||||
path,
|
||||
}: {
|
||||
path: string;
|
||||
devMode: boolean;
|
||||
}): VNode {
|
||||
return (
|
||||
<PopupNavigation devMode={devMode}>
|
||||
<div>
|
||||
@ -89,15 +94,3 @@ export function NavBar({ devMode, path }: { path: string; devMode: boolean }) {
|
||||
</PopupNavigation>
|
||||
);
|
||||
}
|
||||
|
||||
export function WalletNavBar({ devMode }: { devMode: boolean }) {
|
||||
// const { devMode } = useDevContext();
|
||||
return (
|
||||
<Match>
|
||||
{({ path }: any) => {
|
||||
console.log("path", path);
|
||||
return <NavBar devMode={devMode} path={path} />;
|
||||
}}
|
||||
</Match>
|
||||
);
|
||||
}
|
||||
|
@ -29,7 +29,7 @@ import { PopupBox } from "./components/styled";
|
||||
import { DevContextProvider } from "./context/devContext";
|
||||
import { useTalerActionURL } from "./hooks/useTalerActionURL";
|
||||
import { strings } from "./i18n/strings";
|
||||
import { Pages, WalletNavBar } from "./NavigationBar";
|
||||
import { NavBar, Pages } from "./NavigationBar";
|
||||
import { BackupPage } from "./wallet/BackupPage";
|
||||
import { BalancePage } from "./popup/BalancePage";
|
||||
import { DeveloperPage } from "./popup/DeveloperPage";
|
||||
@ -40,6 +40,7 @@ import { TalerActionFound } from "./popup/TalerActionFound";
|
||||
import { ExchangeAddPage } from "./wallet/ExchangeAddPage";
|
||||
import { IoCProviderForRuntime } from "./context/iocContext";
|
||||
import { LastActivityPage } from "./wallet/LastActivityPage";
|
||||
import { Match } from "preact-router/match";
|
||||
|
||||
function main(): void {
|
||||
try {
|
||||
@ -75,16 +76,21 @@ function CheckTalerActionComponent(): VNode {
|
||||
return <Fragment />;
|
||||
}
|
||||
|
||||
function Application() {
|
||||
function Application(): VNode {
|
||||
const hash_history = createHashHistory();
|
||||
return (
|
||||
// <div>
|
||||
<DevContextProvider>
|
||||
{({ devMode }: { devMode: boolean }) => (
|
||||
<IoCProviderForRuntime>
|
||||
<WalletNavBar devMode={devMode} />
|
||||
<Match>
|
||||
{({ path }: { path: string }) => (
|
||||
<NavBar devMode={devMode} path={path} />
|
||||
)}
|
||||
</Match>
|
||||
<CheckTalerActionComponent />
|
||||
<PopupBox devMode={devMode}>
|
||||
<Router history={createHashHistory()}>
|
||||
<Router history={hash_history}>
|
||||
<Route path={Pages.dev} component={DeveloperPage} />
|
||||
|
||||
<Route
|
||||
|
@ -24,6 +24,7 @@ import { setupI18n } from "@gnu-taler/taler-util";
|
||||
import { createHashHistory } from "history";
|
||||
import { h, render, 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 { SuccessBox, WalletBox } from "./components/styled";
|
||||
@ -34,7 +35,7 @@ import { RefundPage } from "./cta/Refund";
|
||||
import { TipPage } from "./cta/Tip";
|
||||
import { WithdrawPage } from "./cta/Withdraw";
|
||||
import { strings } from "./i18n/strings";
|
||||
import { Pages, WalletNavBar } from "./NavigationBar";
|
||||
import { NavBar, Pages } from "./NavigationBar";
|
||||
import { DeveloperPage } from "./popup/DeveloperPage";
|
||||
import { BackupPage } from "./wallet/BackupPage";
|
||||
import { BalancePage } from "./wallet/BalancePage";
|
||||
@ -76,20 +77,28 @@ function Application(): VNode {
|
||||
const [globalNotification, setGlobalNotification] = useState<
|
||||
string | undefined
|
||||
>(undefined);
|
||||
const hash_history = createHashHistory();
|
||||
return (
|
||||
<div>
|
||||
<DevContextProvider>
|
||||
{({ devMode }: { devMode: boolean }) => (
|
||||
<IoCProviderForRuntime>
|
||||
<LogoHeader />
|
||||
<WalletNavBar devMode={devMode} />
|
||||
{/* <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 }) => (
|
||||
<NavBar devMode={devMode} path={path} />
|
||||
)}
|
||||
</Match>
|
||||
<WalletBox>
|
||||
{globalNotification && (
|
||||
<SuccessBox onClick={() => setGlobalNotification(undefined)}>
|
||||
<div>{globalNotification}</div>
|
||||
</SuccessBox>
|
||||
)}
|
||||
<Router history={createHashHistory()}>
|
||||
<Router history={hash_history}>
|
||||
<Route path={Pages.welcome} component={WelcomePage} />
|
||||
|
||||
<Route
|
||||
|
@ -352,7 +352,7 @@ importers:
|
||||
preact: ^10.5.13
|
||||
preact-cli: ^3.0.5
|
||||
preact-render-to-string: ^5.1.19
|
||||
preact-router: ^3.2.1
|
||||
preact-router: 3.2.1
|
||||
qrcode-generator: ^1.4.4
|
||||
rimraf: ^3.0.2
|
||||
rollup: ^2.63.0
|
||||
|
Loading…
Reference in New Issue
Block a user