diff --git a/frontend/src/components/AppLayout.tsx b/frontend/src/components/AppLayout.tsx
index b2e3306f..4384181f 100644
--- a/frontend/src/components/AppLayout.tsx
+++ b/frontend/src/components/AppLayout.tsx
@@ -1,10 +1,11 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
import { Outlet, NavLink, useLocation } from 'react-router-dom';
import ConnectAccount from '../components/ConnectAccount';
import AppNav from './AppNav';
import { LanguageSelector } from './LanguageSelector';
import { ThemeToggle } from './ThemeToggle';
import { useTranslation } from 'react-i18next';
+import { OnboardingTour } from './OnboardingTour';
// ── Page Wrapper ───────────────────────
const PageWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
@@ -15,6 +16,25 @@ const PageWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
const AppLayout: React.FC = () => {
const location = useLocation();
useTranslation();
+ const [runTour, setRunTour] = useState(false);
+
+ useEffect(() => {
+ const hasCompletedTour = localStorage.getItem('payd_onboarding_completed');
+ if (!hasCompletedTour) {
+ const timer = setTimeout(() => setRunTour(true), 1500);
+ return () => clearTimeout(timer);
+ }
+ }, []);
+
+ const handleTourComplete = () => {
+ localStorage.setItem('payd_onboarding_completed', 'true');
+ setRunTour(false);
+ };
+
+ const restartTour = () => {
+ localStorage.removeItem('payd_onboarding_completed');
+ setRunTour(true);
+ };
return (
{
>
Apache License 2.0
+
STELLAR NETWORK · MAINNET
+
);
};
diff --git a/frontend/src/components/AppNav.tsx b/frontend/src/components/AppNav.tsx
index f8265039..0425ae40 100644
--- a/frontend/src/components/AppNav.tsx
+++ b/frontend/src/components/AppNav.tsx
@@ -40,6 +40,7 @@ const AppNav: React.FC = () => {
const navLinks = (
<>
`flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[13px] font-semibold transition ${
@@ -57,6 +58,7 @@ const AppNav: React.FC = () => {
`flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[13px] font-semibold transition ${
diff --git a/frontend/src/pages/CrossAssetPayment.tsx b/frontend/src/pages/CrossAssetPayment.tsx
index 2063d4a4..7b7a1539 100644
--- a/frontend/src/pages/CrossAssetPayment.tsx
+++ b/frontend/src/pages/CrossAssetPayment.tsx
@@ -71,7 +71,7 @@ export default function CrossAssetPayment() {
clearTimeout(timeout);
setIsLoadingPaths(false);
};
- }, [amount, assetIn, assetOut, notifyError]);
+ }, [amount, assetIn, assetOut, notifyApiError]);
useEffect(() => {
if (!socket || !submissionTxHash) return;
diff --git a/frontend/src/pages/EmployeeEntry.tsx b/frontend/src/pages/EmployeeEntry.tsx
index 384d345e..6c2d19fc 100644
--- a/frontend/src/pages/EmployeeEntry.tsx
+++ b/frontend/src/pages/EmployeeEntry.tsx
@@ -267,17 +267,7 @@ export default function EmployeeEntry() {
-
+
diff --git a/frontend/src/pages/PayrollScheduler.tsx b/frontend/src/pages/PayrollScheduler.tsx
index 1452a7bb..5b644b54 100644
--- a/frontend/src/pages/PayrollScheduler.tsx
+++ b/frontend/src/pages/PayrollScheduler.tsx
@@ -510,6 +510,7 @@ export default function PayrollScheduler() {
{!simulationPassed ? (