// Men's squad. First Team = eye-catching player cards (home-shirt graphic + // sponsor). Reserves = condensed list. No shirt numbers (by request). const POS_ORDER = ['GK', 'DEF', 'MID', 'ATT']; const POS_LABEL = { GK: 'Goalkeepers', DEF: 'Defenders', MID: 'Midfielders', ATT: 'Forwards' }; const surnameOf = (name) => { const parts = name.trim().split(' '); return parts[parts.length - 1]; }; // Home-shirt graphic with the player's surname across it. const KitShirt = ({ surname }) => ( ); // Sponsor strip: logo (falls back to company name text if file not present yet). const CardSponsor = ({ player }) => { const [failed, setFailed] = React.useState(false); if (!player.sponsor) { const surname = surnameOf(player.name).toUpperCase(); // Send people to the enquiry form with "Sponsor" pre-selected and a // description naming this player. App listens for this event. const requestSponsor = () => window.dispatchEvent(new CustomEvent('wren:sponsor', { detail: { player: player.name } })); return ( ); } return (
SPONSORED BY
{(player.sponsorLogo && !failed) ? ( {player.sponsor} setFailed(true)} style={{ maxWidth: '100%', maxHeight: 32, objectFit: 'contain', display: 'block' }} /> ) : (
{player.sponsor.toUpperCase()}
)}
); }; const PlayerCard = ({ p }) => (
{ e.currentTarget.style.transform = 'translateY(-5px)'; e.currentTarget.style.boxShadow = '0 14px 30px rgba(0,0,0,0.45)'; }} onMouseLeave={(e) => { e.currentTarget.style.transform = 'none'; e.currentTarget.style.boxShadow = 'none'; }} >
WRENS ’26/27 {p.pos}
{p.name.split(' ').slice(0, -1).join(' ')}
{surnameOf(p.name).toUpperCase()}
); const FirstTeamCards = ({ players }) => (
{POS_ORDER.map(pos => { const list = players.filter(p => p.pos === pos); if (!list.length) return null; return (
{POS_LABEL[pos].toUpperCase()} · {list.length}
{list.map((p, i) => )}
); })}
); // Reserves — condensed list grouped by position. const ReserveRow = ({ p }) => (
{p.name} {p.sponsor && · {p.sponsor.toUpperCase()}} {p.pos}
); const ReservesList = ({ players }) => (
{POS_ORDER.map(pos => { const list = players.filter(p => p.pos === pos); if (!list.length) return null; return (
{POS_LABEL[pos].toUpperCase()} · {list.length}
{list.map((p, i) => )}
); })}
); const MensSquad = () => { const first = MENS_SQUAD.filter(p => p.squad === 'first'); const reserves = MENS_SQUAD.filter(p => p.squad === 'reserves'); return ( <> {/* First Team — dark, bold player cards */}
{first.length} players in red. Want your business on a card? Hit “Sponsor” on any open player, pay £50 via SumUp, and pop their name in at checkout.

} />
{/* Reserves — condensed */}
{reserves.length} PLAYERS } />
); }; Object.assign(window, { MensSquad });