Update src/App.jsx
This commit is contained in:
parent
5c0f168a37
commit
f342b5f70a
131
src/App.jsx
131
src/App.jsx
|
|
@ -8,7 +8,7 @@ import SelfBooking from './Pages/SelfBooking/SelfBooking.jsx';
|
|||
import { isMobile, isIOS } from 'react-device-detect';
|
||||
import { routesConfig } from './routesConfig';
|
||||
import { GlobalItemCard } from './Features/BookingScreen/BookingData/BookingData.js';
|
||||
import { clearSession, getSession, sessionStore } from './Services/Others.js';
|
||||
import { clearSession, getSession } from './Services/Others.js';
|
||||
|
||||
const KisokSelBooking = lazy(
|
||||
() => import('./Pages/SelfBooking/KisokSelBooking')
|
||||
|
|
@ -26,11 +26,9 @@ import useSubscriptionManager from './useSubscriptionManager.js';
|
|||
import useSessionManager from './useSessionManager.js';
|
||||
import ExtendSubscriptionModal from './Pages/ExtentedModal/ExtendSubscriptionModal.jsx';
|
||||
import devtools from 'devtools-detect';
|
||||
import { useDevToolsDetection } from './utils/useDevToolsDetection.js';
|
||||
import { Capacitor } from '@capacitor/core';
|
||||
|
||||
// const isCapacitor = () => !!window.Capacitor?.isNativePlatform?.();
|
||||
const isCapacitor = () => Capacitor.isNativePlatform();
|
||||
const isCapacitor = () => !!window.Capacitor?.isNativePlatform?.();
|
||||
|
||||
// ✅ Define your home/exit pages here
|
||||
const HOME_PAGES = [
|
||||
'/app-page/home', // android minimize
|
||||
|
|
@ -56,7 +54,7 @@ const AppRoutes = () => {
|
|||
const [devToolsOpen, setDevToolsOpen] = useState(false);
|
||||
// ✅ Flag to prevent stack push when back button navigates
|
||||
const isBackNav = useRef(false);
|
||||
console.log(isCapacitor(), 'Is Capacitor');
|
||||
|
||||
// ✅ Build navigation stack
|
||||
useEffect(() => {
|
||||
// Skip pushing to stack when back button caused this navigation
|
||||
|
|
@ -71,14 +69,13 @@ const AppRoutes = () => {
|
|||
// Don't track login pages
|
||||
if (LOGIN_PAGES.some((p) => path.includes(p))) return;
|
||||
|
||||
const raw = getSession('navStack');
|
||||
console.log('🎯 Current path:', path);
|
||||
const raw = sessionStorage.getItem('navStack');
|
||||
let stack = raw ? JSON.parse(raw) : [];
|
||||
|
||||
if (stack.length === 0 || stack[stack.length - 1] !== path) {
|
||||
stack.push(path);
|
||||
if (stack.length > 50) stack = stack.slice(-50);
|
||||
sessionStore('navStack', JSON.stringify(stack));
|
||||
sessionStorage.setItem('navStack', JSON.stringify(stack));
|
||||
console.log('📍 Stack:', stack);
|
||||
}
|
||||
} catch (e) { }
|
||||
|
|
@ -92,7 +89,7 @@ const AppRoutes = () => {
|
|||
const currentPath = location.pathname;
|
||||
|
||||
const SessionId = getSession('SessionId');
|
||||
console.log('SessionId:', SessionId, 'CurrentPath:', currentPath)
|
||||
|
||||
// 🟢 If session exists → allow navigation
|
||||
if (SessionId) {
|
||||
console.log('Browser back allowed');
|
||||
|
|
@ -119,109 +116,101 @@ const AppRoutes = () => {
|
|||
|
||||
const handler = async () => {
|
||||
try {
|
||||
const currentPath = window.location.pathname + window.location.search; // Bug 2 fix
|
||||
const currentPath = location.pathname + (location.search || '');
|
||||
console.log('🔙 Back pressed:', currentPath);
|
||||
|
||||
const raw = getSession('navStack');
|
||||
const raw = sessionStorage.getItem('navStack');
|
||||
let stack = raw ? JSON.parse(raw) : [];
|
||||
|
||||
// Remove current path from stack if it's at the end
|
||||
while (stack.length && stack[stack.length - 1] === currentPath) {
|
||||
stack.pop();
|
||||
}
|
||||
|
||||
// If there are pages in history, go back to previous page
|
||||
if (stack.length > 0) {
|
||||
const previous = stack[stack.length - 1];
|
||||
sessionStore('navStack', JSON.stringify(stack));
|
||||
isBackNav.current = true; // Bug 3 fix — BEFORE navigate
|
||||
sessionStorage.setItem('navStack', JSON.stringify(stack));
|
||||
isBackNav.current = true;
|
||||
navigate(previous);
|
||||
console.log('Navigate to previous:', previous);
|
||||
return;
|
||||
}
|
||||
|
||||
// Stack is empty - check where we are
|
||||
// 🏠 Home page → minimize
|
||||
if (HOME_PAGES?.some((p) => currentPath?.includes(p))) {
|
||||
console.log('Home page & empty stack → minimizing app');
|
||||
await CapacitorApp.minimizeApp();
|
||||
return;
|
||||
}
|
||||
|
||||
// 🚪 Login page → minimize
|
||||
if (LOGIN_PAGES?.some((p) => currentPath?.includes(p))) {
|
||||
console.log('Login page & empty stack → minimizing app');
|
||||
await CapacitorApp.minimizeApp();
|
||||
return;
|
||||
}
|
||||
|
||||
// Anywhere else with empty stack → go to home
|
||||
const home = '/app-page/home';
|
||||
isBackNav.current = true; // Bug 3 fix here too
|
||||
sessionStore('navStack', JSON.stringify([home]));
|
||||
sessionStorage.setItem('navStack', JSON.stringify([home]));
|
||||
isBackNav.current = true;
|
||||
navigate(home);
|
||||
console.log('Empty stack, navigate to home');
|
||||
} catch (e) {
|
||||
console.error('Back handler error:', e);
|
||||
await CapacitorApp.minimizeApp();
|
||||
}
|
||||
};
|
||||
|
||||
const listenerPromise = CapacitorApp.addListener('backButton', handler); // Bug 1 fix
|
||||
const listener = CapacitorApp.addListener('backButton', handler);
|
||||
|
||||
return () => {
|
||||
listenerPromise.then(({ remove }) => remove());
|
||||
listener.remove();
|
||||
};
|
||||
}, [navigate,location.pathname, location.search]);
|
||||
}, [navigate, location.pathname, location.search]);
|
||||
// mohan
|
||||
// useEffect(() => {
|
||||
// if (isMobile || isIOS) {
|
||||
// console.log('📱 Mobile/iOS device → skipping DevTools detection');
|
||||
// return;
|
||||
// }
|
||||
// const checkDevTools = setInterval(() => {
|
||||
// if (devtools.isOpen && !devToolsOpen) {
|
||||
// setDevToolsOpen(true);
|
||||
// document.body.innerHTML =
|
||||
// "<h1 style='color: red; text-align: center;'>Close Inspect to continue using the application.</h1>";
|
||||
// } else if (!devtools.isOpen && devToolsOpen) {
|
||||
// setDevToolsOpen(false);
|
||||
useEffect(() => {
|
||||
if (isMobile || isIOS) {
|
||||
console.log('📱 Mobile/iOS device → skipping DevTools detection');
|
||||
return;
|
||||
}
|
||||
const checkDevTools = setInterval(() => {
|
||||
if (devtools.isOpen && !devToolsOpen) {
|
||||
setDevToolsOpen(true);
|
||||
document.body.innerHTML =
|
||||
"<h1 style='color: red; text-align: center;'>Close Inspect to continue using the application.</h1>";
|
||||
} else if (!devtools.isOpen && devToolsOpen) {
|
||||
setDevToolsOpen(false);
|
||||
|
||||
// setTimeout(() => {
|
||||
// window.location.reload();
|
||||
// }, 100);
|
||||
setTimeout(() => {
|
||||
window.location.reload();
|
||||
}, 100);
|
||||
|
||||
// clearInterval(checkDevTools);
|
||||
// }
|
||||
clearInterval(checkDevTools);
|
||||
}
|
||||
|
||||
// if (!devtools.isOpen) {
|
||||
// let before = performance.now();
|
||||
if (!devtools.isOpen) {
|
||||
let before = performance.now();
|
||||
|
||||
// let after = performance.now();
|
||||
let after = performance.now();
|
||||
|
||||
// let executionDelay = after - before;
|
||||
let executionDelay = after - before;
|
||||
|
||||
// if (executionDelay > 100) {
|
||||
// setDevToolsOpen(true);
|
||||
// document.body.innerHTML =
|
||||
// "<h1 style='color: red; text-align: center;'>Close Inspect to continue using the application.</h1>";
|
||||
// } else {
|
||||
// setDevToolsOpen(false);
|
||||
// }
|
||||
// }
|
||||
// }, 1000);
|
||||
if (executionDelay > 100) {
|
||||
setDevToolsOpen(true);
|
||||
document.body.innerHTML =
|
||||
"<h1 style='color: red; text-align: center;'>Close Inspect to continue using the application.</h1>";
|
||||
} else {
|
||||
setDevToolsOpen(false);
|
||||
}
|
||||
}
|
||||
}, 1000);
|
||||
|
||||
// return () => clearInterval(checkDevTools);
|
||||
// }, [devToolsOpen]);
|
||||
// const isBlocked = useDevToolsDetection(() => {
|
||||
// // optional: log, notify, etc.
|
||||
// console.warn('DevTools detected');
|
||||
// });
|
||||
return () => clearInterval(checkDevTools);
|
||||
}, [devToolsOpen]);
|
||||
|
||||
// if (isBlocked) {
|
||||
// return (
|
||||
// <div style={{
|
||||
// display: 'flex',
|
||||
// justifyContent: 'center',
|
||||
// alignItems: 'center',
|
||||
// height: '100vh',
|
||||
// flexDirection: 'column',
|
||||
// gap: '1rem'
|
||||
// }}>
|
||||
// <h1 style={{ color: 'red' }}>
|
||||
// DevTools detected. Please close it to continue.
|
||||
// </h1>
|
||||
// </div>
|
||||
// );
|
||||
// }
|
||||
if (extendModel) {
|
||||
return (
|
||||
<ExtendSubscriptionModal
|
||||
|
|
|
|||
Loading…
Reference in New Issue