indas-ui 0.0.1 → 0.1.0

package/dist/cjs/contexts/ModuleAuthContext.js

@@ -0,0 +1,316 @@
+'use client';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModuleAuthProvider = ModuleAuthProvider;
+exports.useModuleAuth = useModuleAuth;
+exports.usePageAccess = usePageAccess;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const SessionAdapterContext_1 = require("./SessionAdapterContext.js");
+const navigation_1 = require("next/navigation");
+const user_1 = require("../lib/api/master/user.js");
+const ModuleAuthContext = React.createContext(undefined);
+// Map URL paths to module names (from the API)
+// These mappings should match the ModuleName returned by the API
+const PATH_TO_MODULE_MAP = {
+    // Main modules - can have multiple possible module names
+    '/costing/estimation': ['Estimation', 'Costing', 'Cost Estimation'],
+    '/costing/estimation/rapid': ['Rapid Estimation', 'Rapid', 'Estimation Steps', 'Step Estimation', 'Dynamic Fill', 'Dynamic Fill Costing', 'Estimation-Mobile', 'Estimation Mobile', 'Estimation', 'Cost Estimation'],
+    '/costing/estimation/steps': ['Rapid Estimation', 'Rapid', 'Estimation Steps', 'Step Estimation', 'Dynamic Fill', 'Dynamic Fill Costing', 'Estimation-Mobile', 'Estimation Mobile', 'Estimation', 'Cost Estimation'],
+    '/costing/estimation/mobile': ['Rapid Estimation', 'Rapid', 'Estimation Steps', 'Step Estimation', 'Dynamic Fill', 'Dynamic Fill Costing', 'Estimation-Mobile', 'Estimation Mobile', 'Estimation', 'Cost Estimation'],
+    '/enquiry': ['Enquiry', 'Inquiry', 'Enquiry Master'],
+    '/costing/quote-panel': ['Quote Panel', 'Quotation', 'Quotation Panel', 'Quote'],
+    '/dashboard': ['Dashboard', 'Home Dashboard'],
+    '/home': ['Home', 'Dashboard'],
+    '/report': ['Reports', 'Report', 'MIS Reports'],
+    '/settings': ['Settings', 'User Settings'],
+    // AI assistant
+    '/synthia': ['Synthia', 'Parkbuddy', 'AI Assistant'],
+    // Master modules
+    '/master/user': ['User Master', 'User', 'Users'],
+    '/master/machine': ['Machine Master', 'Machine', 'Machines'],
+    '/master/process': ['Process Master', 'Process', 'Processes'],
+    '/master/item': ['Item Master', 'Item', 'Items', 'Material Master'],
+    '/master/ledger': ['Ledger Master', 'Ledger', 'Ledgers', 'Account Master'],
+    '/master/customer': ['Customer Master', 'Customer', 'Customers', 'Lead Master', 'Lead', 'Leads'],
+    '/master/company': ['Company Master', 'Company', 'Companies'],
+    '/master/category': ['Category Master', 'Category', 'Categories'],
+    '/master/material-group': ['Material Group', 'Material Group Master'],
+    '/master/rate': ['Rate Master', 'Rate', 'Rates'],
+    '/master/other': ['Other Master', 'Other'],
+    // Activity modules
+    '/activity/email': ['Email', 'Emails', 'Mail'],
+    '/activity/notifications': ['Notifications', 'Notification'],
+    '/activity/audit-logs': ['Audit Logs', 'Audit Log', 'Audit'],
+    '/activity': ['Activity', 'Activities'],
+};
+// Paths that are always accessible (no permission check needed)
+const PUBLIC_PATHS = [
+    '/home',
+    '/dashboard',
+    '/settings',
+    '/login',
+    '/',
+];
+// Admin-only paths
+const ADMIN_ONLY_PATHS = [
+    '/master/user',
+    '/activity/audit-logs',
+];
+function ModuleAuthProvider({ children }) {
+    const { data: session, status } = (0, SessionAdapterContext_1.useSessionAdapter)();
+    const [permissions, setPermissions] = React.useState([]);
+    const [isLoading, setIsLoading] = React.useState(true);
+    // Fetch user permissions on mount and when session changes
+    const fetchPermissions = React.useCallback(async () => {
+        if (status !== 'authenticated' || !session?.user) {
+            setIsLoading(false);
+            return;
+        }
+        const userId = session.user.UserID || session.user.userID;
+        if (!userId) {
+            setIsLoading(false);
+            return;
+        }
+        try {
+            setIsLoading(true);
+            const response = await user_1.UserMasterAPI.getUserModulePermissions(userId, session);
+            if (response.success && Array.isArray(response.data)) {
+                setPermissions(response.data);
+            }
+        }
+        catch (error) {
+            // Silent fail
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [session, status]);
+    React.useEffect(() => {
+        fetchPermissions();
+    }, [fetchPermissions]);
+    // Find matching module for a given path
+    const findModuleForPath = React.useCallback((path) => {
+        if (!path || permissions.length === 0)
+            return null;
+        // Normalize path
+        const normalizedPath = path.toLowerCase().replace(/\/$/, '');
+        // Extract key segment from path
+        const pathSegments = normalizedPath.split('/').filter(Boolean);
+        const lastSegment = pathSegments[pathSegments.length - 1] || '';
+        const firstSegment = pathSegments[0] || '';
+        // Strategy 0: DB stores the full route in ModuleName (e.g. "/costing/paper-sensitivity").
+        // Exact match on that is the most authoritative — do it first so fuzzy strategies
+        // below can't accidentally resolve to a different sibling module.
+        const exactByModuleName = permissions.find(p => (p.ModuleName || '').toLowerCase().replace(/\/$/, '') === normalizedPath);
+        if (exactByModuleName)
+            return exactByModuleName;
+        // Strategy 1: Try exact match from PATH_TO_MODULE_MAP
+        let moduleNames = PATH_TO_MODULE_MAP[normalizedPath];
+        if (!moduleNames) {
+            const pathParts = [...pathSegments];
+            while (pathParts.length > 0) {
+                const parentPath = '/' + pathParts.join('/');
+                moduleNames = PATH_TO_MODULE_MAP[parentPath];
+                if (moduleNames)
+                    break;
+                pathParts.pop();
+            }
+        }
+        // Strategy 2: Direct match on ModuleName or ModuleDisplayName
+        const getModuleName = (p) => (p.ModuleDisplayName || p.ModuleName || '').toLowerCase().replace(/\s+/g, '');
+        if (!moduleNames || moduleNames.length === 0) {
+            const found = permissions.find(p => {
+                const moduleLower = getModuleName(p);
+                return moduleLower === lastSegment ||
+                    moduleLower === firstSegment ||
+                    moduleLower.includes(lastSegment) ||
+                    lastSegment.includes(moduleLower);
+            });
+            if (found)
+                return found;
+        }
+        // Strategy 3: Match from predefined mapping
+        if (moduleNames && moduleNames.length > 0) {
+            for (const moduleName of moduleNames) {
+                const found = permissions.find(p => getModuleName(p) === moduleName.toLowerCase().replace(/\s+/g, ''));
+                if (found)
+                    return found;
+            }
+            // Partial matching
+            for (const moduleName of moduleNames) {
+                const moduleNameLower = moduleName.toLowerCase().replace(/\s+/g, '');
+                const found = permissions.find(p => {
+                    const pName = getModuleName(p);
+                    return pName.includes(moduleNameLower) || moduleNameLower.includes(pName);
+                });
+                if (found)
+                    return found;
+            }
+        }
+        // Strategy 4: Fuzzy match
+        for (const segment of pathSegments) {
+            if (segment.length < 3)
+                continue;
+            const found = permissions.find(p => {
+                const pName = getModuleName(p);
+                return pName.includes(segment) || segment.includes(pName);
+            });
+            if (found)
+                return found;
+        }
+        return null;
+    }, [permissions]);
+    // Check if user has access to a module path
+    const hasAccess = React.useCallback((modulePath) => {
+        // Public paths are always accessible
+        if (PUBLIC_PATHS.some(p => modulePath === p || (p !== '/' && modulePath.startsWith(p + '/')))) {
+            return true;
+        }
+        // Exact match for root
+        if (modulePath === '/')
+            return true;
+        // If still loading permissions, allow (will re-check when loaded)
+        if (isLoading)
+            return true;
+        // If no permissions loaded (API failed), allow access - don't block the app
+        if (permissions.length === 0)
+            return true;
+        // Find module permission
+        const modulePermission = findModuleForPath(modulePath);
+        // If module found, check CanView (handles both boolean and number)
+        if (modulePermission) {
+            // CanView can be boolean (true/false) or number (1/0)
+            const canViewModule = modulePermission.CanView === true || modulePermission.CanView === 1;
+            return canViewModule;
+        }
+        // Module not found in permissions - allow access (don't block unlisted modules)
+        return true;
+    }, [permissions, isLoading, findModuleForPath]);
+    // Permission check helpers - handle both number (1/0) and boolean (true/false)
+    const toBoolean = (val) => val === 1 || val === true;
+    const canView = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanView) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const canSave = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanSave) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const canEdit = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanEdit) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const canDelete = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanDelete) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const canExport = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanExport) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const canPrint = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanPrint) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const canCancel = React.useCallback((modulePath) => {
+        if (isLoading || permissions.length === 0)
+            return true;
+        const module = findModuleForPath(modulePath);
+        return module ? toBoolean(module.CanCancel) : true;
+    }, [findModuleForPath, isLoading, permissions.length]);
+    const value = React.useMemo(() => ({
+        permissions,
+        isLoading,
+        hasAccess,
+        canView,
+        canSave,
+        canEdit,
+        canDelete,
+        canExport,
+        canPrint,
+        canCancel,
+        refreshPermissions: fetchPermissions,
+    }), [permissions, isLoading, hasAccess, canView, canSave, canEdit, canDelete, canExport, canPrint, canCancel, fetchPermissions]);
+    return ((0, jsx_runtime_1.jsx)(ModuleAuthContext.Provider, { value: value, children: children }));
+}
+const PERMISSIVE_DEFAULTS = {
+    permissions: [],
+    isLoading: false,
+    hasAccess: () => true,
+    canView: () => true,
+    canSave: () => true,
+    canEdit: () => true,
+    canDelete: () => true,
+    canExport: () => true,
+    canPrint: () => true,
+    canCancel: () => true,
+    refreshPermissions: async () => { },
+};
+function useModuleAuth() {
+    const context = React.useContext(ModuleAuthContext);
+    // Return permissive defaults if used outside ModuleAuthProvider (e.g. login page, auth routes)
+    return context ?? PERMISSIVE_DEFAULTS;
+}
+// Hook to check current page access
+function usePageAccess() {
+    const pathname = (0, navigation_1.usePathname)();
+    const { hasAccess, isLoading, canView, canSave, canEdit, canDelete, canExport, canPrint, canCancel } = useModuleAuth();
+    const currentPath = pathname || '/';
+    return {
+        hasAccess: hasAccess(currentPath),
+        isLoading,
+        canView: canView(currentPath),
+        canSave: canSave(currentPath),
+        canEdit: canEdit(currentPath),
+        canDelete: canDelete(currentPath),
+        canExport: canExport(currentPath),
+        canPrint: canPrint(currentPath),
+        canCancel: canCancel(currentPath),
+    };
+}

package/dist/cjs/contexts/NavigationContext.js

@@ -0,0 +1,182 @@
+'use client';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavigationProvider = NavigationProvider;
+exports.useNavigation = useNavigation;
+exports.useModuleIntegrationRequired = useModuleIntegrationRequired;
+exports.useModuleDisplayName = useModuleDisplayName;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const api_1 = require("../lib/api/index.js");
+const utils_1 = require("../lib/utils.js");
+/**
+ * Filter grouped modules to only those with MobileSupported = 1/true.
+ * Returns grouped structure with empty groups removed.
+ */
+function filterMobileModules(groups) {
+    return groups
+        .map(group => ({
+        ...group,
+        modules: group.modules.filter(m => m.MobileSupported === 1 || m.MobileSupported === true),
+    }))
+        .filter(group => group.modules.length > 0);
+}
+const NavigationContext = React.createContext(undefined);
+function NavigationProvider({ children, companyId, userId }) {
+    const [groupedModules, setGroupedModules] = React.useState([]);
+    const [loading, setLoading] = React.useState(true);
+    const [error, setError] = React.useState(null);
+    const fetchNavigation = React.useCallback(async () => {
+        if (!companyId || !userId) {
+            setLoading(false);
+            return;
+        }
+        const cacheKey = `navigation_${companyId}_${userId}`;
+        const cacheTimeKey = `${cacheKey}_time`;
+        const CACHE_DURATION = 5 * 60 * 1000; // 5 minutes
+        try {
+            // Check cache first
+            const cachedData = localStorage.getItem(cacheKey);
+            const cacheTime = localStorage.getItem(cacheTimeKey);
+            if (cachedData && cacheTime) {
+                const age = Date.now() - parseInt(cacheTime);
+                if (age < CACHE_DURATION) {
+                    setGroupedModules(JSON.parse(cachedData));
+                    setLoading(false);
+                    return;
+                }
+            }
+            setLoading(true);
+            const navigation = await (0, api_1.getDynamicNavigation)(companyId, userId);
+            setGroupedModules(navigation);
+            localStorage.setItem(cacheKey, JSON.stringify(navigation));
+            localStorage.setItem(cacheTimeKey, Date.now().toString());
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : 'Failed to load navigation';
+            setError(errorMessage);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [companyId, userId]);
+    React.useEffect(() => {
+        fetchNavigation();
+    }, [fetchNavigation]);
+    const mobileModules = React.useMemo(() => filterMobileModules(groupedModules), [groupedModules]);
+    const value = React.useMemo(() => ({
+        groupedModules,
+        loading,
+        error,
+        refreshNavigation: fetchNavigation,
+        mobileModules,
+    }), [groupedModules, loading, error, fetchNavigation, mobileModules]);
+    return ((0, jsx_runtime_1.jsx)(NavigationContext.Provider, { value: value, children: children }));
+}
+function useNavigation() {
+    const context = React.useContext(NavigationContext);
+    if (!context) {
+        throw new Error('useNavigation must be used within NavigationProvider');
+    }
+    return context;
+}
+/**
+ * Whether the module at the given route path has IsIntegrationRequired = 1 in ModuleMaster.
+ * Used to gate customer-specific external integrations (e.g. legacy costing in Estimation).
+ */
+function useModuleIntegrationRequired(path) {
+    const { groupedModules } = useNavigation();
+    return React.useMemo(() => {
+        const norm = (p) => (p.length > 1 ? p.replace(/\/+$/, '') : p).toLowerCase();
+        const target = norm(path);
+        const matches = (mod) => {
+            const modPath = norm((0, utils_1.getModuleRoutePath)(mod.ModuleName));
+            if (modPath === '#' || modPath === '/')
+                return false;
+            return modPath === target;
+        };
+        for (const group of groupedModules) {
+            for (const mod of group.modules) {
+                if (matches(mod))
+                    return mod.IsIntegrationRequired === 1 || mod.IsIntegrationRequired === true;
+                if (mod.children) {
+                    for (const child of mod.children) {
+                        if (matches(child))
+                            return child.IsIntegrationRequired === 1 || child.IsIntegrationRequired === true;
+                    }
+                }
+            }
+        }
+        return false;
+    }, [groupedModules, path]);
+}
+/**
+ * Look up a module's ModuleDisplayName by its route path (e.g. '/synthia').
+ * Walks the full navigation tree including children.
+ */
+function useModuleDisplayName(path, fallback = '') {
+    const { groupedModules } = useNavigation();
+    return React.useMemo(() => {
+        const norm = (p) => (p.length > 1 ? p.replace(/\/+$/, '') : p).toLowerCase();
+        const target = norm(path);
+        let exactName = '';
+        let prefixName = '';
+        let prefixLen = -1;
+        const consider = (moduleName, displayName) => {
+            const modPath = norm((0, utils_1.getModuleRoutePath)(moduleName));
+            if (modPath === '#' || modPath === '/')
+                return;
+            if (target === modPath) {
+                exactName = displayName;
+            }
+            else if (target.startsWith(modPath + '/') && modPath.length > prefixLen) {
+                prefixLen = modPath.length;
+                prefixName = displayName;
+            }
+        };
+        for (const group of groupedModules) {
+            for (const mod of group.modules) {
+                consider(mod.ModuleName, mod.ModuleDisplayName);
+                if (mod.children) {
+                    for (const child of mod.children) {
+                        consider(child.ModuleName, child.ModuleDisplayName);
+                    }
+                }
+            }
+        }
+        return exactName || prefixName || fallback;
+    }, [groupedModules, path, fallback]);
+}

package/dist/cjs/contexts/NetworkStatusContext.js

@@ -0,0 +1,95 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useNetworkStatus = void 0;
+exports.NetworkStatusProvider = NetworkStatusProvider;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importDefault(require("react"));
+const lucide_react_1 = require("lucide-react");
+const LanguageContext_1 = require("./LanguageContext.js");
+const NetworkStatusContext = react_1.default.createContext({
+    online: true, slow: false, conn: null, reportSlow: () => { },
+});
+const useNetworkStatus = () => react_1.default.useContext(NetworkStatusContext);
+exports.useNetworkStatus = useNetworkStatus;
+// Link is weak below this throughput or above this round-trip time.
+const MIN_DOWNLINK_MBPS = 1;
+const MAX_RTT_MS = 500;
+// Fallback only (no Network Information API): a request this slow suggests trouble.
+// Deliberately high — a slow BACKEND query is not a slow connection.
+const SLOW_MS = 12000;
+const SLOW_CLEAR_MS = 15000;
+// Dismissing the slow banner snoozes it — without this, a link flapping around the
+// threshold resets the dismissal and the banner re-appears seconds after closing.
+const SLOW_SNOOZE_MS = 10 * 60000;
+function readConnection() {
+    const c = navigator?.connection;
+    if (!c || typeof c.downlink !== 'number')
+        return null;
+    return { downlink: c.downlink, rtt: c.rtt ?? 0, effectiveType: c.effectiveType ?? '' };
+}
+function NetworkStatusProvider({ children }) {
+    const { t } = (0, LanguageContext_1.useLanguage)();
+    const [online, setOnline] = react_1.default.useState(true);
+    const [conn, setConn] = react_1.default.useState(null);
+    const [slowFallback, setSlowFallback] = react_1.default.useState(false);
+    const clearTimer = react_1.default.useRef();
+    react_1.default.useEffect(() => {
+        setOnline(navigator.onLine);
+        const up = () => setOnline(true);
+        const down = () => setOnline(false);
+        window.addEventListener('online', up);
+        window.addEventListener('offline', down);
+        const c = navigator?.connection;
+        const sync = () => setConn(readConnection());
+        sync();
+        c?.addEventListener?.('change', sync);
+        return () => {
+            window.removeEventListener('online', up);
+            window.removeEventListener('offline', down);
+            c?.removeEventListener?.('change', sync);
+        };
+    }, []);
+    // Duration heuristic — only consulted when the browser gives us no link metrics.
+    const reportSlow = react_1.default.useCallback((ms) => {
+        if (readConnection() || ms < SLOW_MS)
+            return;
+        setSlowFallback(true);
+        clearTimeout(clearTimer.current);
+        clearTimer.current = setTimeout(() => setSlowFallback(false), SLOW_CLEAR_MS);
+    }, []);
+    react_1.default.useEffect(() => {
+        ;
+        globalThis.__reportRequestMs = reportSlow;
+        return () => { delete globalThis.__reportRequestMs; };
+    }, [reportSlow]);
+    const slow = conn
+        ? conn.effectiveType === '2g' || conn.effectiveType === 'slow-2g' ||
+            conn.downlink < MIN_DOWNLINK_MBPS || conn.rtt > MAX_RTT_MS
+        : slowFallback;
+    const [dismissed, setDismissed] = react_1.default.useState(null);
+    const snoozeUntil = react_1.default.useRef(0);
+    const state = !online ? 'offline' : slow ? 'slow' : null;
+    const prevState = react_1.default.useRef(state);
+    react_1.default.useEffect(() => {
+        if (prevState.current !== state) {
+            prevState.current = state;
+            if (Date.now() >= snoozeUntil.current)
+                setDismissed(null);
+        }
+    }, [state]);
+    const showBanner = state !== null && dismissed !== state;
+    const value = react_1.default.useMemo(() => ({ online, slow, conn, reportSlow }), [online, slow, conn, reportSlow]);
+    // Quantified when the browser supplies it: "Weak connection (0.8 Mbps) — …".
+    const weakText = conn && conn.downlink > 0
+        ? `${t('Weak connection')} (${conn.downlink.toFixed(1)} Mbps) — ${t('please check your internet connection')}`
+        : t('Weak connection — please check your internet connection');
+    return ((0, jsx_runtime_1.jsxs)(NetworkStatusContext.Provider, { value: value, children: [showBanner && ((0, jsx_runtime_1.jsxs)("div", { role: "status", className: "fixed top-2 left-1/2 -translate-x-1/2 z-[200] w-[calc(100%-2rem)] max-w-md flex items-center justify-center gap-2 pl-4 pr-9 py-3 rounded-lg shadow-lg text-xs font-medium bg-[rgb(var(--color-error))] text-white", children: [state === 'offline' ? (0, jsx_runtime_1.jsx)(lucide_react_1.WifiOff, { className: "h-3.5 w-3.5" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "h-3.5 w-3.5" }), (0, jsx_runtime_1.jsx)("span", { children: state === 'offline' ? t('No internet — please check your connection') : weakText }), (0, jsx_runtime_1.jsx)("button", { type: "button", onClick: () => {
+                            setDismissed(state);
+                            if (state === 'slow')
+                                snoozeUntil.current = Date.now() + SLOW_SNOOZE_MS;
+                        }, "aria-label": t('Dismiss'), className: "absolute right-3 p-0.5 rounded hover:bg-black/10 focus:outline-none focus:ring-1 focus:ring-current", children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-3.5 w-3.5" }) })] })), children] }));
+}