// ==================================================================== // LISTINGS, tabbed deep-dive: Overview, Directories, Edit Info, // Photos, AI Visibility, Analytics. Reviews live on their own page. // ==================================================================== (function () { const { useState, useEffect, useMemo } = React; // ---------- shared bits ---------- const SectionLabel = ({ children, count }) => (
{children}
{count && {count}}
); function Pill({ tone = 'neutral', children, size = 'sm' }) { const map = { ok: { bg: 'var(--sage-soft)', col: 'var(--sage)' }, warn: { bg: 'var(--marigold-soft)', col: '#917200' }, bad: { bg: 'var(--berry-soft)', col: '#a12118' }, info: { bg: 'var(--sky-soft)', col: 'var(--sky)' }, neutral: { bg: 'var(--cream)', col: 'var(--ink-3)' }, violet: { bg: 'rgba(77,105,137,0.12)', col: 'var(--violet)' }, }; const t = map[tone] || map.neutral; return ( {children} ); } // ---------- Hero ---------- function ListingsHero({ d, onTab, onScan, scanning }) { return (
{/* Score ring */}
{d.score}
Score
{/* Stats */}
Listing health · {d.score}/100 Top 24% of FreshNest system · ↑ {d.scoreDelta} this wk
2 issues need attention · Last scan: today 7:02 AM · 42 directories monitored
{[ { v: '40', l: 'Live ✓', c: 'var(--sage)' }, { v: d.napAccuracy + '%', l: 'NAP', c: 'var(--cream)' }, { v: '2', l: 'Issues', c: 'var(--marigold)' }, { v: d.aiScore, l: 'AI Score', c: 'var(--violet)' }, { v: d.avgRating + '★', l: 'Avg Rating', c: 'var(--cream)' }, { v: d.totalReviews, l: 'Reviews', c: 'var(--cream)' }, ].map((s, i, arr) => (
{s.v}
{s.l}
{i < arr.length - 1 &&
} ))}
{/* Actions */}
); } // ---------- Lenny alert ---------- function IssueAlert({ d, onFix }) { return (
2 issues found that could hurt your local search rankings
GBP URL missing, the #1 field AI platforms use to verify your location. Google Sunday hours show 8 PM but your profile says 9 PM, publisher overwrite detected.
); } // ==================================================================== // TAB: OVERVIEW // ==================================================================== function OverviewTab({ data, d, onTab, onForceSync }) { return ( <> Issues requiring attention
{d.issues.map((iss, i) => (
{iss.severity === 'high' ? ( ) : ( )}
{iss.title}
{iss.body}
{iss.impact}
))}
{/* Publisher grid */} All directories, live status
{data.listings.map((l, i) => { const tone = l.status === 'live' ? 'ok' : 'warn'; return (
{l.name}
{l.fields}
); })}
Source: Google Business Profile {/* NAP trend */} NAP accuracy, last 6 months
Name · Address · Phone consistency
Checked daily across all 42 directories
{d.napAccuracy}% current
{d.napTrend.map((v, i) => (
{v}
))}
OctNovDecJanFebMar
); } // ==================================================================== // TAB: DIRECTORIES (filterable, controlled vs influence) // ==================================================================== function DirectoriesTab({ data, onDetail }) { const [statusFilter, setStatusFilter] = useState('all'); const [typeFilter, setTypeFilter] = useState('all'); const [search, setSearch] = useState(''); const filter = (rows) => rows.filter(l => (statusFilter === 'all' || l.status === statusFilter) && (typeFilter === 'all' || l.type === typeFilter) && (!search || l.name.toLowerCase().includes(search.toLowerCase())) ); const controlled = filter(data.listings.filter(l => l.controlled)); const influence = filter(data.listings.filter(l => !l.controlled)); const renderRow = (l, i, kind) => ( onDetail(l)} style={{ cursor: 'pointer' }}> {l.name} {l.type} {l.status === 'live' ? '● Live' : '⚠ ' + (l.controlled ? 'Issue' : 'Drift')} {l.lastSync} {l.fields} ); return ( <> {/* Filter bar */}
setSearch(e.target.value)} placeholder="Search directories…" style={{ flex: 1, minWidth: 200, padding: '7px 12px', border: '1px solid var(--cream-3)', borderRadius: 8, fontSize: 12, fontFamily: 'var(--ff-ui)', background: 'var(--paper)' }}/> {controlled.length + influence.length} of {data.listings.length}
{/* Controlled */}
Directories we control
Direct API connection, edits sync within minutes. If data is wrong here, we fix it immediately.
{controlled.map((l, i) => renderRow(l, i, 'controlled'))}
DirectoryTypeStatusLast syncFields
{/* Influence */}
Directories we influence
We push data but can't control timing, these run on their own refresh cycles (days to weeks). Outdated data here means the directory hasn't processed our update yet.
{influence.map((l, i) => renderRow(l, i, 'influence'))}
DirectoryTypeStatusLast syncFields
); } // ==================================================================== // TAB: EDIT INFO // ==================================================================== function EditTab({ d, dirty, setDirty, onSave }) { const [info, setInfo] = useState(d.info); useEffect(() => { setInfo(d.info); }, [d.info]); const upd = (k, v) => { setInfo({ ...info, [k]: v }); setDirty(true); }; const updHour = (i, k, v) => { const next = [...info.hours]; next[i] = { ...next[i], [k]: v }; setInfo({ ...info, hours: next }); setDirty(true); }; const Field = ({ label, locked, error, children, hint }) => (
{children} {hint &&
{hint}
}
); const inp = (val, on, locked) => ({ value: val, onChange: e => on(e.target.value), readOnly: locked, style: { width: '100%', padding: '9px 11px', fontSize: 13, fontFamily: 'var(--ff-ui)', border: '1px solid var(--cream-3)', borderRadius: 8, background: locked ? 'var(--cream)' : 'var(--paper)', color: locked ? 'var(--ink-4)' : 'var(--ink)', boxSizing: 'border-box', outline: 'none', }, }); return ( <>
Update once, sync everywhere. Changes push to all 42 directories within minutes. Fields marked 🔒 are controlled by your brand.
{/* LEFT */}
{/* Business info */}
Business information Synced 7:02 AM
{}, true)}/> upd('address', v))}/>
upd('city', v))}/> upd('state', v))}/> upd('zip', v))}/>
upd('phone', v))}/> upd('website', v))}/> upd('gbpUrl', e.target.value)} placeholder="https://g.co/kgs/..." style={{ width: '100%', padding: '9px 11px', fontSize: 13, fontFamily: 'var(--ff-ui)', border: '2px solid var(--terra)', borderRadius: 8, background: 'var(--paper)', boxSizing: 'border-box', outline: 'none', }}/>
{/* Hours */}
Business hours
Day
Opens
Closes
{info.hours.map((h, i) => (
{h.day}
updHour(i, 'open', e.target.value)} style={{ padding: '6px 8px', border: '1px solid var(--cream-3)', borderRadius: 6, fontSize: 12, fontFamily: 'var(--ff-ui)', outline: 'none', background: 'var(--paper)' }}/> updHour(i, 'close', e.target.value)} style={{ padding: '6px 8px', border: h.flag ? '2px solid var(--marigold)' : '1px solid var(--cream-3)', borderRadius: 6, fontSize: 12, fontFamily: 'var(--ff-ui)', outline: 'none', background: 'var(--paper)' }}/> ))}
{info.hours.find(h => h.flag) && (
⚠ {info.hours.find(h => h.flag).flag}
)}
{/* Special hours */}
Special hours & closures
Override regular hours on specific dates, synced to Google, Apple Maps, Yelp.
{info.specialHours.map((sh, i) => (
{sh.date} {sh.hours}
))}
{/* RIGHT */}
{/* Description */}
Description & categories