/* Me2You - Community hub: "what's happening" feed of updates, events and
safety alerts. Join a group, then post or RSVP. Members' local listings
still sell through escrow. Strictly C2C. */
/* global React, Icon, Price, PRODUCTS, btnPrimary, btnGhost, panelStyle */
const { useState: useCmtyState } = React;
const CMTY_GROUP = { name:'Soweto buy & sell', members:1240, kind:'Public local group' };
/* Each post kind carries icon + colour + word (triple redundancy) */
const POST_KINDS = {
update: { label:'Update', icon:'megaphone', bg:'var(--info-100)', fg:'var(--info)' },
event: { label:'Event', icon:'calendar', bg:'var(--success-100)', fg:'var(--success)' },
alert: { label:'Safety alert', icon:'triangle-alert', bg:'var(--danger-100)', fg:'var(--danger)' },
};
const CMTY_POSTS = [
{ id:1, kind:'update', author:'Lerato N.', time:'1h',
body:'Stock of school shoes back in, sizes 3 to 7. Message me for sizes.' },
{ id:2, kind:'event', author:'Group admin', time:'Sat 30 May',
body:'Vilakazi St market day. 09:00 to 13:00. Bring small change.', rsvp:38, when:'09:00, 30 May' },
{ id:3, kind:'alert', author:'Group admin', time:'3h',
body:'Meet buyers at the Maponya Mall pickup desk, never at home. Stay safe.' },
{ id:4, kind:'update', author:'Gogo B.', time:'5h',
body:'Fresh vetkoek every morning this week. R 60 a dozen, collect in Tembisa.' },
];
function PostKindTag({ kind }) {
const k = POST_KINDS[kind] || POST_KINDS.update;
return (
{k.label}
);
}
/* Post composer / RSVP shown once a member has joined */
function CommunityComposer({ onPost }) {
const [kind, setKind] = useCmtyState('update');
const [rsvp, setRsvp] = useCmtyState(null);
const event = CMTY_POSTS.find(p => p.kind === 'event');
return (
You joined {CMTY_GROUP.name}. You can post and RSVP.
Post type
{Object.keys(POST_KINDS).map(k => (
))}
{/* RSVP to the upcoming event */}
{event && (
{event.body.split('.')[0]}
- {event.when}
{['Going','Maybe','Cannot make it'].map(r => (
))}
)}
);
}
function CommunityPost({ post }) {
return (
{post.author}
{post.body}
{post.kind==='event' && (
{post.rsvp} going
)}
);
}
/* --- Community hub screen --- */
function CommunityScreen({ onShop }) {
const [joined, setJoined] = useCmtyState(false);
const local = PRODUCTS.filter(p => p.location === 'Soweto' || p.seller === 'Mama K.' || p.seller === 'Gogo B.').slice(0, 4);
return (
Community
What is happening near you. Join a group to post, RSVP and see members' listings.
{/* Group header + Join */}
{CMTY_GROUP.name}
{CMTY_GROUP.members.toLocaleString('en-ZA')} members - {CMTY_GROUP.kind}
{joined &&
{}}/>}
What is happening
{CMTY_POSTS.map(p => )}
{/* Sidebar: members + local listings */}
);
}
Object.assign(window, { CommunityScreen, CommunityPost, CommunityComposer, PostKindTag });