{/* Back Link */}

BACK TO FIND WORKERS {/* Quick Profile Actions */}

{/* Header Card with Clean Premium White BG */}

{worker.photo ? ( {worker.name}

) : ( )}

{worker.name}

{worker.verified && ( Verified )} {/* Availability Status Badge */} {availabilityStatus}

{/* Emirates ID verification status bar & Visa Status */}

{worker.emirates_id_status}

{worker.visa_status && (worker.visa_status.toLowerCase().includes('tourist') || worker.visa_status.toLowerCase().includes('visit')) ? (

{worker.visa_status} (Warning: Visit Visa)

) : worker.visa_status && worker.visa_status.toLowerCase().includes('cancelled') ? (

{worker.visa_status} (Warning: Cancelled)

) : (

{worker.visa_status}

)}

{worker.nationality} • {worker.age} Years Old • {worker.category}

{worker.rating} / 5.0 ({workerReviews.length} reviews)

{/* Sponsor Actions Block */}

{/* Stage 3 Connect: Start In-App Chat */} Start Direct Chat {/* Stage 4 Hire: Mark Hired (Finalize Hiring Direct Flow) */}

{/* Main Details Grid */}

{/* Left Column: Quick Stats */}

Sponsorship Details

Salary Expectations

{worker.salary} AED / mo

Availability Status

{availabilityStatus}

Work Experience

{worker.experience}

Preferred Job Type

{worker.preferred_job_type}

Emirates ID Vetting

{worker.emirates_id_status}

Visa Status

{worker.visa_status}

Medical Health Test

PASSED CERTIFIED

{/* Languages Spoken with visual flags */}

Languages Spoken

{worker.languages?.map(lang => ( {getLanguageFlag(lang)} {lang} ))}

{/* Right Column: Bio & Skills */}

{/* Professional Summary */}

Professional Summary

"{worker.bio}"

{/* Verified Skills & Competencies */}

Verified Skills & Competencies

{worker.skills?.map(skill => (

{skill}

))}

{/* Verified Documents Section */}

Verified Legal Documents (UAE MOHRE Vetted)

{/* Document Card: Passport */}

Passport (Verified)

Click zoom

Document ID

L82739102-UAE

Issue

12 Jan 2021

Expiry

11 Jan 2031

OCR Match

95%

{/* Document Card: Emirates ID */}

Emirates ID (PDPL Compliant)

Scan Purged UAE PDPL compliant

Verification Type

Emirates ID OCR

Status

{worker.emirates_id_status}

Physical Scan Storage

Permanently Purged

{/* Document Card: Visa */}

Entry Visa (Verified) {worker.visa_status && (worker.visa_status.toLowerCase().includes('tourist') || worker.visa_status.toLowerCase().includes('visit') || worker.visa_status.toLowerCase().includes('cancelled')) ? ( ) : ( )}

Click zoom

Visa Category

{worker.visa_status}

Vetting status

{worker.visa_status && (worker.visa_status.toLowerCase().includes('tourist') || worker.visa_status.toLowerCase().includes('visit')) ? ( Transfer Required ) : worker.visa_status && worker.visa_status.toLowerCase().includes('cancelled') ? ( Needs Regularization ) : ( <> Clear Records )}

{/* Star Ratings & Trust Review logs */}

Sponsor Reviews & Star Ratings

Ratings can only be posted by verified sponsors who completed verified direct hiring.

{/* Reviews List */}

{workerReviews.map((review) => (

{review.employer_name} {review.date}

{[...Array(5)].map((_, i) => ( ))}

"{review.comment}"

))}

{/* Similar Recommendations Slider */}

Similar Recommended Workers

{worker.similar_workers?.map((sim) => (

{sim.name}

{sim.nationality} • {sim.category}

{sim.availability_status}

{sim.salary} AED/mo View Profile →

))}

{/* Stage 4/5 Hired Flow Success Modal Overlay */} {showHiredModal && (

Direct Sponsoring Finalized!

{worker.name} is successfully marked as Hired under your sponsorship! This direct matching conforms exactly with Stage 4 of our UAE MOHRE zero-middlemen flow.

Next Step: Stage 5 Post-Hire Review

Help the UAE community hire safely by posting an anonymous review describing {worker.name}'s childcare, cooking, driving, or domestic skills.

Back to Worker Directory

)} {/* Report Abuse Modal Overlay */} {showReportModal && (

Report Vetting Abuse / Terms Violation

We maintain zero-tolerance for fake documentation, independent recruiters trading cash, or incorrect contact details.

Reason

Additional context details

setReportDetails(e.target.value)}
                                    placeholder="Provide detailed specifics of what happened..."
                                    className="w-full p-2.5 border border-slate-300 rounded-xl text-xs focus:outline-none"
                                />
                            </div>
                        </div>

<div className="flex justify-end space-x-2 pt-2 text-xs font-bold">
                            <button 
                                type="button" 
                                onClick={() => setShowReportModal(false)}
                                className="px-4 py-2 border border-slate-200 hover:bg-slate-50 rounded-lg"
                            >
                                Cancel
                            </button>
                            <button 
                                type="submit" 
                                className="px-4 py-2 bg-rose-600 text-white hover:bg-rose-700 rounded-lg shadow-sm"
                            >
                                Submit Compliance Report
                            </button>
                        </div>
                    </form>
                </div>
            )}

{/* Trust Review Modal Overlay */}
            {showReviewModal && (
                <div className="fixed inset-0 bg-slate-900/60 backdrop-blur-xs flex items-center justify-center p-4 z-50 animate-fade-in">
                    <form onSubmit={handleReviewSubmit} className="bg-white rounded-3xl w-full max-w-md p-6 relative animate-zoom-in space-y-4 border border-slate-200 shadow-2xl">
                        <button
                            type="button"
                            onClick={() => setShowReviewModal(false)}
                            className="absolute top-4 right-4 text-slate-400 hover:text-slate-600"
                        >
                            <X className="w-5 h-5" />
                        </button>
                        
                        <div className="flex items-center space-x-2 text-[#185FA5]">
                            <Star className="w-5 h-5 text-amber-500 fill-amber-500" />
                            <h4 className="font-black text-sm uppercase">Submit a Verified Performance Review</h4>
                        </div>
                        
                        <p className="text-xs text-slate-500 leading-relaxed">
                            Your feedback helps other sponsors make secure and direct hiring choices.
                        </p>

<div className="space-y-3">
                            <div className="space-y-1">
                                <label className="text-[10px] font-black text-slate-400 uppercase tracking-widest block">Star Rating</label>
                                <div className="flex items-center space-x-1.5">
                                    {[1, 2, 3, 4, 5].map((star) => (
                                        <button
                                            key={star}
                                            type="button"
                                            onClick={() => setNewRating(star)}
                                            className="p-1 hover:scale-110 transition-transform"
                                        >
                                            <Star 
                                                className={`w-8 h-8 ${star <= newRating ? 'text-amber-500 fill-amber-500' : 'text-slate-200'}`} 
                                            />
                                        </button>
                                    ))}
                                </div>
                            </div>

<div className="space-y-1">
                                <label className="text-[10px] font-black text-slate-400 uppercase tracking-widest">Share Your Experience</label>
                                <textarea
                                    rows="3"
                                    value={newComment}
                                    onChange={(e) => setNewComment(e.target.value)}
                                    placeholder="Tell other sponsors about childcare skills, cleaning, cooking style, driving safety, etc..."
                                    className="w-full p-2.5 border border-slate-300 rounded-xl text-xs focus:outline-none"
                                />
                            </div>
                        </div>

<div className="flex justify-end space-x-2 pt-2 text-xs font-bold">
                            <button 
                                type="button" 
                                onClick={() => setShowReviewModal(false)}
                                className="px-4 py-2 border border-slate-200 hover:bg-slate-50 rounded-lg"
                            >
                                Cancel
                            </button>
                            <button 
                                type="submit" 
                                className="px-4 py-2 bg-[#185FA5] text-white hover:bg-[#144f8a] rounded-lg shadow-sm"
                            >
                                Post Trust Review
                            </button>
                        </div>
                    </form>
                </div>
            )}

</EmployerLayout>
    );
}