// app.jsx — TehillimToken landing + circles app const { useState, useEffect, useCallback } = React; function api(path, opts = {}) { return fetch(path, { headers: { 'Content-Type': 'application/json' }, ...opts, body: opts.body ? (typeof opts.body === 'string' ? opts.body : JSON.stringify(opts.body)) : undefined }).then(r => r.json()); } // ───────── Hebrew numeral (gematria) — Yakir 2026-05-14 ───────── // Religious texts conventionally use letters for chapter numbers // (פרק כ״ג, not פרק 23). 15→טו / 16→טז avoid divine-name combinations. function hebrewNumeral(n) { n = Number(n); if (!Number.isFinite(n) || n < 1 || n > 999) return String(n); const ones = ['', 'א', 'ב', 'ג', 'ד', 'ה', 'ו', 'ז', 'ח', 'ט']; const tens = ['', 'י', 'כ', 'ל', 'מ', 'נ', 'ס', 'ע', 'פ', 'צ']; const hundreds = ['', 'ק', 'ר', 'ש', 'ת', 'תק', 'תר', 'תש', 'תת', 'תתק']; let s = hundreds[Math.floor(n / 100)]; const t = Math.floor((n % 100) / 10); const o = n % 10; if (t === 1 && (o === 5 || o === 6)) { s += o === 5 ? 'טו' : 'טז'; } else { s += tens[t] + ones[o]; } return s.length === 1 ? s + '׳' : s.slice(0, -1) + '״' + s.slice(-1); } // Combined: "פרק כ״ג" (use everywhere a single chapter is named to a user). function chapterLabel(n) { return `פרק ${hebrewNumeral(n)}`; } // ───────── Tanya 5-parts metadata (mirror of server TANYA_PARTS) ───────── // Used both by the CreateModal picker (when /api/tanya/parts is unreachable // — extremely unlikely but cheap to handle) and by the reader header to // resolve a circle chapter # to its part for display. const TANYA_PARTS_CLIENT = [ { id: 'likutei', name: 'לקוטי אמרים', chapters: 53, icon: '📘', shaar: 'ספר של בינונים — פרקי היסוד של עבודת ה׳ לאדם הבינוני' }, { id: 'shaar_yichud', name: 'שער היחוד והאמונה', chapters: 13, icon: '📗', shaar: 'יסוד אחדות ה׳ בכל המציאות — "אין עוד מלבדו" ממש. נפתח ב״חינוך קטן״ וי״ב פרקים.' }, { id: 'iggeret_teshuvah', name: 'אגרת התשובה', chapters: 12, icon: '📙', shaar: 'הדרך לתשובה — שתי בחינות של תשובה תתאה ועילאה' }, { id: 'iggeret_hakodesh', name: 'אגרת הקודש', chapters: 32, icon: '📕', shaar: 'אגרות אדמו"ר הזקן לחסידיו — צדקה, עבודה ודבקות' }, { id: 'kuntres_acharon', name: 'קונטרס אחרון', chapters: 9, icon: '📓', shaar: 'תוספות והשגות על לקוטי אמרים — עומק הסוגיות' }, ]; const TANYA_PART_BY_ID_CLIENT = Object.fromEntries(TANYA_PARTS_CLIENT.map(p => [p.id, p])); // Resolve a circle-chapter (1..total) to the relevant Tanya part for display. // For Tanya circles with no text_parts (legacy created before 2026-05-16), // defaults to ['likutei'] so every Tanya chapter has a known part — this is // what those circles always were conceptually (53 chapters of לקוטי אמרים). // Returns { part_id, part_name, local_chapter } or null if not a Tanya circle. function tanyaPartForChapter(circle, chapter) { if (!circle || circle.text_type !== 'tanya') return null; let parts = circle.text_parts; if (typeof parts === 'string') { try { parts = JSON.parse(parts); } catch { parts = null; } } if (!Array.isArray(parts) || parts.length === 0) { // [damri 2026-05-20] If text_parts is null/empty BUT total_chapters !== 53, // legacy default ['likutei'] is wrong (Likutei has 53). Infer from total. const tot = circle.total_chapters; if (tot === 13) parts = ['shaar_yichud']; else if (tot === 12) parts = ['iggeret_teshuvah']; else if (tot === 32) parts = ['iggeret_hakodesh']; else if (tot === 9) parts = ['kuntres_acharon']; else parts = ['likutei']; try { console.warn('[tanyaPartForChapter] circle', circle.id, 'missing text_parts; inferred', parts, 'from total_chapters=', tot); } catch (_) {} } let offset = 0; for (const id of parts) { const meta = TANYA_PART_BY_ID_CLIENT[id]; if (!meta) continue; if (chapter <= offset + meta.chapters) { return { part_id: id, part_name: meta.name, local_chapter: chapter - offset }; } offset += meta.chapters; } return null; } // In-app display label for a circle chapter. // Tanya base case: " — פרק " using the LOCAL chapter // number inside the part. // Special case — שער היחוד והאמונה chapter 1 is "חינוך קטן" (the intro // that opens "חנוך לנער על פי דרכו"), so we don't call it פרק. Chapters // 2..13 within shaar_yichud display as פרק א׳..י״ב — matching the // traditional numbering even though they live at local index 2..13. function chapterLabelInCircle(circle, ch) { const part = tanyaPartForChapter(circle, ch); if (!part) return chapterLabel(ch); if (part.part_id === 'shaar_yichud') { if (part.local_chapter === 1) return `${part.part_name} — חינוך קטן`; return `${part.part_name} — ${chapterLabel(part.local_chapter - 1)}`; } return `${part.part_name} — ${chapterLabel(part.local_chapter)}`; } // Map a Tanya part_id to the DB collection name where its chapters live. // Server side: see TANYA_PARTS in server/index.js — keep in sync. const TANYA_PART_COLLECTION = { likutei: 'tanya', shaar_yichud: 'tanya_shaar_yichud', iggeret_teshuvah: 'tanya_iggeret_teshuvah', iggeret_hakodesh: 'tanya_iggeret_hakodesh', kuntres_acharon: 'tanya_kuntres_acharon', }; // Where does the text for this circle-chapter actually live in the DB? // Returns { collection, chapter } — the DB collection name AND the local // chapter number within that collection. For non-Tanya circles this is a // pass-through (collection = circle.text_type, chapter unchanged). For // Tanya circles it resolves the part via tanyaPartForChapter and then // maps the part_id to its underlying collection. // Critical because a multi-part Tanya circle uses a single running chapter // index (1..total) on the UI side but the actual text lives across // multiple DB collections — this function bridges between the two. function dbCoordsForChapter(circle, chapter) { if (!circle) return { collection: 'tehillim', chapter }; if (circle.text_type !== 'tanya') { return { collection: circle.text_type || 'tehillim', chapter }; } const part = tanyaPartForChapter(circle, chapter); if (!part) return { collection: 'tanya', chapter }; return { collection: TANYA_PART_COLLECTION[part.part_id] || 'tanya', chapter: part.local_chapter, }; } // Friendly book label for circle-list cards and similar surfaces. // Tehillim/Rambam/Tikkunei Zohar return the obvious Hebrew names. // For Tanya: // single part → 'תניא · ' e.g. 'תניא · שער היחוד והאמונה' // 2+ parts → 'תניא · N שערים' e.g. 'תניא · 3 שערים' // legacy/all → 'תניא · לקוטי אמרים' (default) // This way two Tanya circles in the list never look identical. function circleBookLabel(c) { const tt = (c && c.text_type) || 'tehillim'; if (tt === 'tehillim') return 'תהילים'; if (tt === 'rambam') return 'רמב"ם'; if (tt === 'tikkunei_zohar') return 'תיקוני הזוהר'; if (tt !== 'tanya') return tt; // Tanya: read text_parts let parts = c.text_parts; if (typeof parts === 'string') { try { parts = JSON.parse(parts); } catch { parts = null; } } if (!Array.isArray(parts) || parts.length === 0) parts = ['likutei']; if (parts.length === 1) { const meta = TANYA_PART_BY_ID_CLIENT[parts[0]]; return meta ? `תניא · ${meta.name}` : 'תניא'; } return `תניא · ${parts.length} שערים`; } // Share-message label. Composes a natural Hebrew sentence fragment for // WhatsApp/messaging where the recipient may not know the multi-part // structure of Tanya. For Likutei (the default — "ספר התניא" in colloquial // speech): "פרק כ״ג בתניא". For any other part (where the part name carries // more meaning than "תניא" alone): "פרק ה׳ בשער היחוד והאמונה (תניא)". function chapterShareLabel(circle, ch) { const part = tanyaPartForChapter(circle, ch); if (!part) return `${chapterLabel(ch)} ב${(circle && circle.text_type === 'tehillim') ? 'תהילים' : 'תניא'}`; if (part.part_id === 'likutei') return `${chapterLabel(part.local_chapter)} בתניא`; if (part.part_id === 'shaar_yichud' && part.local_chapter === 1) { return `חינוך קטן (תניא, ${part.part_name})`; } if (part.part_id === 'shaar_yichud') { return `${chapterLabel(part.local_chapter - 1)} ב${part.part_name} (תניא)`; } return `${chapterLabel(part.local_chapter)} ב${part.part_name} (תניא)`; } // ───────── Toast (transient inline notification) ───────── function showToast(text, ms = 2200) { let el = document.getElementById('thl-toast'); if (!el) { el = document.createElement('div'); el.id = 'thl-toast'; el.className = 'thl-toast'; document.body.appendChild(el); } el.textContent = text; el.classList.add('show'); clearTimeout(el._timer); el._timer = setTimeout(() => el.classList.remove('show'), ms); } // ───────── Share modal (desktop fallback) ───────── // ───── [yakir pass 50] UpcomingPage — standalone /upcoming roadmap page ───── // Same data + voting logic as UpcomingModal, but rendered as a full page so // it can be shared via direct URL. Accessible at bayitdavid.com/upcoming function UpcomingPage({ userId, onSignInRequest }) { const [features, setFeatures] = React.useState(null); const [voting, setVoting] = React.useState(null); const load = React.useCallback(() => { const qs = userId ? `?userId=${userId}` : ''; api(`/api/upcoming-features${qs}`) .then(d => setFeatures(d.features || [])) .catch(() => setFeatures([])); }, [userId]); React.useEffect(() => { load(); }, [load]); const vote = async (feature_id) => { if (!userId) { if (onSignInRequest) onSignInRequest(); return; } if (voting === feature_id) return; setVoting(feature_id); try { const r = await api('/api/feature-vote', { method: 'POST', body: { user_id: userId, feature_id } }); if (r && !r.error) { setFeatures(prev => prev.map(f => f.id === feature_id ? { ...f, vote_count: r.vote_count, viewer_voted: r.voted ? 1 : 0 } : f )); } else { showToast(r && r.error ? r.error : 'שגיאה'); } } catch (e) { showToast(e.message || 'שגיאה'); } finally { setVoting(null); } }; return (

🔮 בקרוב — מה כדאי לנו לבנות?

הקול שלך משפיע על הסדר. הצבע למה שחשוב לך לקבל הכי קודם — ונראה איך הקהילה מצביעה ביחד.
{features === null && (
טוען...
)} {features && features.length === 0 && (
אין כרגע פיצ'רים פתוחים להצבעה
)} {features && features.length > 0 && (
{features.map(f => (
{f.icon || '✨'}
{f.title}
{f.description}
))}
)} {!userId && features && features.length > 0 && (
כדי להצביע צריך להזדהות בשם — לחץ "היכנס" למעלה
)}
); } // ───── [yakir pass 49] UpcomingModal — public roadmap with voting ───── // Shows the list of planned features. Each card has icon, title, description, // vote count, and a heart button. Voting toggles - one vote per user per // feature. Anonymous viewers see the list and counts but the vote button // prompts sign-in. function UpcomingModal({ userId, onClose, onSignInRequest }) { const [features, setFeatures] = React.useState(null); const [voting, setVoting] = React.useState(null); // feature_id currently voting const load = React.useCallback(() => { const qs = userId ? `?userId=${userId}` : ''; api(`/api/upcoming-features${qs}`) .then(d => setFeatures(d.features || [])) .catch(() => setFeatures([])); }, [userId]); React.useEffect(() => { load(); }, [load]); const vote = async (feature_id) => { if (!userId) { if (onSignInRequest) onSignInRequest(); return; } if (voting === feature_id) return; setVoting(feature_id); try { const r = await api('/api/feature-vote', { method: 'POST', body: { user_id: userId, feature_id } }); if (r && !r.error) { // Update locally for instant feedback setFeatures(prev => prev.map(f => f.id === feature_id ? { ...f, vote_count: r.vote_count, viewer_voted: r.voted ? 1 : 0 } : f )); } else { showToast(r && r.error ? r.error : 'שגיאה'); } } catch (e) { showToast(e.message || 'שגיאה'); } finally { setVoting(null); } }; return (
{ if (e.target === e.currentTarget) onClose(); }}>
e.stopPropagation()} style={{ position: 'relative' }}>

🔮 בקרוב — מה כדאי לנו לבנות?

הקול שלך משפיע על הסדר. הצבע למה שחשוב לך לקבל הכי קודם.
{features === null && (
טוען...
)} {features && features.length === 0 && (
אין כרגע פיצ'רים פתוחים להצבעה
)} {features && features.length > 0 && (
{features.map(f => (
{f.icon || '✨'}
{f.title}
{f.description}
))}
)} {!userId && features && features.length > 0 && (
כדי להצביע צריך להזדהות בשם 🙂
)}
); } function ShareModal({ data, onClose }) { const { link, title, text } = data; const waText = encodeURIComponent(`${text}\n${link}`); const tgText = encodeURIComponent(text); const tgUrl = encodeURIComponent(link); const copyLink = async () => { try { await navigator.clipboard.writeText(link); showToast('הקישור הועתק ✓'); onClose(); } catch { prompt('העתק את הלינק:', link); } }; return (
e.stopPropagation()}>

שתף את המעגל

{title}
{link}
); } // ───────── Native share with graceful fallback ───────── // Build invite URL using the appropriate door path (per Damri 2026-05-11). // Chained shares keep going through the human door, not /c/:token old route. function _circleDoorPath(textType, token) { const seg = textType === 'tanya' ? 'tanya' : textType === 'tikkunei_zohar' ? 'tikkun-zohar' : (textType === 'tehillim' ? 'tehillim' : null); return seg ? `/${seg}/invite/${encodeURIComponent(token)}` : `/invite/${encodeURIComponent(token)}`; } async function shareCircle(c) { // [lev-hadavar pass 30] Append ?from= so the WhatsApp // OG preview can render personalized title: 'X מזמין/ה אותך למעגל Y'. // Per Damri 2026-05-11: 'חסר הקול של המזמין בתוך ה־preview עצמו.' const fromId = parseInt(localStorage.getItem('tehillim_user_id') || '0', 10); const fromSuffix = fromId > 0 ? `?from=${fromId}` : ''; const link = `${window.location.origin}${_circleDoorPath(c.text_type, c.share_token)}${fromSuffix}`; const title = c.name ? `מעגל: ${c.name}` : 'מעגל תפילה'; // Per Damri 2026-05-11: text is minimal identification; OG card does // the personalization. Avoid duplication between typed body + preview. const text = c.name ? `מעגל ${c.name}${c.purpose ? ' — ' + c.purpose : ''}` : 'מעגל תפילה'; // Native share sheet (mobile) — single tap, opens iOS/Android share UI if (navigator.share) { try { await navigator.share({ title, text, url: link }); return; } catch (e) { if (e && e.name === 'AbortError') return; // user cancelled, no error // fall through to clipboard fallback } } // Desktop fallback — open the dedicated share modal if (typeof window.__openShareModal === 'function') { window.__openShareModal({ link, title, text }); return; } // Last-resort fallback — copy to clipboard with toast try { await navigator.clipboard.writeText(link); showToast('הקישור הועתק ✓'); } catch { prompt('העתק את הלינק:', link); } } // ───────── HeroDoor — the first encounter, per לב הדבר ───────── // Quiet door. Serif headline. One line. One soft entry. Living moment // below. No multi-CTA, no feature grid, no ideology, no token tickers. // ───────── RefInviteBanner — human invite copy ───────── // Per Damri 2026-05-11: 'X פתח לך את הדלת לבית דויד.' One sentence. // No 'invited', no '🎁', no BEU mention, no 'הזכות שלכם תיפתח ביחד'. // Focus on the PLACE that opened, not on system-talk. // Falls back to generic 'חבר פתח לך את הדלת לבית דויד.' if name lookup fails. function RefInviteBanner({ refCode, variant }) { const [firstName, setFirstName] = React.useState(null); React.useEffect(() => { if (!refCode) return; let cancelled = false; api(`/api/refcode/${encodeURIComponent(refCode)}`).then(d => { if (cancelled) return; if (d && d.first_name) setFirstName(d.first_name); }).catch(() => {}); return () => { cancelled = true; }; }, [refCode]); const subject = firstName || 'חבר'; const sentence = `${subject} פתח לך את הדלת לבית דויד.`; if (variant === 'top') { // Anonymous user landing via ref link — small gold strip return (
✦  {sentence}
); } // variant === 'modal' — inside onboarding return (
{sentence}
); } // ───────── InviteDoor — door = WhatsApp card expanded (per Damri 2026-05-11, pass 31) ───────── // 'הדף שמוצג בוואצאפ והדף שנפתח זה לא אותו דף.' // Fix: door HERO matches OG title EXACTLY. The WhatsApp card promises // 'X מזמין/ה אותך למעגל Y' — the door opens by confirming the same // sentence, then expands with the rest of the content. // // Two surfaces, ONE protagonist (the inviter). Same sentence in both. function _doorLine(textType) { if (textType === 'tanya') return 'יש אנשים שמרגישים שיש בתוכם משהו עמוק שעוד לא פגשו.'; if (textType === 'tikkunei_zohar') return 'יש רגעים שצריך לתקן יחד את מה שנשבר בנפרד.'; return 'יש רגעים שאדם לא רוצה להתפלל לבד.'; } function _doorBookLabel(textType) { if (textType === 'tanya') return 'תניא'; if (textType === 'tikkunei_zohar') return 'תיקוני הזוהר'; return 'תהילים'; } function _doorBookIcon(textType) { if (textType === 'tanya') return '📗'; if (textType === 'tikkunei_zohar') return '📕'; return '📖'; } function _progressPhrase(pct, isComplete, hasReaders) { if (isComplete) return 'המעגל הושלם.'; if (pct >= 80) return 'המעגל מתקרב לסיום.'; if (pct >= 30) return 'המעגל בעיצומו.'; if (pct >= 1) return 'המעגל כבר התחיל לנוע.'; if (hasReaders) return 'אנשים כבר נכנסו לכאן.'; return null; } function _doorInvitePath(textType, token) { const seg = textType === 'tanya' ? 'tanya' : textType === 'tikkunei_zohar' ? 'tikkun-zohar' : 'tehillim'; return `/${seg}/invite/${encodeURIComponent(token)}`; } function InviteDoor({ token }) { const [info, setInfo] = React.useState(null); const [err, setErr] = React.useState(null); // Extract ?from= from URL so the door matches the OG card const fromParam = React.useMemo(() => { try { const p = new URLSearchParams(window.location.search).get('from'); const n = parseInt(p, 10); return Number.isFinite(n) && n > 0 ? n : null; } catch { return null; } }, []); React.useEffect(() => { if (!token) return; const q = fromParam ? `?from=${fromParam}` : ''; api(`/api/circle/door/${encodeURIComponent(token)}${q}`).then(d => { if (d && !d.error) setInfo(d); else setErr(d?.error || 'not found'); }).catch(() => setErr('network')); }, [token, fromParam]); if (err) { return (
); } if (!info) { return (
...
); } const enter = () => { // [P0 fix 2026-05-13] Per Yakir: anonymous visitors must land DIRECTLY // on the chapter — no registration prompt. Friend was stuck 2 days. // - Signed-in users keep the explicit /?circle_token= path so the // inviter still gets BEU credit for the referral. // - Anonymous tanya visitors go straight to /read/tanya — the intent // flow there opens the ReadModal for anyone, no sign-in gate. const currentUserId = parseInt(localStorage.getItem('tehillim_user_id') || '0', 10); if (!currentUserId && info && info.text_type === 'tanya') { const ref = fromParam ? `?from=${fromParam}` : ''; window.location.href = `/read/tanya${ref}`; return; } window.location.href = `/?circle_token=${encodeURIComponent(token)}`; }; const total = info.total_chapters || 0; const done = info.chapters_completed || 0; const pct = total ? Math.min(100, Math.round((done / total) * 100)) : 0; const progressText = _progressPhrase(pct, info.is_complete, info.distinct_readers > 0); // Share URL preserves ?from= so chained shares keep their inviter context. // If the current viewer is logged in, they become the new inviter for // anyone they share to. const currentUserId = parseInt(localStorage.getItem('tehillim_user_id') || '0', 10); const shareFromId = currentUserId > 0 ? currentUserId : fromParam; const shareSuffix = shareFromId ? `?from=${shareFromId}` : ''; const shareUrl = `${window.location.origin}${_doorInvitePath(info.text_type, token)}${shareSuffix}`; const shareText = info.name ? `${info.name} — מעגל ${_doorBookLabel(info.text_type)}` : `מעגל ${_doorBookLabel(info.text_type)}`; const waUrl = `https://wa.me/?text=${encodeURIComponent(shareText + ' — ' + shareUrl)}`; const tgUrl = `https://t.me/share/url?url=${encodeURIComponent(shareUrl)}&text=${encodeURIComponent(shareText)}`; const fbUrl = `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(shareUrl)}`; // The hero sentence — IDENTICAL to OG title. // 'X מזמין/ה אותך' when inviter known; opening line as fallback. const inviter = info.inviter_first_name; const heroLine1 = inviter ? `${inviter} מזמין/ה אותך` : 'כאן אנשים נפגשים'; const heroLine2 = inviter ? `למעגל ${_doorBookLabel(info.text_type)}` : `דרך מה שהם קוראים`; // Subtitle — IDENTICAL to OG description. const heroSubtitle = inviter ? 'בוא/י לקרוא יחד איתנו.' : null; return (
); } // ───────── HeroDoor + VisionCommitment (per Damri 2026-05-11, pass 35) ───────── // Damri: 'איך עושים שדף הבית יהיה מרהיב יותר ושאנשים יוכלו לראות // את החזון שלנו והמחויבות שלנו, ושהעיצוב יהיה דומה קצת // לדף נחיתה לפחות בחלק העליון שלו.' // // Home page is Layer 3 territory — public identity surface where the // full vision CAN appear (unlike the door, which is Layer 1). // // Structure: // 1. Hero — dark navy + orbs + shimmer + 2 CTAs + LivingMoment // 2. Vision + 3 commitments — 'why we're here' // (LivingWindow + Circles continue below on the cream body) function VisionAndCommitment({ onPage }) { const commitments = [ { icon: '✦', title: 'שקיפות', desc: 'כל ההוקרה גלויה. אין אלגוריתם נסתר, אין מטרות סמויות.', }, { icon: '🤝', title: 'אנושיות', desc: 'אנשים אמיתיים שנפגשים סביב משמעות. לא משחק, לא נתונים.', }, { icon: '🌿', title: 'שורש', desc: 'מעוגן בספרי היסוד — תניא, תהילים, תיקוני הזוהר.', }, ]; return (
✦ למה אנחנו כאן

אנחנו בונים מרחב שבו אנשים נפגשים דרך לימוד משותף — והמפגש עצמו הופך לערך.

לא ניקוד. לא משחק. אמת אנושית שגלויה לכל.

{commitments.map(c => (
{c.icon}

{c.title}

{c.desc}

))}
); } function HeroDoor({ onSignIn, isSignedIn, onPage }) { return (
{/* Hero — rich landing-page treatment */}
{/* Glowing orbs in background */}
{/* Vision + Commitments — still in dark zone */}
); } // ───────── FeaturedCircleBadge — circle-centric home entry (yakir 2026-05-17) ───────── // Replaces DailyChapterBadge in HeroDoor. Where the previous widget // surfaced "פרק היום: פרק כ״ג", this surfaces the entire circle as // a living project: name, book/part, progress, participants. The whole // card is a single tap target that routes to /tanya — which then // re-introduces the circle as a project before letting the user enter // it. Per Yakir: "Home → 'המעגל הנבחר' → /tanya → hero של המעגל → // כניסה למעגל עצמו". function FeaturedCircleBadge({ onPage }) { const [c, setC] = React.useState(null); React.useEffect(() => { api('/api/circles/featured').then(d => { if (d && d.featured) setC(d.featured); }).catch(() => {}); }, []); if (!c) return null; const bookLbl = circleBookLabel(c); const total = c.total_chapters || 0; const verified = c.verified_count || 0; const parts = c.participants_count || 0; const progress = total > 0 ? Math.round((verified / total) * 100) : 0; return (
onPage && onPage('tanya')} onKeyDown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onPage && onPage('tanya'); } }} >
המעגל הנבחר

{c.name}

📗 {bookLbl}
{verified} / {total} פרקים · {parts} משתתפים {progress > 0 && (<> · {progress}% )}
להיכנס למעגל ←
); } // ───────── DailyChapterBadge — quiet daily-chapter invitation ───────── // Yakir 2026-05-14. Shows today's suggested Tehillim chapter (in Hebrew // letters, e.g. "פרק כ״ג") and, for signed-in users, a soft "ממשיך כבר N // ימים" — deliberately not "streak: X 🔥". shaar.md: no language of // success/measurement. If already read today: a quiet ✓ ackn. function DailyChapterBadge({ onPage }) { const [data, setData] = React.useState(null); React.useEffect(() => { const uid = parseInt(localStorage.getItem('tehillim_user_id') || '0', 10); const url = uid > 0 ? `/api/daily-streak/${uid}` : '/api/daily-chapter'; api(url).then(d => { if (d && !d.error) setData(d); }).catch(() => {}); }, []); if (!data) return null; const ch = data.today_chapter || data.chapter; if (!ch) return null; const streak = data.current_streak || 0; const done = !!data.today_completed; return (
פרק היום {chapterLabel(ch)} {done && ✓}
{streak >= 2 && (
ממשיך כבר {streak} ימים
)} {!done && ( )}
); } // ───────── LivingMoment — one alive number + one recent action ───────── // Subtle. Below the entry button. Fed by /api/community/presence. // The aliveness IS the explanation. function LivingMoment() { const [data, setData] = React.useState(null); React.useEffect(() => { api('/api/community/presence').then(d => { if (d && !d.error) setData(d); }).catch(() => {}); }, []); if (!data) return null; const events = data.events || []; const recent = events[0]; const total = data.today_total_readers || 0; if (total === 0 && !recent) return null; return (
── ✦ ──
{total > 0 && (
{total === 1 ? 'אדם אחד קרא היום' : `${total} אנשים קוראים היום יחד`}
)} {recent && recent.name && recent.action_text && (
{recent.name} {' '}{recent.action_text.length > 50 ? recent.action_text.slice(0, 50) + '…' : recent.action_text}
)}
); } // ───────── WhatHappensHere — invitations, not features ───────── // Per לב הדבר: אם צריך להסביר יותר מדי — זה מוקדם מדי. // Four soft invitations. No tokens, no marketplace, no platform-language. // ───────── LivingWindow — 'מה חי כאן עכשיו' ───────── // Per Damri 2026-05-11: 'פיד חייב להיות איטי ושקט. לא activity feed. // יותר כמו: חלון הצצה לקהילה חיה.' // Replaces WhatHappensHere on home page. Real moments, not marketing. function timeAgoHe(iso) { if (!iso) return ''; // SQLite returns 'YYYY-MM-DD HH:MM:SS' (UTC). Add Z to parse as UTC. const then = new Date(String(iso).replace(' ', 'T') + 'Z'); if (isNaN(then.getTime())) return ''; const now = new Date(); const diffMs = now - then; const mins = Math.floor(diffMs / 60000); if (mins < 5) return 'כעת'; if (mins < 60) return 'לפני כמה דקות'; const hours = Math.floor(mins / 60); if (hours < 3) return 'לפני שעה'; if (hours < 12) { const h = then.getHours(); if (h >= 4 && h < 12) return 'הבוקר'; if (h >= 18 && h < 23) return 'הערב'; return 'השעות האחרונות'; } if (hours < 36) return 'אתמול'; const days = Math.floor(hours / 24); if (days < 7) return `לפני ${days} ימים`; return 'לאחרונה'; } function LivingWindow() { const [events, setEvents] = React.useState(null); React.useEffect(() => { api('/api/living-window').then(d => { if (d && !d.error) setEvents(d.events || []); else setEvents([]); }).catch(() => setEvents([])); }, []); // While loading: render the wrapper at the right size but empty (no skeleton) // so the page doesn't jump when data arrives. if (!events) return null; return (
מה חי כאן עכשיו
{events.length === 0 ? (
השדה שקט הבוקר.
ייתכן שדווקא היום אתה הקול הראשון.
) : (
{events.map((e, i) => (
{e.icon}
{e.text} {e.actor && (e.actor_id ? ( · {e.actor} ) : ( · {e.actor} ))}
{timeAgoHe(e.created_at)}
))}
)} {/* Quiet footer — same shape as before, different message */}
── ✦ ──
אתה יכול להיכנס לכל אחד מהרגעים האלה
); } function WhatHappensHere() { const items = [ { ico: '📖', text: 'קוראים יחד עד שהספר נסגר' }, { ico: '✨', text: 'אנשים פותחים מעגלים סביב מה שכואב להם' }, { ico: '🤝', text: 'אנשים מציעים מה שהשם חנן בהם' }, { ico: '🌱', text: 'אנשים מבקשים עזרה כשחסר' }, ]; return (
מה קורה כאן
{items.map((it, i) => (
{it.ico}
{it.text}
))}
── ✦ ──
כל מי שכאן — נראה
); } function Nav({ onPage, page, isAdmin, isSignedIn, userId, onStartJourney }) { // Order follows user journey: discovery → books → action → earnings → utility → support. // Trimmed per Damri 2026-05-11: 'לא להציג מערכת. להציג דרך חיים אחת // עם כניסות טבעיות.' 6 visible items + signin/admin appended below. // Hidden but reachable via URL/context: // tanya, tikkun-zohar, sefer-revii — accessed via share links and Circles // coins — accessed via Profile (click on '✦ N מטבעות הוקרה') // leaderboard — accessed via LivingMoment click on home // tasks — admins reach through ⚙️ ניהול // Renamed 'קהילה' → 'מה חי בקהילה' — tone shift from social-network feel // to community-aliveness (consciousness change per Damri). const items = [ ['home', '🏠 בית'], // [damri ss#4 2026-05-24] 'מעגלים' removed from nav — circles already at top of home page // ['circles', '⭐ מעגלים'], ['profile', '👤 הפרופיל שלי'], // [damri 2026-05-24 round D] חצר הרבים now lives as a floating widget bottom-right (not nav). // Old route still exists for direct URL access (#/rebbim). // ['rebbim', '🕊️ חצר הרבים'], ['ecosystem', '💎 האקוסיסטם'], ['marketplace', '🌾 מרכז השפע'], ['community', '👥 מי חי בקהילה'], ['transparency', '🌐 מסע הקהילה'], // [yakir-fb#5 2026-05-24] hidden from nav per yakir request - page accessible by URL only // ['journal', '📜 יומן המסע'], ['contact', '✉️ צור קשר'] ]; // Explicit sign-in tab for users who scan the nav for "התחברות" rather // than spotting the gold CTA. Goes at the end of the items list, just // before the admin entry. Renders as a normal-looking link but its // 'signin' key is intercepted in go() to open the modal instead of nav. if (!isSignedIn) items.push(['signin', '🔐 התחברות / הירשם']); if (isAdmin) items.push(['admin', '⚙️ ניהול']); const [open, setOpen] = useState(false); // Close drawer on page change (e.g. user taps a link inside it) // 'circles' is a virtual nav item — go to home, then scroll to #circles anchor. const go = (k) => { if (k === 'signin') { // Sign-in is a modal, not a page. Same handler the gold CTA uses. if (onStartJourney) onStartJourney(); setOpen(false); return; } if (k === 'circles') { onPage('home'); setTimeout(() => { const el = document.getElementById('circles'); if (el) el.scrollIntoView({ behavior: 'smooth', block: 'start' }); }, 80); } else { onPage(k); } setOpen(false); }; // Lock body scroll when drawer is open React.useEffect(() => { document.body.style.overflow = open ? 'hidden' : ''; return () => { document.body.style.overflow = ''; }; }, [open]); return ( <> {/* Mobile drawer */}
setOpen(false)} /> ); } // ───────── 8-step Journey (added 2026-05-04) ───────── function BookProgressBars() { const [books, setBooks] = useState(null); const load = useCallback(() => { api('/api/book-status').then(r => { if (r && Array.isArray(r.books)) setBooks(r.books); }).catch(() => {}); }, []); useEffect(() => { load(); const t = setInterval(load, 30000); // refresh every 30s return () => clearInterval(t); }, [load]); if (!books) return null; return (
🏆 התקדמות קהילתית — מחזור נוכחי
{books.map(b => { const meta = BOOK_META[b.book] || {}; const pct = Math.min(100, Math.round((b.unique_read / b.total_chapters) * 100)); return (
{meta.icon || '📚'} {meta.label || b.book} {b.current_cycle > 1 && ( · מחזור {b.current_cycle} )} {b.unique_read} / {b.total_chapters} פרקים {' · '} 🏆 {b.bonus_per_user} {b.symbol}
{b.participants_count} משתתפים במחזור הזה {b.completion_count > 0 && ` · ${b.completion_count} מחזורים קודמים הושלמו`}
); })}
); } // ───────── UserBadge — visible in nav on every page ───────── // Per Damri 2026-05-10: 'למה כשאני בדף הבית לא רואים איזה משתמש מחובר?' // Small chip in the nav header. Always visible. Click → goes to profile. function UserBadge({ isSignedIn, onClick }) { const [info, setInfo] = React.useState(null); React.useEffect(() => { if (!isSignedIn) { setInfo(null); return; } try { const name = localStorage.getItem('tehillim_user_name') || ''; const sub = localStorage.getItem('tehillim_google_sub') || ''; const uid = localStorage.getItem('tehillim_user_id') || ''; setInfo({ name, hasGoogle: !!sub, uid }); } catch { setInfo(null); } }, [isSignedIn]); if (!isSignedIn || !info) return null; const name = info.name || 'משתמש'; const initial = (name.trim()[0] || '?').toUpperCase(); // Color coded by auth method (matches LoggedInAs in profile) const accent = info.hasGoogle ? '#2ecc71' : '#e67e22'; // [yakir-fb#3 2026-05-24] reduced to circle-only (no name text). // Name shown via title= on hover/long-press; ARIA still announces it. return ( ); } // ───────── LoggedInAs — show how user is authenticated ───────── // Per לב הדבר 2026-05-10: invitation, not warning. No countdown. // No threats about losing data. Open door, gentle light. function LoggedInAs({ profile, onUpgrade }) { if (!profile) return null; const isAnon = !profile.email || String(profile.email).endsWith('@anon.tehillim.local'); const hasGoogle = !!profile.google_sub; const hasPassword = !!profile.has_password; const secured = hasGoogle || (!isAnon && hasPassword); let methodIcon, methodLabel, color, bg; if (hasGoogle) { methodIcon = '🟢'; methodLabel = 'Google'; color = '#2ecc71'; bg = 'rgba(46,204,113,0.10)'; } else if (hasPassword) { methodIcon = '✉️'; methodLabel = 'אימייל'; color = '#3498db'; bg = 'rgba(52,152,219,0.10)'; } else { methodIcon = '🌱'; methodLabel = 'אנונימי'; color = '#a8801f'; bg = 'rgba(168,128,31,0.10)'; } return (
{methodIcon} מחובר/ת כ: {profile.name || 'משתמש'} · {methodLabel}
{!secured && (
רוצה שהמסע שלך ימשיך איתך?
הפרקים שקראת והזכות שנוצרה רשומים. כרגע הכל חי במכשיר הזה בלבד — אם תרצה שזה יילך איתך לכל מכשיר, אפשר לחבר חשבון Google או להירשם בקצרה.
)}
); } // ───────── Notifications Bell — replaces auto-pop banners ───────── // Per Damri: opt-in updates only, no surprise popups. Click bell → panel. // "Dismissed" announcements stored per-user in localStorage so the badge // shows only what's new since last visit. function NotificationsBell({ userId, isSignedIn, onPage }) { // [yakir pass 28] Real inbox bell — connected to /api/notifications/:userId. // Shows accurate unread count, opens a full inbox modal with delete, // mark-read, pagination, and special styling for system_announcement. // Mirrors UpdatesPanel functionality so the bell is a true global inbox. const [open, setOpen] = React.useState(false); const [items, setItems] = React.useState([]); const [unread, setUnread] = React.useState(0); const [total, setTotal] = React.useState(0); const [shown, setShown] = React.useState(15); const [tick, setTick] = React.useState(0); const [busyId, setBusyId] = React.useState(null); // Poll for unread count every 60s while signed in (lightweight) React.useEffect(() => { if (!userId) return; const fetchNow = () => { api(`/api/notifications/${userId}?limit=${shown}&offset=0`).then(d => { if (!d || d.error) return; setItems(Array.isArray(d.items) ? d.items : []); setUnread(d.unread || 0); setTotal(d.total || 0); }).catch(() => {}); }; fetchNow(); if (!open) { const t = setInterval(fetchNow, 60000); return () => clearInterval(t); } }, [userId, tick, shown, open]); // Anonymous: hide the bell entirely (sign-in CTA exists elsewhere) if (!isSignedIn || !userId) return null; const markRead = async (id) => { try { await api(`/api/notifications/${id}/read`, { method: 'PUT' }); setTick(t => t + 1); } catch (_) {} }; const markAllRead = async () => { try { await api(`/api/notifications/${userId}/read-all`, { method: 'PUT' }); setTick(t => t + 1); } catch (_) {} }; const deleteOne = async (id, e) => { if (e) e.stopPropagation(); setBusyId(id); try { setItems(arr => arr.filter(x => x.id !== id)); await api(`/api/notifications/${id}?user_id=${userId}`, { method: 'DELETE' }); setTick(t => t + 1); } catch (_) { setTick(t => t + 1); } finally { setBusyId(null); } }; const clearAllRead = async () => { if (!window.confirm('למחוק את כל ההודעות שכבר נקראו?')) return; try { await api(`/api/notifications/${userId}/clear-read`, { method: 'DELETE' }); setTick(t => t + 1); } catch (_) {} }; const loadMore = () => setShown(s => s + 15); const openLink = (url) => { if (!url) return; setOpen(false); // External URL — full navigation if (!url.startsWith('/') || url.startsWith('//')) { window.location.href = url; return; } // Internal path: take first segment as page name const seg = url.replace(/^\/+/, '').split('/')[0]; // [yakir pass 35] Legacy 'coins' route removed - silently redirect home. if (!seg || seg === 'coins') { if (onPage) onPage('home'); return; } // Known top-level page — navigate in-app via onPage + update hash. if (onPage) { onPage(seg); try { window.location.hash = '#/' + seg; } catch (_) {} return; } // Fallback if no onPage (shouldn't happen) window.location.href = url; }; return ( <> {open && (
setOpen(false)} style={{ position: 'fixed', inset: 0, background: 'rgba(0,0,0,0.65)', zIndex: 9000, display: 'flex', justifyContent: 'center', alignItems: 'flex-start', padding: '60px 16px', }}>
e.stopPropagation()} style={{ background: 'linear-gradient(135deg, #1a1625 0%, #2d1b4e 100%)', border: '1.5px solid rgba(243,198,74,0.35)', borderRadius: 16, padding: '22px 20px', width: '100%', maxWidth: 520, color: '#f0e2bc', boxShadow: '0 20px 60px rgba(0,0,0,0.65), 0 0 40px rgba(243,198,74,0.10)', maxHeight: '82vh', overflowY: 'auto', position: 'relative', }}>
🔔 העדכונים שלי{unread > 0 ? ` · ${unread} חדשים` : total > 0 ? ` · ${total}` : ''}
{unread > 0 && ( )} {items.some(n => n.read) && ( )}
{items.length === 0 ? (
התיבה שקטה — כשמשהו יקרה תדע.
) : (
{items.map(n => (
{ if (!n.read) markRead(n.id); if (n.url) openLink(n.url); }} style={{ padding: '12px 14px', borderRadius: 12, background: n.kind === 'system_announcement' ? (n.read ? 'linear-gradient(135deg, rgba(180,140,250,0.06), rgba(243,198,74,0.04))' : 'linear-gradient(135deg, rgba(180,140,250,0.18), rgba(243,198,74,0.14))') : (n.read ? 'linear-gradient(135deg, rgba(255,255,255,0.025), rgba(243,198,74,0.02))' : 'linear-gradient(135deg, rgba(243,198,74,0.18), rgba(200,151,32,0.10))'), border: n.kind === 'system_announcement' ? (n.read ? '1px solid rgba(180,140,250,0.20)' : '1.5px solid rgba(180,140,250,0.55)') : (n.read ? '1px solid rgba(243,198,74,0.12)' : '1.5px solid rgba(243,198,74,0.55)'), cursor: 'pointer', transition: 'all 0.2s', textAlign: 'right', direction: 'rtl', boxShadow: n.read ? 'none' : (n.kind === 'system_announcement' ? '0 3px 12px rgba(120, 80, 220, 0.22)' : '0 3px 12px rgba(138, 95, 16, 0.20)'), position: 'relative', opacity: busyId === n.id ? 0.4 : 1, }} > {n.kind === 'system_announcement' && (
📣 מערכת
)}
{n.title}
{n.body && (
{n.body}
)}
{(n.created_at || '').replace('T', ' ').slice(0, 16)} {n.url && · פתח ›}
))}
)} {total > items.length && (
)}
)} ); } function ChapterGrid({ circleId }) { // [BOOK-COMPLETION-FIX] Use circle.total_chapters (53 for tanya, 88 for // rambam, 150 for tehillim) instead of hardcoded 150. // [PENDING-MARKER] Distinguish 3 states per chapter: // verified by anyone → 'read' (gold) // my unverified try → 'pending' (sky) — recording captured, didn't pass // else → blank const myUserId = parseInt((typeof localStorage !== 'undefined' && localStorage.getItem('tehillim_user_id')) || '0', 10); const [data, setData] = useState(null); useEffect(() => { api(`/api/circle/${circleId}`).then(c => { const verified = new Set((c.readings || []).filter(r => r.verified === 1).map(r => r.chapter)); const myPending = new Set( (c.readings || []) .filter(r => r.verified === 0 && parseInt(r.reader_id || r.user_id, 10) === myUserId) .map(r => r.chapter) ); setData({ total: c.total_chapters || 150, verified, myPending }); }); }, [circleId]); if (!data) return null; return (
{Array.from({ length: data.total }, (_, i) => i + 1).map(n => { const cls = data.verified.has(n) ? 'read' : (data.myPending.has(n) ? 'pending' : ''); const title = data.verified.has(n) ? `${chapterLabel(n)} — נקרא ואומת` : (data.myPending.has(n) ? `${chapterLabel(n)} — ניסית, לא עבר אימות. אפשר לקרוא שוב.` : chapterLabel(n)); return
{n}
; })}
); } // ───────── Member avatar (Hebrew initials, color-keyed by uid) ───────── function MemberAvatar({ user, size = 28 }) { // Color palette tuned to the gold/cream theme. const palette = ['#d4a017','#a8800a','#b07d3a','#7c5e2c','#9a6b1a','#c08a25','#88611a','#b89033']; const color = palette[(user.id || 0) % palette.length]; const name = (user.name || '?').trim(); // First character of first 1-2 words. Hebrew & latin friendly. const initials = name.split(/\s+/).slice(0, 2).map(w => w[0] || '').join('') || '?'; const inner = (
{initials}
); // [handoff §10 r3 2026-05-24] If user.id is real (>0), link to public profile. if (user && user.id && user.id > 0) { return ( e.stopPropagation()} style={{ display: 'inline-block', lineHeight: 0, textDecoration: 'none' }}> {inner} ); } return inner; } function Circles({ onOpen, refreshKey, onJoin, userId }) { const [circles, setCircles] = useState([]); const [stats, setStats] = useState(null); const [loading, setLoading] = useState(true); const [expanded, setExpanded] = useState(null); // Phase 2: filter & view state const [view, setView] = useState('browse'); // 'browse' | (create handled by onOpen modal) const [textTypeFilter, setTextTypeFilter] = useState('all'); const [searchQ, setSearchQ] = useState(''); const [hideComplete, setHideComplete] = useState(false); // Round 5: default = top 3 most-progressed circles. User can reveal all. const [showAllCircles, setShowAllCircles] = useState(false); const load = useCallback(() => { setLoading(true); Promise.all([api('/api/circles'), api('/api/stats')]) .then(([c, s]) => { setCircles(Array.isArray(c) ? c : []); setStats(s); }) .catch(() => {}) .finally(() => setLoading(false)); }, []); useEffect(() => { load(); }, [load, refreshKey]); // Filter the visible list const filtered = circles.filter(c => { if (textTypeFilter !== 'all' && (c.text_type || 'tehillim') !== textTypeFilter) return false; if (hideComplete && c.is_complete) return false; if (searchQ.trim()) { const q = searchQ.trim().toLowerCase(); const hay = `${c.name || ''} ${c.purpose || ''} ${c.creator_name || ''}`.toLowerCase(); if (!hay.includes(q)) return false; } return true; }); const TYPE_LABELS = { all: 'הכל', tehillim: '\ud83d\udcd6 תהילים', tanya: '\ud83d\udcd7 תניא', rambam: '\ud83d\udcd8 רמב״ם', tikkunei_zohar: '\ud83d\udcd5 תיקוני הזוהר', }; return (

המעגלים

הדרך הישרה להוסיף 🔥

{/* [damri ss#3 2026-05-24] stats strip removed per damri 'מיותר'. State 'stats' still fetched for backward compat (used elsewhere if needed). */} {/* [damri 2026-05-21] Single primary CTA — browse is the default view below. */}
{/* Filter strip — visible when browsing */} {view === 'browse' && (
{/* [damri 2026-05-24 round D] search row FIRST, then book-type chips */}
setSearchQ(e.target.value)} placeholder="חפש לפי שם, מטרה או יוצר..." />
{Object.entries(TYPE_LABELS).map(([k, l]) => ( ))}
)} {loading &&

טוען מעגלים...

} {!loading && circles.length === 0 && (

עדיין אין מעגלים. היה הראשון לפתוח אחד.

)} {!loading && circles.length > 0 && (() => { const hasActiveFilter = !!searchQ.trim() || textTypeFilter !== 'all' || hideComplete; if (!hasActiveFilter && !showAllCircles && circles.length > 3) { return (
⭐ המעגלים המתקדמים ביותר {Math.min(3, circles.length)} מתוך {circles.length}
); } if (hasActiveFilter && filtered.length === 0) { return (

אין מעגלים שתואמים את הסינון.

); } return null; })()}
{(() => { const hasActiveFilter = !!searchQ.trim() || textTypeFilter !== 'all' || hideComplete; if (hasActiveFilter) return filtered; if (showAllCircles) return circles; // Default: top 3 by chapter progress (verified / total) const ranked = [...circles].sort((a, b) => { const pa = (a.verified_count || 0) / Math.max(1, a.total_chapters || 150); const pb = (b.verified_count || 0) / Math.max(1, b.total_chapters || 150); if (pb !== pa) return pb - pa; // Tie-break: more participants first return (b.participants_count || 0) - (a.participants_count || 0); }); return ranked.slice(0, 3); })().map(c => { const top5 = Array.isArray(c.participants_top5) ? c.participants_top5 : []; const totalParts = c.participants_count || 0; const more = Math.max(0, totalParts - top5.length); return (

{c.name} {c.is_complete ? הושלם ✓ : null}

{c.purpose || 'ללא מטרה ספציפית'}
{/* [damri 2026-05-21] avatar instead of bare name */} {(c.creator_name || 'אנונימי').split(' ')[0]}
{/* Member avatars */} {top5.length > 0 && (
{top5.map(u => )} {more > 0 && (
+{more}
)} {c.target_participants ? `${totalParts} / ${c.target_participants} משתתפים` : `${totalParts} משתתפים`}
)}
{Math.min(c.verified_count || 0, c.total_chapters || 150)} / {c.total_chapters || 150} פרקים · {circleBookLabel(c)} {Math.min(100, Math.round(((c.verified_count || 0) / (c.total_chapters || 150)) * 100))}%
{!c.is_complete && (() => { // [damri 2026-05-21] Show the next chapter label inline. const nextCh = Math.min((c.verified_count || 0) + 1, c.total_chapters || 150); const lbl = c.text_type === 'tanya' ? chapterLabelInCircle(c, nextCh) : chapterLabel(nextCh); return ( ); })()} {userId && c.creator_id === userId && ( )} {c.share_token && ( )}
{expanded === c.id && }
); })}
{/* Round 5: reveal-all toggle. Hidden when filter active or <=3 circles. */} {!loading && circles.length > 3 && !(searchQ.trim() || textTypeFilter !== 'all' || hideComplete) && (
)}
); } function CommunityPresence({ refreshKey }) { // [לב הדבר 2026-05-10] Replaces Leaderboard. No rankings, no medals. // 'מי איתך עכשיו' — list of recent activity events from across the // community, plus one human aggregate ('X אנשים קראו היום יחד'). // Auto-refreshes every 30s while visible. const [data, setData] = React.useState(null); const [loading, setLoading] = React.useState(true); const load = () => { api('/api/community/presence').then(d => { if (d && !d.error) setData(d); }).finally(() => setLoading(false)); }; React.useEffect(() => { load(); const t = setInterval(load, 30000); // soft heartbeat return () => clearInterval(t); }, [refreshKey]); // Relative time helper — gentle, no precise minutes const relTime = (iso) => { if (!iso) return ''; try { const ms = Date.now() - Date.parse(iso.replace(' ', 'T') + 'Z'); const min = Math.floor(ms / 60000); if (min < 1) return 'לפני רגע'; if (min < 60) return `לפני ${min} דק׳`; const hr = Math.floor(min / 60); if (hr < 24) return `לפני ${hr} שע׳`; const dy = Math.floor(hr / 24); return `לפני ${dy} ימים`; } catch { return ''; } }; const actionIco = (a) => { if (a === 'read_chapter') return '📖'; if (a === 'opened_circle') return '✨'; if (a === 'offered_gift') return '🤝'; if (a === 'posted_wish') return '🌱'; return '✦'; }; return (

✦ מי איתך עכשיו

נוכחות חיה של הקהילה — לא דירוג, נוכחות.

{!loading && data && (
{data.today_total_readers}
{data.today_total_readers === 1 ? 'אדם קרא היום' : 'אנשים קראו היום יחד'}
)} {loading &&

טוען...

} {!loading && data && (data.events || []).length === 0 && (

הקהילה שקטה כעת. הזמן הכי טוב להתחיל הוא עכשיו.

)} {!loading && data && (data.events || []).length > 0 && (
{data.events.map((e, i) => (
{actionIco(e.action)}
{e.name || 'אנונימי'} {' '}{e.action_text}
{relTime(e.created_at)}
))}
)}
); } function CreatePurposeMic({ onAppend }) { const [recording, setRecording] = useState(false); const [status, setStatus] = useState(''); const recRef = React.useRef(null); const supportedRef = React.useRef(true); React.useEffect(() => { const SR = window.SpeechRecognition || window.webkitSpeechRecognition; const ua = navigator.userAgent || ''; const isSafari = /^((?!chrome|android).)*safari/i.test(ua); const isIOS = /iPad|iPhone|iPod/.test(ua); if (!SR || isSafari || isIOS) supportedRef.current = false; return () => { try { recRef.current && recRef.current.stop(); } catch {} }; }, []); const start = () => { if (!supportedRef.current) { setStatus('זיהוי קולי לא נתמך בדפדפן זה — פתח ב-Chrome'); return; } const SR = window.SpeechRecognition || window.webkitSpeechRecognition; const r = new SR(); r.lang = 'he-IL'; r.continuous = false; r.interimResults = false; r.maxAlternatives = 1; r.onresult = (e) => { const t = (e.results[0] && e.results[0][0] && e.results[0][0].transcript) || ''; if (t.trim()) onAppend(t.trim()); }; r.onerror = (e) => setStatus(e.error === 'not-allowed' ? 'אשר גישה למיקרופון' : 'שגיאת זיהוי: ' + e.error); r.onend = () => { setRecording(false); setStatus(''); recRef.current = null; }; try { r.start(); recRef.current = r; setRecording(true); setStatus('🎙️ מקליט — דבר עכשיו'); } catch { setStatus('כבר מקליט'); } }; const stop = () => { try { recRef.current && recRef.current.stop(); } catch {} }; return (
{status || 'דבר בעברית — הטקסט יתווסף לתיבת המטרה'}
); } // ───────── TextSelector — choose between texts (tehillim/tanya/rambam/zohar) ───────── // Restored 2026-05-16 — was missing from the bundle and create-circle was // crashing silently on render. Now also exposes the `multi` flag so callers // (CreateModal) can decide to show the Tanya parts picker. function TextSelector({ value, onChange }) { const [texts, setTexts] = useState([]); useEffect(() => { api('/api/texts').then(t => setTexts(Array.isArray(t) ? t : [])).catch(() => setTexts([])); }, []); return (
{texts.map(t => ( ))}
); } // ───────── TanyaPartsPicker — "כל ספר התניא נפתח לפני האדם" (Damri 2026-05-16) ───────── // Renders the five parts of the Tanya as selectable cards. Multi-select. The // caller (CreateModal) controls `value` (array of part IDs) and `onChange`. // Quick-action buttons make the most common flows one tap: // • "לקוטי אמרים בלבד" (default — single-part circle, the legacy behaviour) // • "הספר המלא" (all five parts → 118 chapters) // Live sum below the grid: "תסיים יחד 65 פרקים". function TanyaPartsPicker({ value, onChange }) { const [parts, setParts] = React.useState(TANYA_PARTS_CLIENT); const [total, setTotal] = React.useState(TANYA_PARTS_CLIENT.reduce((s, p) => s + p.chapters, 0)); React.useEffect(() => { api('/api/tanya/parts') .then(d => { if (d && Array.isArray(d.parts) && d.parts.length) { setParts(d.parts); setTotal(d.total_all_parts || d.parts.reduce((s, p) => s + p.chapters, 0)); } }) .catch(() => { /* keep the client-side fallback */ }); }, []); const selectedSet = new Set(value || []); const toggle = (id) => { const next = new Set(selectedSet); if (next.has(id)) next.delete(id); else next.add(id); // Preserve canonical order (the order they appear in the source list) onChange(parts.filter(p => next.has(p.id)).map(p => p.id)); }; const selectOnly = (ids) => onChange(parts.filter(p => ids.includes(p.id)).map(p => p.id)); const selectedTotalChapters = parts .filter(p => selectedSet.has(p.id)) .reduce((s, p) => s + p.chapters, 0); const selectedNames = parts .filter(p => selectedSet.has(p.id)) .map(p => p.name); return (
📗 חמשת חלקי התניא — בחר מה ייכנס למעגל
{parts.map(p => { const sel = selectedSet.has(p.id); return ( ); })}
0 ? 'linear-gradient(90deg, rgba(212,175,55,0.10) 0%, rgba(212,175,55,0.04) 100%)' : 'rgba(255,107,157,0.10)', border: `1.5px solid ${selectedTotalChapters > 0 ? 'rgba(212,175,55,0.30)' : 'rgba(255,107,157,0.30)'}`, borderRadius: 10, fontSize: 13, color: selectedTotalChapters > 0 ? '#d4af37' : '#ff6b9d', fontWeight: 600, lineHeight: 1.55, }}> {selectedTotalChapters === 0 ? ( <>בחר לפחות חלק אחד כדי לפתוח מעגל ) : ( <> המעגל יכלול {selectedTotalChapters} פרקים —{' '} {selectedNames.join(' + ')} {' '} (מתוך {total} פרקים שיש בתניא כולו) )}
); } // SefariaBookSuggestions [damri 2026-05-20] // Debounced search against /api/books/search. Shows results inline as a // small list below the 4 default books. Only renders when query is non-empty // and no matches found in the local 4. function SefariaBookSuggestions({ query, onPick }) { const [results, setResults] = React.useState([]); const [loading, setLoading] = React.useState(false); React.useEffect(() => { const q = (query || '').trim(); if (q.length < 2) { setResults([]); return; } // Skip if query matches our 4 local books — no need to hit Sefaria const locals = ['תהילים','תניא','תיקוני הזוהר','משנה תורה','רמב']; if (locals.some(l => l.includes(q) || q.includes(l))) { setResults([]); return; } setLoading(true); const ctl = new AbortController(); const t = setTimeout(() => { fetch('/api/books/search?q=' + encodeURIComponent(q), { signal: ctl.signal }) .then(r => r.json()) .then(d => setResults(Array.isArray(d.results) ? d.results : [])) .catch(() => setResults([])) .finally(() => setLoading(false)); }, 350); return () => { clearTimeout(t); ctl.abort(); }; }, [query]); if (!query || query.trim().length < 2) return null; if (loading) return
מחפש ב-Sefaria...
; if (results.length === 0) return null; return (
📚 ספרים נוספים מ-Sefaria:
{results.slice(0, 12).map((r, i) => ( ))}
); } // CreateModal v2 [damri 2026-05-20] // Council guidance: design must feel like honor + joy. Bonus = appreciation, // not prize. Multiple paths to be seen. Heart-warming, not gamified. // // 9 improvements applied: // 1. Book selection — searchable visual grid // 2. "כוונת המעגל" replaces "מטרת המעגל" // 3. Image upload (hero image) // 4. Story field — "הסיפור מאחורי המעגל" // 5. Generic copy (not "תהילים" specific) // 6. System bonus per completer (display only — system-set) // 7. Creator can prepay community bonus pot // 8. WhatsApp link from creator // 9. Layout cleanup — single scrollable modal function CreateModal({ onClose, onCreated }) { const [name, setName] = useState(''); const [intention, setIntention] = useState(''); const [storyMd, setStoryMd] = useState(''); const [textType, setTextType] = useState({ id: 'tehillim', name: 'תהילים', chapters: 150, icon: '📖' }); const [tanyaParts, setTanyaParts] = useState(['likutei']); const [targetParticipants, setTargetParticipants] = useState(''); const [whatsappUrl, setWhatsappUrl] = useState(''); const [bonusPrepay, setBonusPrepay] = useState(0); const [heroImageB64, setHeroImageB64] = useState(null); const [heroImagePreview, setHeroImagePreview] = useState(null); const [heroImageMime, setHeroImageMime] = useState(null); const [bookSearch, setBookSearch] = useState(''); const [busy, setBusy] = useState(false); const [err, setErr] = useState(''); // System-set bonus per completer (display only — fixed by system per book type) const SYSTEM_BONUS_PER_COMPLETER = { tehillim: 50, tanya: 100, tikkunei_zohar: 80, rambam: 60, }; const systemBonus = SYSTEM_BONUS_PER_COMPLETER[textType.id] || 50; const liveTotalChapters = (() => { if (textType.id !== 'tanya') return textType.chapters; return TANYA_PARTS_CLIENT .filter(p => tanyaParts.includes(p.id)) .reduce((s, p) => s + p.chapters, 0); })(); const ALL_BOOKS = [ { id: 'tehillim', name: 'תהילים', chapters: 150, icon: '📖', desc: 'מאה חמישים פרקים של דוד המלך' }, { id: 'tanya', name: 'תניא', chapters: 53, icon: '🔥', desc: 'ספר היסוד של חב״ד' }, { id: 'tikkunei_zohar',name: 'תיקוני הזוהר', chapters: 70, icon: '✨', desc: 'שבעים תיקונים על פסוק "בראשית"' }, { id: 'rambam', name: 'משנה תורה', chapters: 365, icon: '📜', desc: 'יום-יומי, סדר הלכתי שלם' }, ]; const filteredBooks = bookSearch.trim() ? ALL_BOOKS.filter(b => b.name.includes(bookSearch.trim()) || b.desc.includes(bookSearch.trim())) : ALL_BOOKS; const handleImagePick = (e) => { const f = e.target.files && e.target.files[0]; if (!f) return; if (f.size > 5 * 1024 * 1024) { setErr('תמונה גדולה מ-5MB.'); return; } const reader = new FileReader(); reader.onload = (ev) => { const dataUrl = ev.target.result; setHeroImagePreview(dataUrl); setHeroImageMime(f.type); const comma = dataUrl.indexOf(','); setHeroImageB64(comma > 0 ? dataUrl.substring(comma + 1) : dataUrl); }; reader.readAsDataURL(f); }; const submit = async () => { if (!name.trim()) { setErr('שם המעגל חובה'); return; } if (textType.id === 'tanya' && tanyaParts.length === 0) { setErr('בחר לפחות חלק אחד מהתניא'); return; } setBusy(true); setErr(''); try { const creator_id = parseInt(localStorage.getItem('tehillim_user_id') || '1', 10); let tp = null; if (targetParticipants !== '') { const n = parseInt(targetParticipants, 10); if (Number.isFinite(n) && n >= 1 && n <= 1000) tp = n; } const body = { name: name.trim(), purpose: intention.trim(), // keep legacy field name for backend compat intention: intention.trim(), story_md: storyMd.trim() || null, whatsapp_url: whatsappUrl.trim() || null, bonus_per_completer_beu: systemBonus, creator_bonus_prepay_beu: parseInt(bonusPrepay, 10) || 0, creator_id, text_type: textType.id, total_chapters: liveTotalChapters, target_participants: tp, }; if (textType.id === 'tanya') body.text_parts = tanyaParts; const c = await api('/api/circle', { method: 'POST', body }); if (c.error) throw new Error(c.error); // Upload image if any if (heroImageB64 && c.id) { try { await fetch(`/api/circles/${c.id}/upload-image`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ image_b64: heroImageB64, mime: heroImageMime }), }); } catch {} // non-fatal — circle is created } onCreated(c); } catch (e) { setErr(e.message || 'שגיאה'); } finally { setBusy(false); } }; return (
e.stopPropagation()} style={{ maxWidth: 640, maxHeight: '92vh', overflowY: 'auto', direction: 'rtl' }}> × {/* Hero header — council guidance: feel honored, not gamified */}
🕯️

פתיחת מעגל

מעגל הוא תפילה קולקטיבית — כמה אנשים נוטלים על עצמם ספר ביחד.
כל פרק שנקרא — מטבע. כל סיום — הוקרה.

{/* 1. Book selection — visual cards + search (with Sefaria fallback) */} setBookSearch(e.target.value)} style={{ marginBottom: 8 }} />
{filteredBooks.map(b => ( ))}
{ // Custom book from Sefaria → become text_type 'sefaria:', user fills chapters manually setTextType({ id: 'sefaria:' + b.key, name: b.he_title || b.title, chapters: 100, icon: '📚', desc: 'Sefaria · ' + b.title }); setBookSearch(''); }} /> {textType.id === 'tanya' && ( )} {/* Name */} setName(e.target.value)} placeholder="לדוגמה: מעגל לרפואת אבא" /> {/* 2. Intention (renamed from purpose) */}