// HoroscopeCalculator.tsx
import { useState } from "react";
import { Card, CardContent } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea";
export default function HoroscopeCalculator() {
const [dob, setDob] = useState("");
const [tob, setTob] = useState("");
const [pob, setPob] = useState("");
const [horoscope, setHoroscope] = useState("");
const handleSubmit = async () => {
// TODO: Send data to backend for horoscope calculation
const data = {
dateOfBirth: dob,
timeOfBirth: tob,
placeOfBirth: pob,
};
const res = await fetch("/api/horoscope", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(data),
});
const result = await res.json();
setHoroscope(result.horoscope || "No data received.");
};
return (
)}
);
}
🪐 Horoscope Calculator
setDob(e.target.value)} />
setTob(e.target.value)} />
setPob(e.target.value)}
/>
{horoscope && (