[V0_FILE]typescriptreact:file="components/page-shell.tsx" isMerged="true" import type React from "react" import { ECHeader } from "./ec-header" export default function PageShell({ title, subtitle, children, }: { title: string subtitle?: string children: React.ReactNode }) { return (

{title}

{subtitle ?

{subtitle}

: null}

{children}

) } [V0_FILE]typescriptreact:file="components/otp-input.tsx" isMerged="true" "use client" import * as React from "react" import { Input } from "@/components/ui/input" export function OtpInput({ length = 6, onChange, }: { length?: number onChange?: (value: string) => void }) { const [values, setValues] = React.useState(Array.from({ length }, () => "")) const refs = React.useRef<(HTMLInputElement | null)[]>([]) const update = (idx: number, char: string) => { const next = [...values] next[idx] = char.replace(/\D/g, "").slice(0, 1) setValues(next) onChange?.(next.join("")) if (char && idx < length - 1) refs.current[idx + 1]?.focus() } const handleKeyDown = (idx: number, e: React.KeyboardEvent) => { if (e.key === "Backspace" && !values[idx] && idx > 0) { refs.current[idx - 1]?.focus() } if (e.key === "ArrowLeft" && idx > 0) refs.current[idx - 1]?.focus() if (e.key === "ArrowRight" && idx < length - 1) refs.current[idx + 1]?.focus() } return (

{values.map((v, i) => ( (refs.current[i] = el)} inputMode="numeric" aria-label={`OTP digit ${i + 1}`} className="h-10 w-10 text-center" maxLength={1} value={v} onChange={(e) => update(i, e.target.value)} onKeyDown={(e) => handleKeyDown(i, e)} /> ))}

) } [V0_FILE]typescriptreact:file="components/captcha.tsx" isMerged="true" import Image from "next/image" import { Button } from "@/components/ui/button" import { RotateCcw } from "lucide-react" export function Captcha({ label = "Enter CAPTCHA", }: { label?: string }) { return (

{label}

) } [V0_FILE]typescriptreact:file="components/biometric-option-card.tsx" isMerged="true" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import Link from "next/link" import { Fingerprint, ScanFace, ScanEye } from "lucide-react" type Kind = "face" | "fingerprint" | "iris" const iconMap: Record = { face: ScanFace, fingerprint: Fingerprint, iris: ScanEye, } export function BiometricOptionCard({ kind, title, description, href, }: { kind: Kind title: string description: string href: string }) { const Icon = iconMap[kind] return (

{title}

{description} ) } [V0_FILE]typescriptreact:file="components/vote/candidate-card.tsx" isMerged="true" "use client" import Image from "next/image" import { Button } from "@/components/ui/button" import { CheckCircle2 } from "lucide-react" export function CandidateCard({ party, candidate, selected, onSelect, symbolQuery, }: { party: string candidate: string selected?: boolean onSelect?: () => void symbolQuery: string }) { return (

Election Symbols

{party}

{candidate}

{selected ? (

Selected

) : ( )}

) } [V0_FILE]typescriptreact:file="app/registration/aadhaar/page.tsx" isEdit="true" isMerged="true" "use client" import { ECHeader } from "@/components/ec-header" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { Captcha } from "@/components/captcha" import { OtpInput } from "@/components/otp-input" import { QrCode } from "lucide-react" import Link from "next/link" import { useState } from "react" export default function RegistrationAadhaarPage() { const [otp, setOtp] = useState("") return (

Registration - Remote Voting System

Your Aadhaar number is required for voter verification. This information is secure and encrypted.

☑ Enter Aadhaar Number

12-Digit Aadhaar Number

0/12 digits entered

Enter 6-digit OTP

Time remaining: 3:58

) } [V0_FILE]typescriptreact:file="app/registration/platform/page.tsx" isMerged="true" "use client" import type React from "react" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Label } from "@/components/ui/label" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" import { Button } from "@/components/ui/button" import Link from "next/link" import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group" import { MapPin, Monitor } from "lucide-react" import { useState } from "react" export default function VotingPlatformPage() { const [platform, setPlatform] = useState<"web" | "kiosk" | undefined>() return ( Choose the Platform Select your preferred voting method

Select the Constituency

setPlatform(v as any)} className="grid gap-4 sm:grid-cols-2"> {platform === "kiosk" ? (

Available Kiosk Center

Address: White House, Suite No 814 to 816, Block-III, Kundanbagh Colony, Begumpet, Hyderabad, Telangana 500016

) : null}

) } function Option({ value, title, description, icon, }: { value: string title: string description: string icon: React.ReactNode }) { return (

{icon}

{title}

{description}

) } [V0_FILE]typescriptreact:file="app/registration/confirm/page.tsx" isMerged="true" "use client" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Checkbox } from "@/components/ui/checkbox" import { Button } from "@/components/ui/button" import Link from "next/link" import { useState } from "react" export default function RegistrationConfirmationPage() { const [consent, setConsent] = useState({ data: true, comms: false, aadhaar: true, terms: true, }) const allRequired = consent.data && consent.aadhaar && consent.terms return ( Review & Consent Your privacy and security are our top priorities. setConsent((c) => ({ ...c, data: Boolean(v) }))} required /> setConsent((c) => ({ ...c, comms: Boolean(v) }))} /> setConsent((c) => ({ ...c, aadhaar: Boolean(v) }))} required /> setConsent((c) => ({ ...c, terms: Boolean(v) }))} required />

) } function Consent({ label, description, checked, onCheckedChange, required, }: { label: string description: string checked?: boolean onCheckedChange?: (v: boolean) => void required?: boolean }) { return (

{label} {required ? (Required) : null}

{description}

) } [V0_FILE]typescriptreact:file="app/registration/success/page.tsx" isMerged="true" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { CheckCircle2 } from "lucide-react" export default function RegistrationSuccessPage() { return ( Application ID: REG2024001234567 What's Next?

Your application will be reviewed by election officials
You may be contacted for additional verification if needed
Once approved, your voter ID will be updated
You'll receive final confirmation via SMS and email

) } [V0_FILE]typescriptreact:file="app/verification/aadhaar/page.tsx" isMerged="true" "use client" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { Captcha } from "@/components/captcha" import { OtpInput } from "@/components/otp-input" import Link from "next/link" import { useState } from "react" export default function VerificationAadhaarPage() { const [otp, setOtp] = useState("") return ( Enter Aadhaar Number 12-Digit Aadhaar Number

0/12 digits entered

Enter 6-digit OTP

Time remaining: 3:58

) } [V0_FILE]typescriptreact:file="app/verification/epic/page.tsx" isMerged="true" import PageShell from "@/components/page-shell" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Label } from "@/components/ui/label" import { Input } from "@/components/ui/input" import { Badge } from "@/components/ui/badge" import { Button } from "@/components/ui/button" import Link from "next/link" export default function VerificationEpicPage() { return ( मतदाता का विवरण / Details of Voter EPIC

Voting Status: Eligible

Voting Time: 7:00 AM - 6:00 PM

) } function Field({ label, value, className }: { label: string; value: string; className?: string }) { return (

{label}

) } [V0_FILE]typescriptreact:file="app/verification/biometric/page.tsx" isMerged="true" import PageShell from "@/components/page-shell" import { BiometricOptionCard } from "@/components/biometric-option-card" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" export default function BiometricSelectionPage() { return ( Application ID: REG2024001234567 ) } [V0_FILE]typescriptreact:file="app/verification/biometric/face/page.tsx" isMerged="true" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { Button } from "@/components/ui/button" import Link from "next/link" export default function FaceVerificationPage() { return ( Application ID: REG2024001234567 Align your face within the frame for verification

Connected Face Matched and Verified

) } [V0_FILE]typescriptreact:file="app/verification/biometric/fingerprint/page.tsx" isMerged="true" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { Button } from "@/components/ui/button" import Link from "next/link" export default function FingerprintVerificationPage() { return ( Application ID: REG2024001234567 Place your finger on the scanner device

Connected Finger Matched and Verified

) } [V0_FILE]typescriptreact:file="app/verification/biometric/iris/page.tsx" isMerged="true" import PageShell from "@/components/page-shell" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { Button } from "@/components/ui/button" import Link from "next/link" export default function IrisVerificationPage() { return ( Application ID: REG2024001234567 Align your eyes with the scanner guides

Connected Eye Scan Confirmed and Authenticated

) } [V0_FILE]typescriptreact:file="app/vote/page.tsx" isMerged="true" "use client" import PageShell from "@/components/page-shell" import { CandidateCard } from "@/components/vote/candidate-card" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { useState } from "react" type Candidate = { id: string party: string candidate: string symbolQuery: string } const candidates: Candidate[] = [ { id: "bjp", party: "Bharatiya Janata Party", candidate: "Dr. Priya Sharma", symbolQuery: "Lotus%20Party%20Symbol" }, { id: "inc", party: "Indian National Congress", candidate: "Rajesh Kumar", symbolQuery: "Hand%20Party%20Symbol" }, { id: "sp", party: "Samaj Badi Party", candidate: "Sunita Devi", symbolQuery: "Bicycle%20Symbol" }, { id: "aap", party: "Aam Aadmi Party", candidate: "Aravind Kejribaal", symbolQuery: "Broom%20Symbol" }, { id: "bsp", party: "Bahujan Party", candidate: "Maya bati", symbolQuery: "Elephant%20Symbol" }, { id: "nota", party: "None of the Above", candidate: "NOTA", symbolQuery: "NOTA" }, ] export default function VotePage() { const [selected, setSelected] = useState(null) return ( Select your preferred candidate and confirm your choice Your vote will be recorded anonymously and securely. {candidates.map((c) => ( setSelected(c.id)} /> ))}

) } [V0_FILE]png:file="public/abstract-geometric-shapes.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/abstract-geometric-shapes-sUE5R8SURiS0JAVLKZSgt58oSNZSJI.png" isMerged="true" [V0_FILE]jpg:file="public/camera-preview.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/camera-preview-jFCRoGSGnZFI1Na4Qmf4ujvCHyW2Q8.jpg" isMerged="true" [V0_FILE]jpg:file="public/fingerprint-scanner.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/fingerprint-scanner-UgZJAwg7ZyY7YWtq1WeXdolnXBnhPq.jpg" isMerged="true" [V0_FILE]jpg:file="public/iris-scanner.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/iris-scanner-BFmOPAA76oHG5tg1wxLAqOomPdwzya.jpg" isMerged="true" [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "geist": "^1.3.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "14.2.25", "next-themes": "^0.4.6", "react": "^19", "react-day-picker": "9.8.0", "react-dom": "^19", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.67" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]css:file="app/globals.css" isFixed="true" isEdit="true" isQuickEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { /* optional: --font-sans, --font-serif, --font-mono if they are applied in the layout.tsx */ --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } [V0_FILE]typescriptreact:file="app/layout.tsx" isQuickEdit="true" isMerged="true" import type React from "react" import type { Metadata } from "next" import { DM_Sans, Space_Grotesk } from "next/font/google" import "./globals.css" export const metadata: Metadata = { title: "v0 App", description: "Created with v0", generator: "v0.app", } const dmSans = DM_Sans({ subsets: ["latin"], display: "swap", variable: "--font-dm-sans", }) const spaceGrotesk = Space_Grotesk({ subsets: ["latin"], display: "swap", variable: "--font-space-grotesk", }) export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/registration/epic/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" import { ECHeader } from "@/components/ec-header" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Label } from "@/components/ui/label" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import Link from "next/link" export default function RegistrationEpicDataPage() { return (

Registration - Remote Voting System

Your Aadhaar number is required for voter verification. This information is secure and encrypted.

मतदाता का विवरण / Details of Voter EPIC

Note: This information has been fetched from the Election Commission database using your Aadhaar details. Please verify all information is correct before proceeding.

) } function Field({ label, value, className }: { label: string; value: string; className?: string }) { return (

{label}

) } [V0_FILE]typescriptreact:file="components/ec-header.tsx" isEdit="true" isMerged="true" "use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" const states = ["Telangana", "Madhya Pradesh", "Delhi", "Karnataka", "Gujarat"] const languages = ["English (Default)", "हिन्दी (Hindi)", "తెలుగు (Telugu)"] export function ECHeader() { const [selectedLanguage, setSelectedLanguage] = useState("English (Default)") const [fontSize, setFontSize] = useState(16) const handleLanguageChange = (language: string) => { setSelectedLanguage(language) console.log("[v0] Language changed to:", language) } const increaseFontSize = () => { setFontSize((prev) => Math.min(prev + 2, 24)) document.documentElement.style.fontSize = `${fontSize + 2}px` } const decreaseFontSize = () => { setFontSize((prev) => Math.max(prev - 2, 12)) document.documentElement.style.fontSize = `${fontSize - 2}px` } return (

{/* ECI Logo placeholder */}

ECI

भारत निर्वाचन आयोग Election Commission of India

Choose Your State

Choose Your Language

2025 Telangana Legislative Assembly Election

एक देश एक चुनाव

Remote Voting System

) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" "use client" import { useState } from "react" import { ECHeader } from "@/components/ec-header" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { Checkbox } from "@/components/ui/checkbox" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" type ModalType = "registration" | "verification" | "vote" | null type RegistrationStep = "aadhaar" | "epic" | "platform" | "confirm" | "success" type VerificationStep = "aadhaar" | "epic" | "biometric" | "face" | "fingerprint" | "iris" export default function HomePage() { const [activeModal, setActiveModal] = useState(null) const [registrationStep, setRegistrationStep] = useState("aadhaar") const [verificationStep, setVerificationStep] = useState("aadhaar") const [isVerificationComplete, setIsVerificationComplete] = useState(false) const [aadhaarNumber, setAadhaarNumber] = useState("") const [otp, setOtp] = useState("") const [captcha, setCaptcha] = useState("") const [otpTimer, setOtpTimer] = useState(238) // 3:58 as shown in PDF const [selectedCandidate, setSelectedCandidate] = useState(null) const [showVoteConfirmation, setShowVoteConfirmation] = useState(false) const [voteSubmitted, setVoteSubmitted] = useState(false) const [voteError, setVoteError] = useState("") const candidates = [ { party: "Bharatiya Janata Party", candidate: "Dr. Priya Sharma", symbol: "🪷" }, { party: "Indian National Congress", candidate: "Rajesh Kumar", symbol: "✋" }, { party: "Samaj Badi Party", candidate: "Sunita Devi", symbol: "🚲" }, { party: "Aam Adami Party", candidate: "Aravind Kejriwal", symbol: "🧹" }, { party: "Bahujan Party", candidate: "Maya bati", symbol: "🐘" }, { party: "NOTA", candidate: "None of the Above", symbol: "❌" }, ] const formatTime = (seconds: number) => { const mins = Math.floor(seconds / 60) const secs = seconds % 60 return `${mins}:${secs.toString().padStart(2, "0")}` } const renderRegistrationModal = () => { switch (registrationStep) { case "aadhaar": return (

Your Aadhaar number is required for voter verification. This information is secure and encrypted.

Enter Aadhaar Number setAadhaarNumber(e.target.value)} maxLength={12} />

{aadhaarNumber.length}/12 digits entered

Enter CAPTCHA

setCaptcha(e.target.value)} />

ABCDFR8

{aadhaarNumber.length > 0 && (

Enter 6-digit OTP setOtp(e.target.value)} maxLength={6} />

Time remaining: {formatTime(otpTimer)}

)}

) case "epic": return (

This information has been fetched from the Election Commission database using your Aadhaar details. Please verify all information is correct before proceeding.

मतदाता का विवरण / Details of Voter EPIC

First Name: KEHAR SINGH

Relative's First Name: NANHESINGH

State: Madhya Pradesh

EPIC No: ZRM5784056

Gender: Male

Assembly Constituency: 56-JABERA

Parliamentary Constituency: 7-DAMOH

Polling Station: GOVT. PRIMARY SCHOOL BUILDING, PATNA DURG

) case "platform": return (

Choose the Platform You want to Cast the Vote

Web Portal

Kiosk Center

Select the Constituency

Available Kiosk Center
Address: White House, Suite No 814 to 816, Block- III, Kundanbagh Colony, Begumpet, Hyderabad, Telangana 500016

) case "confirm": return (

Registration Confirmation (Data Consent & Permissions)

Please review and provide your consent for the following items to complete your voter registration.

) case "success": return (

✓

Registration Confirmed

Application ID: REG2024001234567

Registration Submitted Successfully!

What's Next?

Your application will be reviewed by election officials
You may be contacted for additional verification if needed
Once approved, your voter ID will be updated
You'll receive final confirmation via SMS and email

) default: return null } } const renderVerificationModal = () => { switch (verificationStep) { case "aadhaar": return (

Your Aadhaar number is required for voter verification. This information is secure and encrypted.

Enter Aadhaar Number setAadhaarNumber(e.target.value)} maxLength={12} />

{aadhaarNumber.length}/12 digits entered

Enter CAPTCHA

setCaptcha(e.target.value)} />

ABCDFR8

{aadhaarNumber.length > 0 && (

Enter 6-digit OTP setOtp(e.target.value)} maxLength={6} />

Time remaining: {formatTime(otpTimer)}

)}

) case "epic": return (

This information has been fetched from the Election Commission database using your Aadhaar details. Please verify all information is correct before proceeding.

मतदाता का विवरण / Details of Voter EPIC

Application ID: REG2024001234567

Voting Date: 2025-09-19

First Name: KEHAR SINGH

Relative's First Name: NANHESINGH

State: Madhya Pradesh

EPIC No: ZRM5784056

Gender: Male

Assembly Constituency: 56-JABERA

Parliamentary Constituency: 7-DAMOH

Polling Station: GOVT. PRIMARY SCHOOL BUILDING, PATNA DURG

Voting Status: ✓ Eligible

Voting Time: 7:00 AM - 6:00 PM

You are eligible to vote! Please proceed to biometric authentication to access the voting system.

) case "biometric": return (

Biometric Authentication

Biometric Authentication is required for secure voting access. Please select your preferred method.

Application ID: REG2024001234567

) case "face": case "fingerprint": case "iris": const authType = verificationStep === "face" ? "Face" : verificationStep === "fingerprint" ? "Finger" : "Eye Scan" return (

Biometric Authentication

Application ID: REG2024001234567

✓ Connected

{verificationStep === "face" ? "📷" : verificationStep === "fingerprint" ? "👆" : "👁️"}

{authType} {verificationStep === "iris" ? "Confirmed and Authenticated" : "Matched and Verified"}

) default: return null } } const renderVoteModal = () => { if (showVoteConfirmation && selectedCandidate) { const candidate = candidates.find((c) => c.candidate === selectedCandidate) return (

Confirm Your Vote

Please review your selection carefully. Once confirmed, your vote cannot be changed.

{candidate?.symbol}

{candidate?.party}

{candidate?.candidate}

⚠️ Warning: This action is irreversible. Please confirm that this is your final choice.

{voteError && (

{voteError}

)}

) } return (

Cast Your Vote Securely

Select your preferred candidate and confirm your choice. Your vote will be recorded anonymously and securely.

Time left: 4:59:59 Seconds

{voteError && (

{voteError}

)}

{candidates.map((candidate, index) => (

{candidate.symbol}

{candidate.party}

{candidate.candidate}

))}

{!selectedCandidate && (

ℹ️ Please select a candidate from the list above to proceed with voting.

)}

) } return (

2025 Telangana Legislative Assembly Election

Voter Registration From 25/07/2025 To 25/08/2025

{/* Registration Card */}

📝

Registration {/* Check Status Card */}

✓

Check Your Status {/* Cast Vote Card */}

🗳️

Cast Vote

एक देश एक चुनाव

One Nation, One Election

{/* Registration Modal */} {/* Verification Modal */} {/* Vote Modal */}

) }