/* ── Zafa — Guest advertiser: Post an Ad (intro → form → pay → thank you) ── */ /* duration options + pricing (one-time flat fee, AED) */ const AD_DURATIONS = [ { id: 'week1', days: 7, fee: 15, en: '1 week', ar: 'أسبوع' }, { id: 'days15', days: 15, fee: 100, en: '15 days', ar: '15 يوماً' }, { id: 'month1', days: 30, fee: 279, en: '1 month', ar: 'شهر' }, { id: 'custom', days: null, fee: null, en: 'Custom', ar: 'مخصّص' }]; const BOOST_FEE = 20; const customFee = (days) => Math.max(1, Math.round(Number(days) || 0)) * 2; // AED 2/day /* ── Intro / explainer ── */ function PostAdInfo() { const { lang, t, pop, push } = useZafa(); const points = L(lang, ['Open to any user who isn\u2019t an active vendor', 'Choose 1 week, 15 days, or 1 month', 'One-time flat fee — never a subscription', 'Reviewed by our team before going live', 'Approved ads appear alongside vendor listings'], ['متاح لأي مستخدم ليس مزوّداً نشطاً', 'اختر أسبوعاً أو ١٥ يوماً أو شهراً', 'رسوم ثابتة لمرّة واحدة — بلا اشتراك', 'تتم مراجعته من فريقنا قبل النشر', 'تظهر الإعلانات المعتمدة بجانب المزوّدين']); return (
{t('forEveryone')}

{L(lang, 'Get your products seen', 'اجعل منتجاتك مرئية')}

{L(lang, 'Any registered user who isn\u2019t an active vendor can post a short-term advertisement — perfect for individuals or businesses who want temporary visibility without a subscription. Pay a one-time fee, and boost your ad for even more reach.', 'يمكن لأي مستخدم مسجّل ليس مزوّداً نشطاً نشر إعلان قصير المدى — مثالي للأفراد أو الشركات الراغبين بظهور مؤقت دون اشتراك. ادفع رسماً واحداً، ويمكنك ترويج إعلانك لمزيد من الوصول.')}

{points.map((p, i) =>
{p}
)}
push({ name: 'postadform' })}>{t('startPosting')}
); } /* small labeled field */ function AdField({ label, hint, children }) { return ( ); } /* ── The form (+ pay + thank you states) ── */ function PostAdForm() { const { lang, t, pop, setTab } = useZafa(); const rtl = lang === 'ar'; const [state, setState] = React.useState('form'); // form | pay | processing | thankyou const [outcome, setOutcome] = React.useState('success'); // fields const [name, setName] = React.useState(''); const [details, setDetails] = React.useState(''); const [loc, setLoc] = React.useState('Dubai'); const [contact, setContact] = React.useState(''); const [waToggle, setWaToggle] = React.useState(true); const [area, setArea] = React.useState(['Dubai']); const [langs, setLangs] = React.useState(['English']); const [avail, setAvail] = React.useState(''); const [services, setServices] = React.useState(''); const [dur, setDur] = React.useState('week1'); const [customDays, setCustomDays] = React.useState(''); const [boost, setBoost] = React.useState('regular'); const [photos, setPhotos] = React.useState([false, false, false, false]); // filled flags (slots droppable regardless) const [extraPhotos, setExtraPhotos] = React.useState(0); // additional photo slots beyond the cover // payment fields const [card, setCard] = React.useState('');const [exp, setExp] = React.useState('');const [cvv, setCvv] = React.useState('');const [cName, setCName] = React.useState(''); const durObj = AD_DURATIONS.find((d) => d.id === dur); const listingFee = dur === 'custom' ? customFee(customDays) : durObj.fee; const boostFee = boost === 'boost' ? BOOST_FEE : 0; const total = listingFee + boostFee; const langOpts = ['English', 'العربية']; const formValid = name.trim() && details.trim() && contact.trim() && (dur !== 'custom' || Number(customDays) > 0); const fmtCard = (s) => s.replace(/\D/g, '').slice(0, 16).replace(/(.{4})/g, '$1 ').trim(); const fmtExp = (s) => {const d = s.replace(/\D/g, '').slice(0, 4);return d.length > 2 ? d.slice(0, 2) + '/' + d.slice(2) : d;}; const payValid = card.replace(/\s/g, '').length >= 16 && exp.length === 5 && cvv.length >= 3 && cName.length > 1; const pay = () => {setState('processing');setTimeout(() => setState(outcome === 'success' ? 'thankyou' : 'payfail'), 1700);}; /* ---------- THANK YOU ---------- */ if (state === 'thankyou') { return (

{t('adThankYou')}

{t('adThankSub')}

{name || L(lang, 'Your ad', 'إعلانك')} AED {total.toLocaleString()}
{t('underReview')}
{setTab('home');}}>{L(lang, 'Back to home', 'العودة للرئيسية')} {setTab('profile');}}>{t('backToProfile')}
); } /* ---------- PAY FAIL ---------- */ if (state === 'payfail') { return (

{t('payFailed')}

{t('payFailedSub')}

setState('pay')}>{t('tryAgain')}
); } /* ---------- PAYMENT ---------- */ if (state === 'pay' || state === 'processing') { return (
setState('form')} />
{/* summary */}

{t('adSummary')}

{boostFee > 0 && }
{t('total')}} v={AED {total.toLocaleString()}} />

{t('oneTime')}

{/* card */}
setCard(fmtCard(e.target.value))} placeholder="1234 5678 9012 3456" style={{ direction: 'ltr' }} />
setExp(fmtExp(e.target.value))} placeholder="MM/YY" style={{ direction: 'ltr' }} /> setCvv(e.target.value.replace(/\D/g, '').slice(0, 4))} placeholder="•••" style={{ direction: 'ltr' }} />
setCName(e.target.value)} placeholder={L(lang, 'Full name', 'الاسم الكامل')} />

{L(lang, 'DEMO · simulate outcome', 'تجربة · محاكاة النتيجة')}

setOutcome('success')}>{L(lang, 'Success', 'نجاح')} setOutcome('failed')}>{L(lang, 'Decline', 'رفض')}
{state === 'processing' ? : <>{t('payNow')} AED {total.toLocaleString()}}
); } /* ---------- FORM ---------- */ return (
setName(e.target.value)} placeholder={L(lang, 'e.g. Handmade favors & dates kiosk', 'مثال: كشك هدايا وتمور يدوية')} />