import { useState } from "react";
import { Card, CardContent } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { motion } from "framer-motion";
export default function ForexDecisionApp() {
const [step, setStep] = useState(0);
const [answers, setAnswers] = useState({});
const questions = [
{
text: "What is the market structure?",
options: ["Bullish", "Bearish", "Range"],
},
{
text: "Did the market grab sell-side liquidity?",
options: ["Yes", "No"],
condition: (answers) => answers[0] === "Bullish",
},
{
text: "Did the market grab buy-side liquidity?",
options: ["Yes", "No"],
condition: (answers) => answers[0] === "Bearish",
},
{
text: "Do we have an FVG?",
options: ["Yes", "No"],
condition: (answers) => answers[1] === "Yes" || answers[2] === "Yes",
},
];
const handleAnswer = (answer) => {
const updatedAnswers = { ...answers, [step]: answer };
setAnswers(updatedAnswers);
if (answer === "Range") {
setStep(-1); // End immediately if range
} else {
const nextStep = questions.findIndex((q, i) => i > step && (!q.condition || q.condition(updatedAnswers)));
if (nextStep !== -1) {
setStep(nextStep);
} else {
setStep(-1); // No more questions
}
}
};
return (
{step === -1 ? (
{answers[0] === "Range" ? "Do not trade" : "Final Decision Reached"}
) : (
{questions[step].text}
{questions[step].options.map((option, index) => (
))}
)}
);
}