\n {/* Header */}\n

Profile

\n\n {/* Login/Register */}\n

\n {!showLogin ? (\n

👤

Welcome to Esteem

\n Sign in to access your orders, wishlist, and personalized recommendations.\n

\n \n

\n setShowLogin(true)}\n className=\"btn-primary w-full\"\n >\n Sign In\n \n \n \n \n

\n Demo: demo@example.com / password\n

\n ) : (\n

\n \n Email\n \n setEmail(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500\"\n required\n />\n

\n \n

\n \n Password\n \n setPassword(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500\"\n required\n />\n

\n \n \n {isLoading ? 'Signing In...' : 'Sign In'}\n \n \n setShowLogin(false)}\n className=\"w-full text-center text-gray-600 hover:text-gray-800\"\n >\n Back\n \n \n

\n )}\n

\n );\n }\n\n return (\n

\n {/* Header */}\n

Profile

\n\n {/* Profile Content */}\n

\n {/* User Info */}\n

\n {state.user.name.charAt(0)}\n

{state.user.name}

{state.user.email}

\n\n {/* Menu Items */}\n

\n {[\n { icon: '📦', label: 'My Orders', action: () => {} },\n { icon: '📍', label: 'Addresses', action: () => {} },\n { icon: '💳', label: 'Payment Methods', action: () => {} },\n { icon: '🔔', label: 'Notifications', action: () => {} },\n { icon: '❓', label: 'Help & Support', action: () => {} },\n { icon: '⚙️', label: 'Settings', action: () => {} },\n ].map((item, index) => (\n \n

\n {item.icon}\n {item.label}\n

\n →\n \n ))}\n

\n\n {/* Admin Access */}\n {state.user.isAdmin && (\n navigateTo('admin')}\n className=\"w-full bg-indigo-600 text-white rounded-lg p-4 font-semibold hover:bg-indigo-700\"\n >\n 🔧 Admin Dashboard\n \n )}\n\n {/* Logout */}\n \n Sign Out\n \n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/Adesanya/Job/code/frontend/components/Profile.tsx","extension","actionData","errors"]