// Search results — card grid (no operator grouping), with Grid / Map view toggle.
const PRE_ORDER_LABELS = {
none: null,
optional: { short: 'Pre-order available', title: 'This venue publishes a menu — you can add guest selections during booking.' },
menu: { short: 'Menu pre-order required', title: 'Guests must choose menu items before this booking can be submitted.' },
package: { short: 'Package required', title: 'A package must be added to this booking before it can be submitted.' },
packageAndMenu: { short: 'Pre-order required', title: 'Either a package or menu selections must be added before this booking can be submitted.' },
};
function ResultsScreen({ query, setQuery, onSearch, onBook, onBack, onPickSuggestion, searching = false, searchError = null }) {
const [view, setView] = React.useState('grid');
// The results list + cards render from the COMMITTED `query`. The sticky
// search bar edits a local draft instead, so editing date / guests /
// product / operator does NOT re-run the search — nothing changes until the
// partner presses the search icon (onSubmit commits the draft). Re-sync the
// draft whenever the committed query changes from outside (e.g. an omni
// suggestion pick, which is an explicit commit).
const [draft, setDraft] = React.useState(query);
React.useEffect(() => { setDraft(query); }, [query]);
const text = (query.text || '').trim().toLowerCase();
const vibe = (query.vibe || '').trim().toLowerCase();
const area = (query.area || '').trim().toLowerCase();
const near = query.near;
// Build the filter as two passes:
// 1. Hard pass — city, operator, productType, near-radius, area substring.
// 2. Soft pass — apply vibe / free-text on top, but only when at least one
// result still matches. This stops a single fuzzy keyword wiping every
// otherwise-valid result (e.g. vibe="London Eye" against a Lunch
// catalogue that no venue's name mentions).
// Tiered filter: hard signals (city / operator / productType / near-radius)
// must always pass. Area / vibe / free-text are soft signals applied
// greedily — if all soft signals together yield 0 results we fall back to
// hard-only, so partners always see something rather than a blank page.
const matchesHard = (v) => {
if (query.venueId && v.id !== query.venueId) return false;
if (query.location && query.location !== 'All locations' && v.city !== query.location) return false;
if (query.operatorId && v.operator !== query.operatorId) return false;
if (query.productType && !v.products.includes(query.productType)) return false;
if (near && Number.isFinite(v.lat) && Number.isFinite(v.lng)) {
const d = ppHaversineKm(near.lat, near.lng, v.lat, v.lng);
if (d > (near.radiusKm || 5)) return false;
} else if (near) {
return false;
}
return true;
};
// Searchable text per venue. Beyond the headline fields we fold in the
// product taxonomy names and the pre-order menu/package data (menu + item +
// package names and descriptions) so dish-level terms like "fish and chips"
// or "sunday roast" can match. Normalised via ppNorm so punctuation and
// ampersands ("Fish & Chips") don't block a match.
const norm = (typeof ppNorm === 'function')
? ppNorm
: (s) => (s || '').toString().toLowerCase().replace(/[^a-z0-9\s]/g, ' ').replace(/\s+/g, ' ').trim();
const SOFT_STOP = new Set(['and', 'the', 'with', 'for', 'a', 'an', 'of', 'in', 'on', 'at', 'to', 'that', 'does', 'do']);
// Needle matches when every significant token appears somewhere in the hay.
const tokenHit = (hay, needle) => {
const toks = norm(needle).split(' ').filter(t => t && !SOFT_STOP.has(t));
if (!toks.length) return true;
return toks.every(t => hay.includes(t));
};
// Coerce arrays / object-maps / strings / missing into a flat list so a
// mixed payload shape (e.g. productNames keyed by productId) can't throw.
const asList = (typeof ppValues === 'function')
? ppValues
: (x) => Array.isArray(x) ? x : (x && typeof x === 'object') ? Object.values(x) : (x != null && x !== '') ? [x] : [];
const hayOf = (v) => {
const op = operatorById(v.operator);
const pre = v.preorders || {};
const menuText = asList(pre.menus).flatMap(m => [
m.name, m.description, ...(asList(m.items).flatMap(it => [it.name, it.description])),
]);
const pkgText = asList(pre.packages).flatMap(p => [p.name, p.description]);
return norm([
v.name, v.description, v.city, v.area, op && op.name,
...asList(v.productNames), ...menuText, ...pkgText,
].filter(Boolean).join(' '));
};
const matchesSoft = (v) => {
const hay = hayOf(v);
if (area && !tokenHit(hay, area)) return false;
if (vibe && !tokenHit(hay, vibe)) return false;
if (text && !vibe && !near && !tokenHit(hay, text)) return false;
return true;
};
const hardMatches = VENUES.filter(matchesHard);
const softMatches = hardMatches.filter(matchesSoft);
const filtered = softMatches.length > 0 ? softMatches : hardMatches;
const droppedSoftSignals = softMatches.length === 0 && hardMatches.length > 0 && (area || vibe || (text && !vibe && !near));
// Sort by distance when a near anchor is set.
if (near) {
filtered.sort((a, b) => ppHaversineKm(near.lat, near.lng, a.lat || 0, a.lng || 0) - ppHaversineKm(near.lat, near.lng, b.lat || 0, b.lng || 0));
}
// One card per venue. The card itself carries an inline product switcher
// so the partner can pick which of the venue's products to view times for
// — fixes "click an operator, see a random product" by surfacing every
// product the venue offers as a chip on the card.
const cards = filtered
.map(v => {
const products = (v.products || []).filter(Boolean);
if (!products.length) return null;
const initialProductId = (query.productType && products.includes(query.productType))
? query.productType
: products[0];
return { venue: v, products, productId: initialProductId };
})
.filter(Boolean);
return (
{cards.length} {cards.length === 1 ? 'venue' : 'venues'}
{query.searched ? ' with availability' : ' in this catalogue'}
{ e.currentTarget.style.display = 'none'; e.currentTarget.parentNode.classList.remove('has-photo'); }}/>
)}
{(!venue.photos || !venue.photos[0]) && (
)}