1 files changed, 9 insertions, 0 deletions
diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
index 31a71e249..13afccb6c 100644
--- a/packages/taler-wallet-webextension/src/wallet/Application.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -44,6 +44,7 @@ import { LogoHeader } from "../components/LogoHeader.js";
 import PendingTransactions from "../components/PendingTransactions.js";
 import {
   LinkPrimary,
+  RedBanner,
   SubTitle,
   WalletAction,
   WalletBox,
@@ -80,6 +81,7 @@ import { QrReaderPage } from "./QrReader.js";
 import { SettingsPage } from "./Settings.js";
 import { TransactionPage } from "./Transaction.js";
 import { WelcomePage } from "./Welcome.js";
+import { useIsOnline } from "../hooks/useIsOnline.js";
 
 export function Application(): VNode {
   const { i18n } = useTranslationContext();
@@ -585,8 +587,15 @@ function WalletTemplate({
   children: ComponentChildren;
   goToTransaction?: (id: string) => Promise<void>;
 }): VNode {
+  const online = useIsOnline();
+  const { i18n } = useTranslationContext();
   return (
     <Fragment>
+      {!online && (
+        <div style={{ display: "flex", justifyContent: "center" }}>
+          <RedBanner>{i18n.str`Network is offline`}</RedBanner>
+        </div>
+      )}
       <LogoHeader />
       <WalletNavBar path={path} />
       {goToTransaction ? (