/** * AppShell — Sidebar גלובלי לכל מסכי YBP * - ניווט גלובלי + סקציית פרויקט (כשרלוונטי) * - Collapse ל-52px (אייקונים בלבד) + tooltip * - Mobile drawer (< 768px) עם hamburger */ (function () { const { useState, useEffect, useCallback } = React; const SIDEBAR_KEY = 'ybp_sidebar_collapsed'; const SIDEBAR_WIDTH = 240; const SIDEBAR_COLLAPSED = 52; // ── Nav items גלובליים ──────────────────────────────────────────────────────── const NAV_MAIN = [ { k: 'dashboard', icon: 'grid', label: 'לוח בקרה' }, { k: 'list', icon: 'folder', label: 'פרויקטים' }, ]; // מוקפא — נשמר לשימוש עתידי, אל תמחק: // { k: 'tenders', icon: 'inbox', label: 'מכרזים' }, // { k: 'protocols', icon: 'file_text', label: 'פרוטוקולים' }, // עובר לעמוד הדוחות בשם "סיכום פגישה" const NAV_FEATURES = [ { k: 'contacts', icon: 'users', label: 'אנשי קשר' }, ]; const NAV_BOTTOM = [ { k: 'settings', icon: 'settings', label: 'הגדרות' }, ]; // ── Tooltip ─────────────────────────────────────────────────────────────────── function Tooltip({ label, show }) { if (!show) return null; return (
{label}
); } // ── NavItem ─────────────────────────────────────────────────────────────────── function NavItem({ item, active, collapsed, onClick }) { const [hover, setHover] = useState(false); const isActive = active === item.k; return (
setHover(true)} onMouseLeave={() => setHover(false)}> {collapsed && }
); } // ── SidebarNavItem — פריט ניווט בסיידבר עם hover state משלו ────────────────── function SidebarNavItem({ item, isActive, collapsed, isMobile, onClose }) { const [hover, setHover] = useState(false); return (
setHover(true)} onMouseLeave={() => setHover(false)}> {collapsed && }
); } // ── ProjectSection — סקציית פרויקט נוכחי ──────────────────────────────────── function ProjectSection({ projectNav, collapsed, onClose, isMobile, activeSubView }) { if (!projectNav) return null; const items = projectNav.items || []; return ( <> {/* שם הפרויקט — כותרת גדולה וכהה */}
{!collapsed ? (
{projectNav.projectName || 'פרויקט נוכחי'}
) : (
)}
{/* רשימת הפריטים — שטוחה, בלי כותרות קבוצה */}
{items.map((item, i) => ( ))} {/* Drive — מוצג רק אם חובר handler (לא בשלב 1). אל תמציא ניווט. */} {projectNav.onOpenDrive && ( <>
)}
); } // ── AppSidebar ──────────────────────────────────────────────────────────────── function AppSidebar({ active, onNav, collapsed, onToggleCollapse, onClose, isMobile, projectNav, activeSubView, adminViewAll, onToggleViewAll, isAdmin }) { const session = window.YBP_AUTH ? window.YBP_AUTH.getSession() : null; return ( ); } // ── AppShell ────────────────────────────────────────────────────────────────── function AppShell({ children, active, onNav, crumbs, actions, title, subtitle, onBack, projectNav, activeSubView, projectId, adminViewAll, onToggleViewAll, isAdmin }) { const [collapsed, setCollapsed] = useState(() => { try { return localStorage.getItem(SIDEBAR_KEY) === 'true'; } catch { return false; } }); const [mobileOpen, setMobileOpen] = useState(false); const [versionBanner, setVersionBanner] = useState(null); const [emergencySaves, setEmergencySaves] = useState([]); const { isMobile, isLandscape } = useViewport(); // v65 #4 — מסך מלא לגאנט במובייל-landscape: הגאנט מדליק window.YBP_FULLSCREEN, וכאן מסתירים הדר/פוטר. const [fullscreen, setFullscreen] = useState(() => !!window.YBP_FULLSCREEN); useEffect(() => { const onFs = () => setFullscreen(!!window.YBP_FULLSCREEN); window.addEventListener('ybp-fullscreen', onFs); return () => window.removeEventListener('ybp-fullscreen', onFs); }, []); const chromeHidden = isMobile && fullscreen; useEffect(() => { window.showVersionBanner = (payload) => { if (typeof payload === 'string') setVersionBanner({ msg: payload, urgent: false }); else setVersionBanner({ msg: payload.msg, urgent: !!payload.urgent }); }; return () => { delete window.showVersionBanner; }; }, []); // Emergency save — מאזין ל-SW takeover useEffect(() => { if (!('serviceWorker' in navigator)) return; const handler = () => { try { if (window.YBP_FORM_DIRTY && window.YBP_FORM_STATE_SNAPSHOT) { const k = 'ybp_emergency_' + Date.now(); localStorage.setItem(k, JSON.stringify({ savedAt: Date.now(), snapshot: window.YBP_FORM_STATE_SNAPSHOT, screen: window.YBP_CURRENT_SCREEN || null, })); console.warn('[YBP] Emergency save:', k); } } catch {} }; navigator.serviceWorker.addEventListener('controllerchange', handler); return () => navigator.serviceWorker.removeEventListener('controllerchange', handler); }, []); // בדיקת emergency saves מהפעלה קודמת useEffect(() => { const keys = []; for (let i = 0; i < localStorage.length; i++) { const k = localStorage.key(i); if (k && k.startsWith('ybp_emergency_')) keys.push(k); } if (keys.length > 0) { const saves = []; for (const k of keys) { try { saves.push({ key: k, ...JSON.parse(localStorage.getItem(k)) }); } catch {} } if (saves.length > 0) setEmergencySaves(saves); } }, []); const toggleCollapse = useCallback(() => { setCollapsed(c => { const next = !c; try { localStorage.setItem(SIDEBAR_KEY, next); } catch {} return next; }); }, []); const BOTTOM_NAV = [ { k: 'dashboard', icon: 'grid', label: 'בקרה' }, { k: 'list', icon: 'folder', label: 'פרויקטים' }, { k: 'contacts', icon: 'users', label: 'אנשי קשר' }, { k: 'settings', icon: 'settings', label: 'הגדרות' }, ]; return ( <> {versionBanner && (
{versionBanner.urgent ? ( {versionBanner.msg} ) : ( <> גרסה חדשה זמינה —{' '} {versionBanner.msg} )}
)} {emergencySaves.length > 0 && (
⚠️ נמצאו {emergencySaves.length} שינוי{emergencySaves.length > 1 ? 'ם' : ''} לא שמור{emergencySaves.length > 1 ? 'ים' : ''}
האפליקציה עודכנה בזמן שמילאת טופס. הנתונים נשמרו אוטומטית.
{emergencySaves.map(s => (
{s.screen || 'טופס'} · {s.savedAt ? new Date(s.savedAt).toLocaleTimeString('he-IL', { hour: '2-digit', minute: '2-digit' }) : ''}
{Object.keys(s.snapshot || {}).length} שדות נשמרו
))}
)}
{/* Mobile overlay (for "more" drawer) */} {isMobile && mobileOpen && (
setMobileOpen(false)} style={{ position: 'fixed', inset: 0, background: 'rgba(0,0,0,0.5)', zIndex: 7900, backdropFilter: 'blur(2px)', }} /> )} {/* Sidebar — desktop always, mobile only when mobileOpen (drawer for "more") */} {(!isMobile || mobileOpen) && (
setMobileOpen(false)} isMobile={isMobile} projectNav={projectNav} activeSubView={activeSubView} adminViewAll={adminViewAll} onToggleViewAll={onToggleViewAll} isAdmin={isAdmin} />
)} {/* Main */}
{/* Mobile top bar — כותרת + חזרה */} {isMobile && !chromeHidden && (
{onBack ? ( ) : null}
{title &&
{title}
} {subtitle && !onBack &&
{subtitle}
}
{projectId && typeof DriveButton !== 'undefined' && ( )}
)} {/* Page content */}
{children}
{/* ── Bottom Navigation Bar (mobile only) ── */} {isMobile && !chromeHidden && ( )}
); } Object.assign(window, { AppShell, AppSidebar }); })();