\n {renderContent()}\n \n

\n );\n}\n\nfunction HomePage({ onRegisterClick, onReferralClick }) {\n return (\n

🌐 Nelo Digital Services

Cheapest Data, E-pins, Cable TV, and Utility Payments

\n \n \n

\n );\n}\n\nfunction RegisterForm({ onRegister }) {\n const [formData, setFormData] = useState({\n username: '',\n email: '',\n phone: '',\n password: '',\n referralCode: ''\n });\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n try {\n const response = await fetch('/register', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(formData)\n });\n\n if (response.ok) {\n const userData = await response.json();\n onRegister(userData);\n } else {\n alert('Registration failed');\n }\n } catch (error) {\n console.error('Registration error:', error);\n alert('Registration failed');\n }\n };\n\n return (\n \n );\n}\n\nfunction Dashboard({ user, onPurchase, onGenerateEpin }) {\n const [balance, setBalance] = useState(0);\n const [referralLink, setReferralLink] = useState('');\n\n useEffect(() => {\n // Fetch user balance and generate referral link\n const generateReferralLink = () => {\n const baseUrl = 'https://nelo.digital/register?ref=';\n setReferralLink(`${baseUrl}${user.username}`);\n };\n\n generateReferralLink();\n }, [user]);\n\n return (\n

👋 Welcome, {user?.username}

💰 Balance: ₦{balance.toFixed(2)}

\n \n

\n \n \n

\n );\n}\n\nfunction PurchaseOptions({ user }) {\n const services = [\n { \n id: 'data', \n name: '📡 Mobile Data', \n providers: [\n { name: 'MTN', plans: [\n { size: '1GB', price: 500 },\n { size: '5GB', price: 2000 }\n ]},\n { name: 'Airtel', plans: [\n { size: '2GB', price: 1000 },\n { size: '10GB', price: 3500 }\n ]}\n ]\n },\n { \n id: 'cable', \n name: '📺 Cable Subscription', \n providers: [\n { name: 'DSTV', plans: [\n { name: 'Compact', price: 6900 },\n { name: 'Compact Plus', price: 10500 }\n ]},\n { name: 'GoTV', plans: [\n { name: 'Lite', price: 2000 },\n { name: 'Max', price: 4500 }\n ]}\n ]\n },\n { \n id: 'utility', \n name: '💡 Utility Bills', \n providers: [\n { name: 'Electricity', regions: ['Lagos', 'Abuja', 'Port Harcourt'] },\n { name: 'Water', regions: ['Lagos', 'Ibadan'] }\n ]\n }\n ];\n\n const [selectedService, setSelectedService] = useState(null);\n\n return (\n

🛒 Purchase Services

\n {services.map(service => (\n

setSelectedService(service)}\n style={styles.serviceCard}\n >\n

{service.name}

\n ))}\n {selectedService && (\n

Select {selectedService.name} Provider

\n {selectedService.providers.map(provider => (\n

{provider.name}

\n {provider.plans && provider.plans.map(plan => (\n

\n {plan.size && `${plan.size} - `}\n {plan.name && `${plan.name} - `}\n ₦{plan.price}\n \n

\n ))}\n

\n )}\n

\n );\n}\n\nfunction EpinGenerator({ user }) {\n const [epinDetails, setEpinDetails] = useState({\n type: 'data',\n amount: 0,\n quantity: 1\n });\n const [generatedEpins, setGeneratedEpins] = useState([]);\n\n const generateEpin = () => {\n const newEpins = Array(epinDetails.quantity).fill(null).map(() => ({\n code: Math.random().toString(36).substring(2, 12).toUpperCase(),\n type: epinDetails.type,\n amount: epinDetails.amount,\n created: new Date().toISOString()\n }));\n setGeneratedEpins(newEpins);\n };\n\n return (\n

🎫 E-Pin Generator

\n \n setEpinDetails({...epinDetails, amount: Number(e.target.value)})}\n />\n setEpinDetails({...epinDetails, quantity: Number(e.target.value)})}\n />\n \n

\n {generatedEpins.length > 0 && (\n

Generated E-Pins

\n {generatedEpins.map((epin, index) => (\n

\n Code: {epin.code} | Type: {epin.type} | Amount: ₦{epin.amount}\n \n

\n ))}\n

\n )}\n

\n );\n}\n\nconst styles = {\n container: {\n fontFamily: 'Arial, sans-serif',\n maxWidth: '600px',\n margin: '0 auto',\n padding: '20px',\n textAlign: 'center'\n },\n form: {\n display: 'flex',\n flexDirection: 'column',\n gap: '10px'\n },\n buttonGroup: {\n display: 'flex',\n justifyContent: 'center',\n gap: '10px',\n margin: '10px 0'\n },\n serviceCard: {\n border: '1px solid #ddd',\n margin: '10px 0',\n padding: '15px',\n cursor: 'pointer',\n borderRadius: '5px'\n },\n dashboardStats: {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n margin: '20px 0'\n },\n footer: {\n marginTop: '20px',\n fontSize: '12px'\n },\n sourceLink: {\n color: '#666',\n textDecoration: 'none'\n }\n};\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const KEY = \"NeloDigitalApp\";\n\n // Create users table with additional fields\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_users (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n username TEXT UNIQUE NOT NULL,\n email TEXT UNIQUE NOT NULL,\n phone TEXT NOT NULL,\n password TEXT NOT NULL,\n balance REAL DEFAULT 0,\n referral_code TEXT,\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n // Create epins table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_epins (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n code TEXT UNIQUE NOT NULL,\n type TEXT NOT NULL,\n amount REAL NOT NULL,\n user_id INTEGER,\n used BOOLEAN DEFAULT 0,\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP,\n FOREIGN KEY(user_id) REFERENCES ${KEY}_users(id)\n )\n `);\n\n if (request.method === 'POST') {\n const body = await request.json();\n try {\n await sqlite.execute(\n `INSERT INTO ${KEY}_users (username, email, phone, password, referral_code) VALUES (?, ?, ?, ?, ?)`,\n [body.username, body.email, body.phone, body.password, body.referralCode || null]\n );\n return new Response(JSON.stringify({ \n success: true, \n username: body.username,\n referralLink: `https://nelo.digital/register?ref=${body.username}`\n }), {\n headers: { 'Content-Type': 'application/json' }\n });\n } catch (error) {\n return new Response(JSON.stringify({ error: 'Registration failed' }), { status: 400 });\n }\n }\n\n return new Response(`\n \n \n Nelo Digital Services\n \n \n \n

\n \n \n \n \n `, {\n headers: { 'Content-Type': 'text/html' }\n });\n}","deleted","label",[98],"permalink","https://www.val.town/x/Agbo/NeloDigitalApp/code/main.tsx","extension","actionData","errors"]

🌐 Nelo Digital Services

🔐 Nelo Registration

👋 Welcome, {user?.username}

🛒 Purchase Services

{service.name}

Select {selectedService.name} Provider

{provider.name}

🎫 E-Pin Generator

Generated E-Pins