npm - @burdenoff/microfe-atheletebridge - Versions diffs - 2026.614.1 → 2026.625.1 - Mend

@burdenoff/microfe-atheletebridge 2026.614.1 → 2026.625.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (110) hide show

package/dist/atheletebridge/pages/worker/WorkerProfilePage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WorkerProfilePage.js","names":[],"sources":["../../../../src/atheletebridge/pages/worker/WorkerProfilePage.tsx"],"sourcesContent":["/*\n Worker Profile Page\n \n Full-featured profile page with:\n * - 6 sidebar tabs: Personal Info, Work Details, Address, Documents, Achievements, Notifications\n * - Edit/Save/Cancel mode toggle with all form fields becoming editable\n * - Profile image upload with camera icon overlay\n * - Personal Info: first/last name, email, phone, DOB + Emergency Contact\n * - Work Details: Employee ID, Designation, Department, Work Location, Joining Date, Employment Type + 3 stat cards\n * - Address tab: Current address + Permanent address with \"same as current\" checkbox\n * - Documents tab: PAN, Aadhar (masked, readonly), Bank Name, Account Number, IFSC Code + security notice\n * - Achievements tab: badges + Performance Metrics with progress bars\n * - Notifications tab: 5 toggle switches for notification preferences\n \n @module atheletebridge/pages/worker\n /\n\nimport { useState, type ChangeEvent } from 'react';\nimport {\n User,\n Phone,\n Briefcase,\n MapPin,\n CreditCard,\n Award,\n Bell,\n Camera,\n Save,\n X,\n Pencil,\n Loader2,\n Clock,\n Shield,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { useAthleteBridge } from '../../context/AthleteBridgeContext';\nimport { mockWorker } from '../../mocks/users';\nimport { mockWorkerStats } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ntype ProfileTab = 'personal' \| 'work' \| 'address' \| 'documents' \| 'achievements' \| 'notifications';\n\ninterface WorkerProfile {\n firstName: string;\n lastName: string;\n email: string;\n phone: string;\n profileImage: string;\n dateOfBirth: string;\n employeeId: string;\n designation: string;\n department: string;\n workLocation: string;\n joiningDate: string;\n employmentType: string;\n currentAddress: string;\n city: string;\n state: string;\n pincode: string;\n permanentAddress: string;\n sameAsCurrent: boolean;\n emergencyContactName: string;\n emergencyContactPhone: string;\n emergencyContactRelation: string;\n bankName: string;\n accountNumber: string;\n ifscCode: string;\n panNumber: string;\n aadharNumber: string;\n}\n\ninterface NotificationPref {\n id: string;\n label: string;\n description: string;\n enabled: boolean;\n}\n\n// ============================================================================\n// Tab Configuration\n// ============================================================================\n\nconst tabs: { id: ProfileTab; label: string; icon: typeof User }[] = [\n { id: 'personal', label: 'Personal Info', icon: User },\n { id: 'work', label: 'Work Details', icon: Briefcase },\n { id: 'address', label: 'Address', icon: MapPin },\n { id: 'documents', label: 'Documents', icon: CreditCard },\n { id: 'achievements', label: 'Achievements', icon: Award },\n { id: 'notifications', label: 'Notifications', icon: Bell },\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const WorkerProfilePage = () => {\n const { navigateTo } = useAthleteBridge();\n const [activeTab, setActiveTab] = useState<ProfileTab>('personal');\n const [isEditing, setIsEditing] = useState(false);\n const [isSaving, setIsSaving] = useState(false);\n\n const [profile, setProfile] = useState<WorkerProfile>({\n firstName: mockWorker.firstName \|\| 'Suresh',\n lastName: mockWorker.lastName \|\| 'Kumar',\n email: mockWorker.email \|\| 'suresh.worker@example.com',\n phone: mockWorker.phone \|\| '+91-87654-32109',\n profileImage: mockWorker.profilePicture \|\| '',\n dateOfBirth: '1990-05-15',\n employeeId: 'EMP-2024-001',\n designation: 'Delivery Executive',\n department: 'Operations',\n workLocation: 'Koramangala Zone',\n joiningDate: '2023-01-10',\n employmentType: 'Full Time',\n currentAddress: '45, 2nd Main, BTM Layout',\n city: 'Bangalore',\n state: 'Karnataka',\n pincode: '560076',\n permanentAddress: '',\n sameAsCurrent: true,\n emergencyContactName: 'Lakshmi Kumar',\n emergencyContactPhone: '+91-98765-12345',\n emergencyContactRelation: 'Spouse',\n bankName: 'HDFC Bank',\n accountNumber: '*5678',\n ifscCode: 'HDFC0001234',\n panNumber: 'ABCDEF',\n aadharNumber: '*5678',\n });\n\n const [notifications, setNotifications] = useState<NotificationPref[]>([\n {\n id: 'orders',\n label: 'New Order Assignments',\n description: 'Get notified when new orders are assigned to you',\n enabled: true,\n },\n {\n id: 'schedule',\n label: 'Schedule Updates',\n description: 'Changes to your work schedule',\n enabled: true,\n },\n {\n id: 'earnings',\n label: 'Earnings Updates',\n description: 'Daily and weekly earnings summaries',\n enabled: true,\n },\n {\n id: 'performance',\n label: 'Performance Reviews',\n description: 'Feedback and performance metrics',\n enabled: true,\n },\n {\n id: 'announcements',\n label: 'Company Announcements',\n description: 'Important updates from management',\n enabled: true,\n },\n ]);\n\n const handleInputChange = (field: keyof WorkerProfile, value: string \| boolean) => {\n setProfile((prev) => ({ ...prev, [field]: value }));\n };\n\n const handleSave = () => {\n setIsSaving(true);\n setTimeout(() => {\n setIsSaving(false);\n setIsEditing(false);\n alert('Profile updated successfully!');\n }, 1000);\n };\n\n const handleImageUpload = (e: ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0];\n if (file) {\n const reader = new FileReader();\n reader.onloadend = () => {\n setProfile((prev) => ({ ...prev, profileImage: reader.result as string }));\n };\n reader.readAsDataURL(file);\n }\n };\n\n const toggleNotification = (id: string) => {\n if (!isEditing) return;\n setNotifications((prev) => prev.map((n) => (n.id === id ? { ...n, enabled: !n.enabled } : n)));\n };\n\n return (\n <PageLayout\n title=\"My Profile\"\n description=\"Manage your profile information\"\n actions={\n <div className=\"flex items-center gap-2\">\n {!isEditing ? (\n <button\n type=\"button\"\n onClick={() => setIsEditing(true)}\n className=\"inline-flex items-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-medium text-foreground hover:bg-accent/80 transition-colors\"\n >\n <Pencil className=\"h-4 w-4\" />\n Edit Profile\n </button>\n ) : (\n <>\n <button\n type=\"button\"\n onClick={() => setIsEditing(false)}\n className=\"inline-flex items-center gap-2 rounded-md bg-accent px-3 py-2 text-sm font-medium text-foreground hover:bg-accent/80 transition-colors\"\n >\n <X className=\"h-4 w-4\" />\n Cancel\n </button>\n <button\n type=\"button\"\n onClick={handleSave}\n disabled={isSaving}\n className=\"inline-flex items-center gap-2 rounded-md bg-blue-500/10 px-3 py-2 text-sm font-medium text-blue-600 dark:text-blue-400 hover:bg-blue-500/20 transition-colors disabled:opacity-50\"\n >\n {isSaving ? (\n <>\n <Loader2 className=\"h-4 w-4 animate-spin\" />\n Saving...\n </>\n ) : (\n <>\n <Save className=\"h-4 w-4\" />\n Save Changes\n </>\n )}\n </button>\n </>\n )}\n </div>\n }\n >\n <div className=\"grid lg:grid-cols-4 gap-6 max-w-6xl\">\n {/ Sidebar /}\n <div className=\"lg:col-span-1 space-y-4\">\n {/ Profile Card /}\n <div className=\"rounded-lg border border-border bg-card p-5 shadow-sm text-center\">\n <div className=\"relative inline-block\">\n <div className=\"h-20 w-20 rounded-full bg-muted overflow-hidden mx-auto\">\n {profile.profileImage ? (\n <img\n src={profile.profileImage}\n alt={`${profile.firstName} ${profile.lastName}`}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div className=\"flex h-full w-full items-center justify-center text-muted-foreground\">\n <User className=\"h-10 w-10\" />\n </div>\n )}\n </div>\n {isEditing && (\n <label className=\"absolute bottom-0 right-0 flex h-7 w-7 items-center justify-center rounded-full bg-blue-500/20 text-blue-600 dark:text-blue-400 cursor-pointer hover:bg-blue-500/30 transition-colors\">\n <Camera className=\"h-3.5 w-3.5\" />\n <input\n type=\"file\"\n accept=\"image/\"\n onChange={handleImageUpload}\n className=\"hidden\"\n />\n </label>\n )}\n </div>\n <h3 className=\"mt-3 text-sm font-semibold text-foreground\">\n {profile.firstName} {profile.lastName}\n </h3>\n <p className=\"text-xs text-muted-foreground\">{profile.designation}</p>\n <p className=\"text-[10px] text-muted-foreground mt-0.5\">{profile.employeeId}</p>\n </div>\n\n {/* Tab Navigation /}\n <div className=\"space-y-1\">\n {tabs.map((tab) => {\n const Icon = tab.icon;\n return (\n <button\n key={tab.id}\n type=\"button\"\n onClick={() => setActiveTab(tab.id)}\n className={cn(\n 'w-full flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors',\n activeTab === tab.id\n ? 'bg-blue-500/10 text-blue-600 dark:text-blue-400'\n : 'bg-card text-foreground hover:bg-muted'\n )}\n >\n <Icon className=\"h-4 w-4\" />\n {tab.label}\n </button>\n );\n })}\n </div>\n </div>\n\n {/ Content Area /}\n <div className=\"lg:col-span-3\">\n <div className=\"rounded-lg border border-border bg-card p-6 shadow-sm\">\n {/ ============= Personal Info ============= /}\n {activeTab === 'personal' && (\n <div>\n <h2 className=\"text-lg font-semibold text-foreground mb-5\">Personal Information</h2>\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n First Name\n </label>\n <input\n type=\"text\"\n value={profile.firstName}\n onChange={(e) => handleInputChange('firstName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Last Name\n </label>\n <input\n type=\"text\"\n value={profile.lastName}\n onChange={(e) => handleInputChange('lastName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Email Address\n </label>\n <input\n type=\"email\"\n value={profile.email}\n onChange={(e) => handleInputChange('email', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Phone Number\n </label>\n <input\n type=\"text\"\n value={profile.phone}\n onChange={(e) => handleInputChange('phone', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Date of Birth\n </label>\n <input\n type=\"date\"\n value={profile.dateOfBirth}\n onChange={(e) => handleInputChange('dateOfBirth', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n\n {/ Emergency Contact /}\n <div className=\"mt-7\">\n <h3 className=\"text-sm font-semibold text-foreground mb-4\">Emergency Contact</h3>\n <div className=\"grid sm:grid-cols-3 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Contact Name\n </label>\n <input\n type=\"text\"\n value={profile.emergencyContactName}\n onChange={(e) => handleInputChange('emergencyContactName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Contact Phone\n </label>\n <input\n type=\"text\"\n value={profile.emergencyContactPhone}\n onChange={(e) => handleInputChange('emergencyContactPhone', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Relationship\n </label>\n <input\n type=\"text\"\n value={profile.emergencyContactRelation}\n onChange={(e) =>\n handleInputChange('emergencyContactRelation', e.target.value)\n }\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Work Details ============= /}\n {activeTab === 'work' && (\n <div>\n <h2 className=\"text-lg font-semibold text-foreground mb-5\">Work Details</h2>\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Employee ID\n </label>\n <input\n type=\"text\"\n value={profile.employeeId}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Designation\n </label>\n <input\n type=\"text\"\n value={profile.designation}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Department\n </label>\n <input\n type=\"text\"\n value={profile.department}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Work Location\n </label>\n <input\n type=\"text\"\n value={profile.workLocation}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Joining Date\n </label>\n <input\n type=\"date\"\n value={profile.joiningDate}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Employment Type\n </label>\n <input\n type=\"text\"\n value={profile.employmentType}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n </div>\n\n {/ Performance Stats /}\n <div className=\"mt-7 grid sm:grid-cols-3 gap-4\">\n <div className=\"rounded-lg bg-muted/50 p-4 text-center\">\n <p className=\"text-2xl font-bold text-blue-600 dark:text-blue-400\">\n {mockWorkerStats.totalDeliveries}\n </p>\n <p className=\"text-xs text-muted-foreground\">Total Deliveries</p>\n </div>\n <div className=\"rounded-lg bg-muted/50 p-4 text-center\">\n <p className=\"text-2xl font-bold text-green-600 dark:text-green-400\">\n {mockWorkerStats.averageRating}\n </p>\n <p className=\"text-xs text-muted-foreground\">Average Rating</p>\n </div>\n <div className=\"rounded-lg bg-muted/50 p-4 text-center\">\n <p className=\"text-2xl font-bold text-blue-600 dark:text-blue-400\">\n {mockWorkerStats.completionRate}%\n </p>\n <p className=\"text-xs text-muted-foreground\">On-Time Delivery</p>\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Address ============= /}\n {activeTab === 'address' && (\n <div>\n <h2 className=\"text-lg font-semibold text-foreground mb-5\">Address Information</h2>\n\n <div className=\"space-y-6\">\n {/ Current Address /}\n <div>\n <h3 className=\"text-sm font-semibold text-foreground mb-3\">Current Address</h3>\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div className=\"sm:col-span-2\">\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Address Line\n </label>\n <textarea\n rows={2}\n value={profile.currentAddress}\n onChange={(e) => handleInputChange('currentAddress', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40 resize-none\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n City\n </label>\n <input\n type=\"text\"\n value={profile.city}\n onChange={(e) => handleInputChange('city', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n State\n </label>\n <input\n type=\"text\"\n value={profile.state}\n onChange={(e) => handleInputChange('state', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Pincode\n </label>\n <input\n type=\"text\"\n value={profile.pincode}\n onChange={(e) => handleInputChange('pincode', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n </div>\n\n {/ Permanent Address /}\n <div>\n <h3 className=\"text-sm font-semibold text-foreground mb-3\">\n Permanent Address\n </h3>\n <label className=\"flex items-center gap-2 mb-3 cursor-pointer\">\n <input\n type=\"checkbox\"\n checked={profile.sameAsCurrent}\n onChange={(e) => handleInputChange('sameAsCurrent', e.target.checked)}\n disabled={!isEditing}\n className=\"h-4 w-4 rounded border-border text-blue-600 focus:ring-blue-500/40\"\n />\n <span className=\"text-xs text-foreground\">Same as current address</span>\n </label>\n {!profile.sameAsCurrent && (\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Address Line\n </label>\n <textarea\n rows={2}\n value={profile.permanentAddress}\n onChange={(e) => handleInputChange('permanentAddress', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40 resize-none\"\n />\n </div>\n )}\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Documents ============= /}\n {activeTab === 'documents' && (\n <div>\n <h2 className=\"text-lg font-semibold text-foreground mb-5\">Documents & Banking</h2>\n\n <div className=\"rounded-lg bg-yellow-500/10 border border-yellow-500/20 p-3 mb-5\">\n <p className=\"text-xs text-yellow-600 dark:text-yellow-400 flex items-center gap-2\">\n <Shield className=\"h-4 w-4 shrink-0\" />\n Your documents and banking information are encrypted and secure.\n </p>\n </div>\n\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n PAN Number\n </label>\n <input\n type=\"text\"\n value={profile.panNumber}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Aadhar Number\n </label>\n <input\n type=\"text\"\n value={profile.aadharNumber}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Bank Name\n </label>\n <input\n type=\"text\"\n value={profile.bankName}\n onChange={(e) => handleInputChange('bankName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n Account Number\n </label>\n <input\n type=\"text\"\n value={profile.accountNumber}\n disabled\n className=\"w-full rounded-md border border-border bg-muted px-3 py-2 text-sm text-foreground cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-muted-foreground mb-1\">\n IFSC Code\n </label>\n <input\n type=\"text\"\n value={profile.ifscCode}\n onChange={(e) => handleInputChange('ifscCode', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground disabled:bg-muted disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Achievements ============= /}\n {activeTab === 'achievements' && (\n <div>\n <h2 className=\"text-lg font-semibold text-foreground mb-5\">\n Achievements & Recognition\n </h2>\n\n {/ Achievement Badges /}\n <div className=\"grid sm:grid-cols-2 gap-4 mb-7\">\n <div className=\"rounded-lg bg-yellow-500/5 border border-yellow-500/20 p-5 text-center\">\n <Award className=\"h-10 w-10 text-yellow-600 dark:text-yellow-400 mx-auto mb-2\" />\n <h3 className=\"text-sm font-semibold text-foreground\">Employee of the Month</h3>\n <p className=\"text-xs text-muted-foreground mt-1\">December 2023</p>\n </div>\n <div className=\"rounded-lg bg-blue-500/5 border border-blue-500/20 p-5 text-center\">\n <Clock className=\"h-10 w-10 text-blue-600 dark:text-blue-400 mx-auto mb-2\" />\n <h3 className=\"text-sm font-semibold text-foreground\">Perfect Attendance</h3>\n <p className=\"text-xs text-muted-foreground mt-1\">Q3 2023</p>\n </div>\n </div>\n\n {/ Performance Metrics with Progress Bars /}\n <div>\n <h3 className=\"text-sm font-semibold text-foreground mb-4\">\n Performance Metrics\n </h3>\n <div className=\"space-y-4\">\n <div>\n <div className=\"flex justify-between items-center mb-1.5\">\n <span className=\"text-xs text-muted-foreground\">Delivery Success Rate</span>\n <span className=\"text-xs font-medium text-foreground\">98%</span>\n </div>\n <div className=\"w-full h-2 rounded-full bg-muted overflow-hidden\">\n <div\n className=\"h-full rounded-full bg-green-500 transition-all\"\n style={{ width: '98%' }}\n />\n </div>\n </div>\n <div>\n <div className=\"flex justify-between items-center mb-1.5\">\n <span className=\"text-xs text-muted-foreground\">Customer Satisfaction</span>\n <span className=\"text-xs font-medium text-foreground\">95%</span>\n </div>\n <div className=\"w-full h-2 rounded-full bg-muted overflow-hidden\">\n <div\n className=\"h-full rounded-full bg-blue-500 transition-all\"\n style={{ width: '95%' }}\n />\n </div>\n </div>\n <div>\n <div className=\"flex justify-between items-center mb-1.5\">\n <span className=\"text-xs text-muted-foreground\">Punctuality</span>\n <span className=\"text-xs font-medium text-foreground\">92%</span>\n </div>\n <div className=\"w-full h-2 rounded-full bg-muted overflow-hidden\">\n <div\n className=\"h-full rounded-full bg-purple-500 transition-all\"\n style={{ width: '92%' }}\n />\n </div>\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Notifications ============= */}\n {activeTab === 'notifications' && (\n <div>\n <h2 className=\"text-lg font-semibold text-foreground mb-5\">\n Notification Preferences\n </h2>\n <div className=\"space-y-4\">\n {notifications.map((item) => (\n <div\n key={item.id}\n className=\"flex items-center justify-between p-4 rounded-lg bg-muted/50\"\n >\n <div>\n <h4 className=\"text-sm font-medium text-foreground\">{item.label}</h4>\n <p className=\"text-xs text-muted-foreground mt-0.5\">{item.description}</p>\n </div>\n <button\n type=\"button\"\n onClick={() => toggleNotification(item.id)}\n disabled={!isEditing}\n className={cn(\n 'relative inline-flex h-6 w-11 items-center rounded-full transition-colors',\n item.enabled ? 'bg-blue-500' : 'bg-muted-foreground/30',\n !isEditing && 'opacity-60 cursor-not-allowed'\n )}\n >\n <span\n className={cn(\n 'inline-block h-4 w-4 rounded-full bg-white transition-transform',\n item.enabled ? 'translate-x-6' : 'translate-x-1'\n )}\n />\n </button>\n </div>\n ))}\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n </PageLayout>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"WorkerProfilePage.js","names":[],"sources":["../../../../src/atheletebridge/pages/worker/WorkerProfilePage.tsx"],"sourcesContent":["/*\n Worker Profile Page\n \n Full-featured profile page with:\n * - 6 sidebar tabs: Personal Info, Work Details, Address, Documents, Achievements, Notifications\n * - Edit/Save/Cancel mode toggle with all form fields becoming editable\n * - Profile image upload with camera icon overlay\n * - Personal Info: first/last name, email, phone, DOB + Emergency Contact\n * - Work Details: Employee ID, Designation, Department, Work Location, Joining Date, Employment Type + 3 stat cards\n * - Address tab: Current address + Permanent address with \"same as current\" checkbox\n * - Documents tab: PAN, Aadhar (masked, readonly), Bank Name, Account Number, IFSC Code + security notice\n * - Achievements tab: badges + Performance Metrics with progress bars\n * - Notifications tab: 5 toggle switches for notification preferences\n \n @module atheletebridge/pages/worker\n /\n\nimport { useState, type ChangeEvent } from 'react';\nimport {\n User,\n Phone,\n Briefcase,\n MapPin,\n CreditCard,\n Award,\n Bell,\n Camera,\n Save,\n X,\n Pencil,\n Loader2,\n Clock,\n Shield,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { useAthleteBridge } from '../../context/AthleteBridgeContext';\nimport { mockWorker } from '../../mocks/users';\nimport { mockWorkerStats } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ntype ProfileTab = 'personal' \| 'work' \| 'address' \| 'documents' \| 'achievements' \| 'notifications';\n\ninterface WorkerProfile {\n firstName: string;\n lastName: string;\n email: string;\n phone: string;\n profileImage: string;\n dateOfBirth: string;\n employeeId: string;\n designation: string;\n department: string;\n workLocation: string;\n joiningDate: string;\n employmentType: string;\n currentAddress: string;\n city: string;\n state: string;\n pincode: string;\n permanentAddress: string;\n sameAsCurrent: boolean;\n emergencyContactName: string;\n emergencyContactPhone: string;\n emergencyContactRelation: string;\n bankName: string;\n accountNumber: string;\n ifscCode: string;\n panNumber: string;\n aadharNumber: string;\n}\n\ninterface NotificationPref {\n id: string;\n label: string;\n description: string;\n enabled: boolean;\n}\n\n// ============================================================================\n// Tab Configuration\n// ============================================================================\n\nconst tabs: { id: ProfileTab; label: string; icon: typeof User }[] = [\n { id: 'personal', label: 'Personal Info', icon: User },\n { id: 'work', label: 'Work Details', icon: Briefcase },\n { id: 'address', label: 'Address', icon: MapPin },\n { id: 'documents', label: 'Documents', icon: CreditCard },\n { id: 'achievements', label: 'Achievements', icon: Award },\n { id: 'notifications', label: 'Notifications', icon: Bell },\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const WorkerProfilePage = () => {\n const { navigateTo } = useAthleteBridge();\n const [activeTab, setActiveTab] = useState<ProfileTab>('personal');\n const [isEditing, setIsEditing] = useState(false);\n const [isSaving, setIsSaving] = useState(false);\n\n const [profile, setProfile] = useState<WorkerProfile>({\n firstName: mockWorker.firstName \|\| 'Suresh',\n lastName: mockWorker.lastName \|\| 'Kumar',\n email: mockWorker.email \|\| 'suresh.worker@example.com',\n phone: mockWorker.phone \|\| '+91-87654-32109',\n profileImage: mockWorker.profilePicture \|\| '',\n dateOfBirth: '1990-05-15',\n employeeId: 'EMP-2024-001',\n designation: 'Delivery Executive',\n department: 'Operations',\n workLocation: 'Koramangala Zone',\n joiningDate: '2023-01-10',\n employmentType: 'Full Time',\n currentAddress: '45, 2nd Main, BTM Layout',\n city: 'Bangalore',\n state: 'Karnataka',\n pincode: '560076',\n permanentAddress: '',\n sameAsCurrent: true,\n emergencyContactName: 'Lakshmi Kumar',\n emergencyContactPhone: '+91-98765-12345',\n emergencyContactRelation: 'Spouse',\n bankName: 'HDFC Bank',\n accountNumber: '*5678',\n ifscCode: 'HDFC0001234',\n panNumber: 'ABCDEF',\n aadharNumber: '*5678',\n });\n\n const [notifications, setNotifications] = useState<NotificationPref[]>([\n {\n id: 'orders',\n label: 'New Order Assignments',\n description: 'Get notified when new orders are assigned to you',\n enabled: true,\n },\n {\n id: 'schedule',\n label: 'Schedule Updates',\n description: 'Changes to your work schedule',\n enabled: true,\n },\n {\n id: 'earnings',\n label: 'Earnings Updates',\n description: 'Daily and weekly earnings summaries',\n enabled: true,\n },\n {\n id: 'performance',\n label: 'Performance Reviews',\n description: 'Feedback and performance metrics',\n enabled: true,\n },\n {\n id: 'announcements',\n label: 'Company Announcements',\n description: 'Important updates from management',\n enabled: true,\n },\n ]);\n\n const handleInputChange = (field: keyof WorkerProfile, value: string \| boolean) => {\n setProfile((prev) => ({ ...prev, [field]: value }));\n };\n\n const handleSave = () => {\n setIsSaving(true);\n setTimeout(() => {\n setIsSaving(false);\n setIsEditing(false);\n alert('Profile updated successfully!');\n }, 1000);\n };\n\n const handleImageUpload = (e: ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0];\n if (file) {\n const reader = new FileReader();\n reader.onloadend = () => {\n setProfile((prev) => ({ ...prev, profileImage: reader.result as string }));\n };\n reader.readAsDataURL(file);\n }\n };\n\n const toggleNotification = (id: string) => {\n if (!isEditing) return;\n setNotifications((prev) => prev.map((n) => (n.id === id ? { ...n, enabled: !n.enabled } : n)));\n };\n\n return (\n <PageLayout\n title=\"My Profile\"\n description=\"Manage your profile information\"\n actions={\n <div className=\"flex items-center gap-2\">\n {!isEditing ? (\n <button\n type=\"button\"\n onClick={() => setIsEditing(true)}\n className=\"inline-flex items-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent/80 transition-colors\"\n >\n <Pencil className=\"h-4 w-4\" />\n Edit Profile\n </button>\n ) : (\n <>\n <button\n type=\"button\"\n onClick={() => setIsEditing(false)}\n className=\"inline-flex items-center gap-2 rounded-md bg-accent px-3 py-2 text-sm font-medium text-text-primary hover:bg-accent/80 transition-colors\"\n >\n <X className=\"h-4 w-4\" />\n Cancel\n </button>\n <button\n type=\"button\"\n onClick={handleSave}\n disabled={isSaving}\n className=\"inline-flex items-center gap-2 rounded-md bg-blue-500/10 px-3 py-2 text-sm font-medium text-blue-600 dark:text-blue-400 hover:bg-blue-500/20 transition-colors disabled:opacity-50\"\n >\n {isSaving ? (\n <>\n <Loader2 className=\"h-4 w-4 animate-spin\" />\n Saving...\n </>\n ) : (\n <>\n <Save className=\"h-4 w-4\" />\n Save Changes\n </>\n )}\n </button>\n </>\n )}\n </div>\n }\n >\n <div className=\"grid lg:grid-cols-4 gap-6 max-w-6xl\">\n {/ Sidebar /}\n <div className=\"lg:col-span-1 space-y-4\">\n {/ Profile Card /}\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5 shadow-sm text-center\">\n <div className=\"relative inline-block\">\n <div className=\"h-20 w-20 rounded-full bg-bg-sunken overflow-hidden mx-auto\">\n {profile.profileImage ? (\n <img\n src={profile.profileImage}\n alt={`${profile.firstName} ${profile.lastName}`}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div className=\"flex h-full w-full items-center justify-center text-text-secondary\">\n <User className=\"h-10 w-10\" />\n </div>\n )}\n </div>\n {isEditing && (\n <label className=\"absolute bottom-0 right-0 flex h-7 w-7 items-center justify-center rounded-full bg-blue-500/20 text-blue-600 dark:text-blue-400 cursor-pointer hover:bg-blue-500/30 transition-colors\">\n <Camera className=\"h-3.5 w-3.5\" />\n <input\n type=\"file\"\n accept=\"image/\"\n onChange={handleImageUpload}\n className=\"hidden\"\n />\n </label>\n )}\n </div>\n <h3 className=\"mt-3 text-sm font-semibold text-text-primary\">\n {profile.firstName} {profile.lastName}\n </h3>\n <p className=\"text-xs text-text-secondary\">{profile.designation}</p>\n <p className=\"text-[10px] text-text-secondary mt-0.5\">{profile.employeeId}</p>\n </div>\n\n {/* Tab Navigation /}\n <div className=\"space-y-1\">\n {tabs.map((tab) => {\n const Icon = tab.icon;\n return (\n <button\n key={tab.id}\n type=\"button\"\n onClick={() => setActiveTab(tab.id)}\n className={cn(\n 'w-full flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors',\n activeTab === tab.id\n ? 'bg-blue-500/10 text-blue-600 dark:text-blue-400'\n : 'bg-bg-surface text-text-primary hover:bg-bg-sunken'\n )}\n >\n <Icon className=\"h-4 w-4\" />\n {tab.label}\n </button>\n );\n })}\n </div>\n </div>\n\n {/ Content Area /}\n <div className=\"lg:col-span-3\">\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-6 shadow-sm\">\n {/ ============= Personal Info ============= /}\n {activeTab === 'personal' && (\n <div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-5\">Personal Information</h2>\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n First Name\n </label>\n <input\n type=\"text\"\n value={profile.firstName}\n onChange={(e) => handleInputChange('firstName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Last Name\n </label>\n <input\n type=\"text\"\n value={profile.lastName}\n onChange={(e) => handleInputChange('lastName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Email Address\n </label>\n <input\n type=\"email\"\n value={profile.email}\n onChange={(e) => handleInputChange('email', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Phone Number\n </label>\n <input\n type=\"text\"\n value={profile.phone}\n onChange={(e) => handleInputChange('phone', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Date of Birth\n </label>\n <input\n type=\"date\"\n value={profile.dateOfBirth}\n onChange={(e) => handleInputChange('dateOfBirth', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n\n {/ Emergency Contact /}\n <div className=\"mt-7\">\n <h3 className=\"text-sm font-semibold text-text-primary mb-4\">Emergency Contact</h3>\n <div className=\"grid sm:grid-cols-3 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Contact Name\n </label>\n <input\n type=\"text\"\n value={profile.emergencyContactName}\n onChange={(e) => handleInputChange('emergencyContactName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Contact Phone\n </label>\n <input\n type=\"text\"\n value={profile.emergencyContactPhone}\n onChange={(e) => handleInputChange('emergencyContactPhone', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Relationship\n </label>\n <input\n type=\"text\"\n value={profile.emergencyContactRelation}\n onChange={(e) =>\n handleInputChange('emergencyContactRelation', e.target.value)\n }\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Work Details ============= /}\n {activeTab === 'work' && (\n <div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-5\">Work Details</h2>\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Employee ID\n </label>\n <input\n type=\"text\"\n value={profile.employeeId}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Designation\n </label>\n <input\n type=\"text\"\n value={profile.designation}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Department\n </label>\n <input\n type=\"text\"\n value={profile.department}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Work Location\n </label>\n <input\n type=\"text\"\n value={profile.workLocation}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Joining Date\n </label>\n <input\n type=\"date\"\n value={profile.joiningDate}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Employment Type\n </label>\n <input\n type=\"text\"\n value={profile.employmentType}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n </div>\n\n {/ Performance Stats /}\n <div className=\"mt-7 grid sm:grid-cols-3 gap-4\">\n <div className=\"rounded-lg bg-bg-sunken/50 p-4 text-center\">\n <p className=\"text-2xl font-bold text-blue-600 dark:text-blue-400\">\n {mockWorkerStats.totalDeliveries}\n </p>\n <p className=\"text-xs text-text-secondary\">Total Deliveries</p>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4 text-center\">\n <p className=\"text-2xl font-bold text-green-600 dark:text-green-400\">\n {mockWorkerStats.averageRating}\n </p>\n <p className=\"text-xs text-text-secondary\">Average Rating</p>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4 text-center\">\n <p className=\"text-2xl font-bold text-blue-600 dark:text-blue-400\">\n {mockWorkerStats.completionRate}%\n </p>\n <p className=\"text-xs text-text-secondary\">On-Time Delivery</p>\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Address ============= /}\n {activeTab === 'address' && (\n <div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-5\">Address Information</h2>\n\n <div className=\"space-y-6\">\n {/ Current Address /}\n <div>\n <h3 className=\"text-sm font-semibold text-text-primary mb-3\">Current Address</h3>\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div className=\"sm:col-span-2\">\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Address Line\n </label>\n <textarea\n rows={2}\n value={profile.currentAddress}\n onChange={(e) => handleInputChange('currentAddress', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40 resize-none\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n City\n </label>\n <input\n type=\"text\"\n value={profile.city}\n onChange={(e) => handleInputChange('city', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n State\n </label>\n <input\n type=\"text\"\n value={profile.state}\n onChange={(e) => handleInputChange('state', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Pincode\n </label>\n <input\n type=\"text\"\n value={profile.pincode}\n onChange={(e) => handleInputChange('pincode', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n </div>\n\n {/ Permanent Address /}\n <div>\n <h3 className=\"text-sm font-semibold text-text-primary mb-3\">\n Permanent Address\n </h3>\n <label className=\"flex items-center gap-2 mb-3 cursor-pointer\">\n <input\n type=\"checkbox\"\n checked={profile.sameAsCurrent}\n onChange={(e) => handleInputChange('sameAsCurrent', e.target.checked)}\n disabled={!isEditing}\n className=\"h-4 w-4 rounded border-border-subtle text-blue-600 focus:ring-blue-500/40\"\n />\n <span className=\"text-xs text-text-primary\">Same as current address</span>\n </label>\n {!profile.sameAsCurrent && (\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Address Line\n </label>\n <textarea\n rows={2}\n value={profile.permanentAddress}\n onChange={(e) => handleInputChange('permanentAddress', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40 resize-none\"\n />\n </div>\n )}\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Documents ============= /}\n {activeTab === 'documents' && (\n <div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-5\">Documents & Banking</h2>\n\n <div className=\"rounded-lg bg-yellow-500/10 border border-yellow-500/20 p-3 mb-5\">\n <p className=\"text-xs text-yellow-600 dark:text-yellow-400 flex items-center gap-2\">\n <Shield className=\"h-4 w-4 shrink-0\" />\n Your documents and banking information are encrypted and secure.\n </p>\n </div>\n\n <div className=\"grid sm:grid-cols-2 gap-4\">\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n PAN Number\n </label>\n <input\n type=\"text\"\n value={profile.panNumber}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Aadhar Number\n </label>\n <input\n type=\"text\"\n value={profile.aadharNumber}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Bank Name\n </label>\n <input\n type=\"text\"\n value={profile.bankName}\n onChange={(e) => handleInputChange('bankName', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n Account Number\n </label>\n <input\n type=\"text\"\n value={profile.accountNumber}\n disabled\n className=\"w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed\"\n />\n </div>\n <div>\n <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n IFSC Code\n </label>\n <input\n type=\"text\"\n value={profile.ifscCode}\n onChange={(e) => handleInputChange('ifscCode', e.target.value)}\n disabled={!isEditing}\n className=\"w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-500/40\"\n />\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Achievements ============= /}\n {activeTab === 'achievements' && (\n <div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-5\">\n Achievements & Recognition\n </h2>\n\n {/ Achievement Badges /}\n <div className=\"grid sm:grid-cols-2 gap-4 mb-7\">\n <div className=\"rounded-lg bg-yellow-500/5 border border-yellow-500/20 p-5 text-center\">\n <Award className=\"h-10 w-10 text-yellow-600 dark:text-yellow-400 mx-auto mb-2\" />\n <h3 className=\"text-sm font-semibold text-text-primary\">Employee of the Month</h3>\n <p className=\"text-xs text-text-secondary mt-1\">December 2023</p>\n </div>\n <div className=\"rounded-lg bg-blue-500/5 border border-blue-500/20 p-5 text-center\">\n <Clock className=\"h-10 w-10 text-blue-600 dark:text-blue-400 mx-auto mb-2\" />\n <h3 className=\"text-sm font-semibold text-text-primary\">Perfect Attendance</h3>\n <p className=\"text-xs text-text-secondary mt-1\">Q3 2023</p>\n </div>\n </div>\n\n {/ Performance Metrics with Progress Bars /}\n <div>\n <h3 className=\"text-sm font-semibold text-text-primary mb-4\">\n Performance Metrics\n </h3>\n <div className=\"space-y-4\">\n <div>\n <div className=\"flex justify-between items-center mb-1.5\">\n <span className=\"text-xs text-text-secondary\">Delivery Success Rate</span>\n <span className=\"text-xs font-medium text-text-primary\">98%</span>\n </div>\n <div className=\"w-full h-2 rounded-full bg-bg-sunken overflow-hidden\">\n <div\n className=\"h-full rounded-full bg-green-500 transition-all\"\n style={{ width: '98%' }}\n />\n </div>\n </div>\n <div>\n <div className=\"flex justify-between items-center mb-1.5\">\n <span className=\"text-xs text-text-secondary\">Customer Satisfaction</span>\n <span className=\"text-xs font-medium text-text-primary\">95%</span>\n </div>\n <div className=\"w-full h-2 rounded-full bg-bg-sunken overflow-hidden\">\n <div\n className=\"h-full rounded-full bg-blue-500 transition-all\"\n style={{ width: '95%' }}\n />\n </div>\n </div>\n <div>\n <div className=\"flex justify-between items-center mb-1.5\">\n <span className=\"text-xs text-text-secondary\">Punctuality</span>\n <span className=\"text-xs font-medium text-text-primary\">92%</span>\n </div>\n <div className=\"w-full h-2 rounded-full bg-bg-sunken overflow-hidden\">\n <div\n className=\"h-full rounded-full bg-purple-500 transition-all\"\n style={{ width: '92%' }}\n />\n </div>\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/ ============= Notifications ============= */}\n {activeTab === 'notifications' && (\n <div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-5\">\n Notification Preferences\n </h2>\n <div className=\"space-y-4\">\n {notifications.map((item) => (\n <div\n key={item.id}\n className=\"flex items-center justify-between p-4 rounded-lg bg-bg-sunken/50\"\n >\n <div>\n <h4 className=\"text-sm font-medium text-text-primary\">{item.label}</h4>\n <p className=\"text-xs text-text-secondary mt-0.5\">{item.description}</p>\n </div>\n <button\n type=\"button\"\n onClick={() => toggleNotification(item.id)}\n disabled={!isEditing}\n className={cn(\n 'relative inline-flex h-6 w-11 items-center rounded-full transition-colors',\n item.enabled ? 'bg-blue-500' : 'bg-muted-foreground/30',\n !isEditing && 'opacity-60 cursor-not-allowed'\n )}\n >\n <span\n className={cn(\n 'inline-block h-4 w-4 rounded-full bg-white transition-transform',\n item.enabled ? 'translate-x-6' : 'translate-x-1'\n )}\n />\n </button>\n </div>\n ))}\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n </PageLayout>\n );\n};\n"],"mappings":"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"}

package/dist/atheletebridge/pages/worker/WorkerSchedulePage.js CHANGED Viewed

@@ -226,8 +226,8 @@ var A = () => {
 			className: "flex items-center justify-center py-24",
 			children: /* @__PURE__ */ w("div", {
 				className: "text-center",
-				children: [/* @__PURE__ */ C(p, { className: "h-10 w-10 animate-spin text-muted-foreground mx-auto mb-4" }), /* @__PURE__ */ C("p", {
-					className: "text-sm text-muted-foreground",
+				children: [/* @__PURE__ */ C(p, { className: "h-10 w-10 animate-spin text-text-secondary mx-auto mb-4" }), /* @__PURE__ */ C("p", {
+					className: "text-sm text-text-secondary",
 					children: "Loading schedule..."
 				})]
 			})
@@ -241,61 +241,61 @@ var A = () => {
 				className: "grid grid-cols-2 md:grid-cols-4 gap-3",
 				children: [
 					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+						className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 						children: [/* @__PURE__ */ C("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Hours This Week"
 						}), /* @__PURE__ */ w("p", {
-							className: "text-2xl font-bold text-foreground",
+							className: "text-2xl font-bold text-text-primary",
 							children: [U.hoursThisWeek, "h"]
 						})]
 					}),
 					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+						className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 						children: [/* @__PURE__ */ C("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Shifts This Week"
 						}), /* @__PURE__ */ C("p", {
-							className: "text-2xl font-bold text-foreground",
+							className: "text-2xl font-bold text-text-primary",
 							children: U.shiftsThisWeek
 						})]
 					}),
 					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+						className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 						children: [/* @__PURE__ */ C("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Week Earnings"
 						}), /* @__PURE__ */ C("p", {
-							className: "text-2xl font-bold text-foreground",
+							className: "text-2xl font-bold text-text-primary",
 							children: i(U.earningsThisWeek, { minimumFractionDigits: 0 })
 						})]
 					}),
 					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+						className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 						children: [/* @__PURE__ */ C("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Next Shift"
 						}), /* @__PURE__ */ C("p", {
-							className: "text-sm font-bold text-foreground",
+							className: "text-sm font-bold text-text-primary",
 							children: U.nextShift ? `${T(U.nextShift.date)} ${E(U.nextShift.startTime)}` : "None scheduled"
 						})]
 					})
 				]
 			}), /* @__PURE__ */ w("div", {
-				className: "rounded-lg border border-border bg-card shadow-sm overflow-hidden",
+				className: "rounded-lg border border-border-subtle bg-bg-surface shadow-sm overflow-hidden",
 				children: [/* @__PURE__ */ w("div", {
-					className: "flex border-b border-border",
+					className: "flex border-b border-border-subtle",
 					children: [
 						/* @__PURE__ */ w("button", {
 							type: "button",
 							onClick: () => P("schedule"),
-							className: t("flex-1 py-3 px-4 text-sm font-medium transition-colors flex items-center justify-center gap-2", N === "schedule" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 bg-blue-500/5" : "text-muted-foreground hover:text-foreground"),
+							className: t("flex-1 py-3 px-4 text-sm font-medium transition-colors flex items-center justify-center gap-2", N === "schedule" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 bg-blue-500/5" : "text-text-secondary hover:text-text-primary"),
 							children: [/* @__PURE__ */ C(l, { className: "h-4 w-4" }), "My Schedule"]
 						}),
 						/* @__PURE__ */ w("button", {
 							type: "button",
 							onClick: () => P("requests"),
-							className: t("flex-1 py-3 px-4 text-sm font-medium transition-colors flex items-center justify-center gap-2", N === "requests" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 bg-blue-500/5" : "text-muted-foreground hover:text-foreground"),
+							className: t("flex-1 py-3 px-4 text-sm font-medium transition-colors flex items-center justify-center gap-2", N === "requests" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 bg-blue-500/5" : "text-text-secondary hover:text-text-primary"),
 							children: [
 								/* @__PURE__ */ C(y, { className: "h-4 w-4" }),
 								"Shift Requests",
@@ -308,7 +308,7 @@ var A = () => {
 						/* @__PURE__ */ w("button", {
 							type: "button",
 							onClick: () => P("availability"),
-							className: t("flex-1 py-3 px-4 text-sm font-medium transition-colors flex items-center justify-center gap-2", N === "availability" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 bg-blue-500/5" : "text-muted-foreground hover:text-foreground"),
+							className: t("flex-1 py-3 px-4 text-sm font-medium transition-colors flex items-center justify-center gap-2", N === "availability" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 bg-blue-500/5" : "text-text-secondary hover:text-text-primary"),
 							children: [/* @__PURE__ */ C(S, { className: "h-4 w-4" }), "Availability"]
 						})
 					]
@@ -321,11 +321,11 @@ var A = () => {
 								/* @__PURE__ */ w("button", {
 									type: "button",
 									onClick: () => I((e) => e - 1),
-									className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent/80 transition-colors",
+									className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent/80 transition-colors",
 									children: [/* @__PURE__ */ C(d, { className: "h-3.5 w-3.5" }), "Previous Week"]
 								}),
 								/* @__PURE__ */ w("h3", {
-									className: "text-sm font-medium text-foreground",
+									className: "text-sm font-medium text-text-primary",
 									children: [
 										G.start,
 										" - ",
@@ -335,32 +335,33 @@ var A = () => {
 								/* @__PURE__ */ w("button", {
 									type: "button",
 									onClick: () => I((e) => e + 1),
-									className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent/80 transition-colors",
+									className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent/80 transition-colors",
 									children: ["Next Week", /* @__PURE__ */ C(f, { className: "h-3.5 w-3.5" })]
 								})
 							]
 						}), L.length === 0 ? /* @__PURE__ */ C(r, {
+							illustration: "empty-data",
 							icon: /* @__PURE__ */ C(c, { className: "h-12 w-12" }),
 							title: "No shifts scheduled",
 							description: "No shifts scheduled for this week"
 						}) : /* @__PURE__ */ C("div", {
 							className: "space-y-3",
 							children: L.map((e) => /* @__PURE__ */ w("div", {
-								className: t("rounded-lg border p-4 transition-colors", e.status === "ongoing" ? "border-green-500/30 bg-green-500/5" : "border-border hover:bg-muted/30"),
+								className: t("rounded-lg border p-4 transition-colors", e.status === "ongoing" ? "border-green-500/30 bg-green-500/5" : "border-border-subtle hover:bg-bg-sunken/30"),
 								children: [
 									/* @__PURE__ */ w("div", {
 										className: "flex items-center justify-between mb-3",
 										children: [/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ w("div", {
 											className: "flex items-center gap-2 flex-wrap",
 											children: [/* @__PURE__ */ C("h4", {
-												className: "text-sm font-semibold text-foreground",
+												className: "text-sm font-semibold text-text-primary",
 												children: T(e.date)
 											}), /* @__PURE__ */ C("span", {
 												className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium capitalize", O(e.status)),
 												children: e.status === "ongoing" ? "Ongoing" : e.status
 											})]
 										}), /* @__PURE__ */ w("p", {
-											className: "text-xs text-muted-foreground mt-1",
+											className: "text-xs text-text-secondary mt-1",
 											children: [
 												E(e.startTime),
 												" - ",
@@ -369,10 +370,10 @@ var A = () => {
 										})] }), /* @__PURE__ */ w("div", {
 											className: "text-right",
 											children: [/* @__PURE__ */ C("p", {
-												className: "text-lg font-bold text-foreground",
+												className: "text-lg font-bold text-text-primary",
 												children: i(e.earnings, { minimumFractionDigits: 0 })
 											}), e.rating != null && /* @__PURE__ */ w("p", {
-												className: "text-xs text-muted-foreground flex items-center gap-1 justify-end",
+												className: "text-xs text-text-secondary flex items-center gap-1 justify-end",
 												children: [/* @__PURE__ */ C(x, { className: "h-3 w-3 fill-yellow-400 text-yellow-400" }), e.rating]
 											})]
 										})]
@@ -381,30 +382,30 @@ var A = () => {
 										className: "grid grid-cols-1 md:grid-cols-3 gap-3 text-sm",
 										children: [
 											/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-												className: "text-xs text-muted-foreground",
+												className: "text-xs text-text-secondary",
 												children: "Cart"
 											}), /* @__PURE__ */ w("p", {
-												className: "text-xs font-medium text-foreground flex items-center gap-1",
-												children: [/* @__PURE__ */ C(b, { className: "h-3 w-3 text-muted-foreground" }), e.cartName]
+												className: "text-xs font-medium text-text-primary flex items-center gap-1",
+												children: [/* @__PURE__ */ C(b, { className: "h-3 w-3 text-text-secondary" }), e.cartName]
 											})] }),
 											/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-												className: "text-xs text-muted-foreground",
+												className: "text-xs text-text-secondary",
 												children: "Location"
 											}), /* @__PURE__ */ w("p", {
-												className: "text-xs font-medium text-foreground flex items-center gap-1",
-												children: [/* @__PURE__ */ C(g, { className: "h-3 w-3 text-muted-foreground" }), e.location]
+												className: "text-xs font-medium text-text-primary flex items-center gap-1",
+												children: [/* @__PURE__ */ C(g, { className: "h-3 w-3 text-text-secondary" }), e.location]
 											})] }),
 											e.tasksCompleted != null && /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-												className: "text-xs text-muted-foreground",
+												className: "text-xs text-text-secondary",
 												children: "Tasks Completed"
 											}), /* @__PURE__ */ w("p", {
-												className: "text-xs font-medium text-foreground flex items-center gap-1",
-												children: [/* @__PURE__ */ C(u, { className: "h-3 w-3 text-muted-foreground" }), e.tasksCompleted]
+												className: "text-xs font-medium text-text-primary flex items-center gap-1",
+												children: [/* @__PURE__ */ C(u, { className: "h-3 w-3 text-text-secondary" }), e.tasksCompleted]
 											})] })
 										]
 									}),
 									e.status === "scheduled" && /* @__PURE__ */ C("div", {
-										className: "mt-3 pt-3 border-t border-border",
+										className: "mt-3 pt-3 border-t border-border-subtle",
 										children: /* @__PURE__ */ w("button", {
 											type: "button",
 											onClick: () => K(e.id),
@@ -420,7 +421,7 @@ var A = () => {
 										}), /* @__PURE__ */ w("button", {
 											type: "button",
 											onClick: () => q(e.id),
-											className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent/80 transition-colors",
+											className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent/80 transition-colors",
 											children: [/* @__PURE__ */ C(h, { className: "h-3.5 w-3.5" }), "Check Out"]
 										})]
 									})
@@ -428,21 +429,22 @@ var A = () => {
 							}, e.id))
 						})] }),
 						N === "requests" && /* @__PURE__ */ C("div", { children: z.length === 0 ? /* @__PURE__ */ C(r, {
+							illustration: "empty-notifications",
 							icon: /* @__PURE__ */ C(y, { className: "h-12 w-12" }),
 							title: "No shift requests",
 							description: "No shift requests available"
 						}) : /* @__PURE__ */ C("div", {
 							className: "space-y-3",
 							children: z.map((e) => /* @__PURE__ */ w("div", {
-								className: "rounded-lg border border-border p-4",
+								className: "rounded-lg border border-border-subtle p-4",
 								children: [
 									/* @__PURE__ */ w("div", {
 										className: "flex items-center justify-between mb-3",
 										children: [/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("h4", {
-											className: "text-sm font-semibold text-foreground",
+											className: "text-sm font-semibold text-text-primary",
 											children: T(e.date)
 										}), /* @__PURE__ */ w("p", {
-											className: "text-xs text-muted-foreground mt-0.5",
+											className: "text-xs text-text-secondary mt-0.5",
 											children: [
 												E(e.startTime),
 												" - ",
@@ -456,21 +458,21 @@ var A = () => {
 									/* @__PURE__ */ w("div", {
 										className: "grid grid-cols-1 md:grid-cols-2 gap-3 text-sm mb-3",
 										children: [/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: "Cart"
 										}), /* @__PURE__ */ C("p", {
-											className: "text-xs font-medium text-foreground",
+											className: "text-xs font-medium text-text-primary",
 											children: e.cartName
 										})] }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-											className: "text-xs text-muted-foreground",
+											className: "text-xs text-text-secondary",
 											children: "Location"
 										}), /* @__PURE__ */ C("p", {
-											className: "text-xs font-medium text-foreground",
+											className: "text-xs font-medium text-text-primary",
 											children: e.location
 										})] })]
 									}),
 									/* @__PURE__ */ w("p", {
-										className: "text-[10px] text-muted-foreground mb-3",
+										className: "text-[10px] text-text-secondary mb-3",
 										children: [
 											"Requested",
 											" ",
@@ -502,13 +504,13 @@ var A = () => {
 						}) }),
 						N === "availability" && /* @__PURE__ */ w("div", { children: [
 							/* @__PURE__ */ C("p", {
-								className: "text-xs text-muted-foreground mb-5",
+								className: "text-xs text-text-secondary mb-5",
 								children: "Set your preferred working hours for each day of the week"
 							}),
 							/* @__PURE__ */ C("div", {
 								className: "space-y-3",
 								children: V.map((e) => /* @__PURE__ */ w("div", {
-									className: t("flex flex-col sm:flex-row sm:items-center gap-3 p-3 rounded-lg border", e.isAvailable ? "border-border bg-card" : "border-border/50 bg-muted/30"),
+									className: t("flex flex-col sm:flex-row sm:items-center gap-3 p-3 rounded-lg border", e.isAvailable ? "border-border-subtle bg-bg-surface" : "border-border-subtle/50 bg-bg-sunken/30"),
 									children: [/* @__PURE__ */ C("div", {
 										className: "w-32 shrink-0",
 										children: /* @__PURE__ */ w("label", {
@@ -517,9 +519,9 @@ var A = () => {
 												type: "checkbox",
 												checked: e.isAvailable,
 												onChange: (t) => X(e.dayOfWeek, "isAvailable", t.target.checked),
-												className: "h-4 w-4 rounded border-border text-blue-600 focus:ring-blue-500/40"
+												className: "h-4 w-4 rounded border-border-subtle text-blue-600 focus:ring-blue-500/40"
 											}), /* @__PURE__ */ C("span", {
-												className: "text-sm font-medium text-foreground",
+												className: "text-sm font-medium text-text-primary",
 												children: e.dayOfWeek
 											})]
 										})
@@ -528,28 +530,28 @@ var A = () => {
 										children: [/* @__PURE__ */ w("div", {
 											className: "flex items-center gap-2",
 											children: [/* @__PURE__ */ C("span", {
-												className: "text-xs text-muted-foreground w-10",
+												className: "text-xs text-text-secondary w-10",
 												children: "From"
 											}), /* @__PURE__ */ C("input", {
 												type: "time",
 												value: e.preferredStartTime,
 												onChange: (t) => X(e.dayOfWeek, "preferredStartTime", t.target.value),
-												className: "rounded-md border border-border bg-background px-3 py-1.5 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-blue-500/40"
+												className: "rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-blue-500/40"
 											})]
 										}), /* @__PURE__ */ w("div", {
 											className: "flex items-center gap-2",
 											children: [/* @__PURE__ */ C("span", {
-												className: "text-xs text-muted-foreground w-10",
+												className: "text-xs text-text-secondary w-10",
 												children: "To"
 											}), /* @__PURE__ */ C("input", {
 												type: "time",
 												value: e.preferredEndTime,
 												onChange: (t) => X(e.dayOfWeek, "preferredEndTime", t.target.value),
-												className: "rounded-md border border-border bg-background px-3 py-1.5 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-blue-500/40"
+												className: "rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-blue-500/40"
 											})]
 										})]
 									}) : /* @__PURE__ */ C("span", {
-										className: "text-xs text-muted-foreground",
+										className: "text-xs text-text-secondary",
 										children: "Not available"
 									})]
 								}, e.dayOfWeek))