diff --git a/src/components/EmptyState.tsx b/src/components/EmptyState.tsx index 0592d974..ec5a2767 100644 --- a/src/components/EmptyState.tsx +++ b/src/components/EmptyState.tsx @@ -6,7 +6,7 @@ import { Sparkles } from "lucide-react" import { cn } from "@/lib/utils" import { Button } from "@/components/ui/button" -export * from "@/components/EmptyState" + export interface StellarWaveEmptyStateProps { title?: string diff --git a/src/pages/BetForm.test.tsx b/src/pages/BetForm.test.tsx index e02bfb72..484bdd4e 100644 --- a/src/pages/BetForm.test.tsx +++ b/src/pages/BetForm.test.tsx @@ -49,4 +49,11 @@ describe("BetForm", () => { expect(screen.getByText(/Bet placed successfully!/i)).toBeInTheDocument(); }); }); + + it("renders the empty state when campaign is not active", () => { + render(); + expect(screen.getByText(/No Stellar Wave data yet/i)).toBeInTheDocument(); + expect(screen.queryByRole("heading", { name: /Place Your Bet/i })).not.toBeInTheDocument(); + }); }); + diff --git a/src/pages/BetForm.tsx b/src/pages/BetForm.tsx index ce065a76..e16b84af 100644 --- a/src/pages/BetForm.tsx +++ b/src/pages/BetForm.tsx @@ -3,10 +3,15 @@ import { LiveRegion } from "@/components/LiveRegion"; import { Card, CardContent } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; import { Loader2 } from "lucide-react"; +import { StellarWaveEmptyState } from "@/components/EmptyState"; type FormState = "idle" | "submitting" | "success" | "error"; -export default function BetForm() { +export interface BetFormProps { + campaignActive?: boolean; +} + +export default function BetForm({ campaignActive = true }: BetFormProps = {}) { const [formState, setFormState] = useState("idle"); const [announcement, setAnnouncement] = useState(""); const [amount, setAmount] = useState(""); @@ -33,9 +38,13 @@ export default function BetForm() { return (
- + {!campaignActive ? ( + + ) : ( + <> + - +

Place Your Bet

@@ -86,6 +95,7 @@ export default function BetForm() { )}
+ )}
); }