/* Me2You - Driver App: Job Board, Active Delivery, Earnings, Ratings */ /* global React, Icon, StatusTag, Price, panelStyle, btnPrimary, btnGhost, btnDanger, btnSmall, DRIVER_JOBS */ const { useState } = React; function DriverApp({ onBack }) { const [tab, setTab] = useState('jobs'); const [onDuty, setOnDuty] = useState(false); const [accepted, setAccepted] = useState(null); const tabs = [ { key:'jobs', label:'Jobs', icon:'package' }, { key:'active', label:'Active', icon:'navigation' }, { key:'earnings', label:'Earnings', icon:'wallet' }, { key:'ratings', label:'Ratings', icon:'star' }, { key:'settings', label:'Me', icon:'user-round' }, ]; return (
{/* Driver header */}
Job board
Bongani K. - Scooter
{tab === 'jobs' && { setAccepted(j); setTab('active'); }}/>} {tab === 'active' && { setAccepted(null); setTab('jobs'); }}/>} {tab === 'earnings' && } {tab === 'ratings' && } {tab === 'settings' && }
{/* Bottom nav */}
); } function DriverJobs({ onDuty, onAccept }) { const available = DRIVER_JOBS.filter(j => j.status === 'available'); if (!onDuty) return (

You're off duty

Toggle On duty to start receiving jobs in your service area.

); return (

{available.length} jobs near you

{available.map(j => (
{j.item}
R {j.pay}
{j.id}
Pickup: {j.pickup}
Drop: {j.dropoff}
~{j.distance} ~{j.time}
))}
); } function DriverActive({ job, onDeliver }) { const [step, setStep] = useState(0); // 0=heading to pickup, 1=picked up, 2=delivering if (!job) return (

No active delivery

Accept a job from the board to get started.

); const steps = ['Head to pickup','Picked up','Delivering']; return (
{job.item}
{step === 0 && `Head to pickup: ${job.pickup}`} {step === 1 && 'Confirm you have the parcel'} {step === 2 && `Delivering to: ${job.dropoff}`}
{steps.map((s,i) => (
))}
{step < 2 ? ( ) : ( )}
{/* Live driver map */}
Payout R {job.pay}
); } function DriverEarnings() { const earnings = [ { date:'28 Apr', item:'Hisense TV delivery', amount:45, status:'paid' }, { date:'27 Apr', item:'School blazer delivery', amount:30, status:'paid' }, { date:'26 Apr', item:'PS4 Slim delivery', amount:35, status:'pending' }, { date:'25 Apr', item:'Drill set delivery', amount:60, status:'paid' }, { date:'24 Apr', item:'Cast-iron pot delivery', amount:55, status:'paid' }, ]; const total = earnings.reduce((s,e) => s + e.amount, 0); return (
This week
R {total}
{earnings.length} deliveries
{earnings.map((e,i) => (
{e.item}
{e.date}
R {e.amount}
))}
); } function DriverRatings() { const reviews = [ { buyer:'Nomsa M.', stars:5, comment:'Super fast, very friendly!', date:'28 Apr' }, { buyer:'Thandi K.', stars:5, comment:'Handled with care.', date:'27 Apr' }, { buyer:'James R.', stars:4, comment:'Good delivery, bit late though.', date:'26 Apr' }, { buyer:'Siya N.', stars:5, comment:'', date:'25 Apr' }, ]; return (
4.8
- {reviews.length} ratings
{reviews.map((r,i) => (
{r.buyer} {[1,2,3,4,5].map(n => )}
{r.comment &&

{r.comment}

}
{r.date}
))}
); } function DriverSettings() { return (
BK
Bongani K.
driver@m2y.online - Scooter

Service areas

{['Soweto','Sandton','Randburg','Roodepoort','Midrand'].map(s => ( {s} ))}
96%
Acceptance
100%
Completion
94%
On time
); } Object.assign(window, { DriverApp });