function MainComponent() { const [teamA, setTeamA] = React.useState(''); const [teamB, setTeamB] = React.useState(''); const [scoreA, setScoreA] = React.useState(''); const [scoreB, setScoreB] = React.useState(''); const [submitted, setSubmitted] = React.useState(false); const handleSubmit = (event)=>{ event.preventDefault(); setSubmitted(true); }; const handleTeamAChange = (event)=>{ setTeamA(event.target.value); }; const handleTeamBChange = (event)=>{ setTeamB(event.target.value); }; const handleScoreAChange = (event)=>{ setScoreA(event.target.value); }; const handleScoreBChange = (event)=>{ setScoreB(event.target.value); }; const resetForm = ()=>{ setTeamA(''); setTeamB(''); setScoreA(''); setScoreB(''); setSubmitted(false); }; if (submitted) { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center h-screen bg-[#f7f7f7]", __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "border-[#dddddd] shadow-lg rounded-lg p-6 bg-white w-full max-w-xl", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, "Prognosis for Football 2024"), /*#__PURE__*/ React.createElement("div", { className: "mb-4 font-roboto", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this }, teamA, " vs ", teamB), /*#__PURE__*/ React.createElement("p", { className: "text-lg", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "Predicted Score: ", scoreA, " - ", scoreB), /*#__PURE__*/ React.createElement("button", { className: "mt-4 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded", onClick: resetForm, __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, "Make another prediction")))); } return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center h-screen bg-[#f7f7f7]", __source: { fileName: "", lineNumber: 64, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "border-[#dddddd] shadow-lg rounded-lg p-6 bg-white w-full max-w-xl", __source: { fileName: "", lineNumber: 65, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, "Football Prognosis 2024"), /*#__PURE__*/ React.createElement("label", { className: "block mb-2 text-sm font-bold font-roboto", __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }, "Team A Name"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "teamA", value: teamA, onChange: handleTeamAChange, className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("label", { className: "block mt-4 mb-2 text-sm font-bold font-roboto", __source: { fileName: "", lineNumber: 82, columnNumber: 9 }, __self: this }, "Team B Name"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "teamB", value: teamB, onChange: handleTeamBChange, className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", __source: { fileName: "", lineNumber: 85, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex mt-4 mb-6", __source: { fileName: "", lineNumber: 92, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 mr-2", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-bold font-roboto", __source: { fileName: "", lineNumber: 94, columnNumber: 13 }, __self: this }, "Team A Score"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "scoreA", value: scoreA, onChange: handleScoreAChange, className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 focus:outline-none focus:shadow-outline", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-1 ml-2", __source: { fileName: "", lineNumber: 105, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-bold font-roboto", __source: { fileName: "", lineNumber: 106, columnNumber: 13 }, __self: this }, "Team B Score"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "scoreB", value: scoreB, onChange: handleScoreBChange, className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 focus:outline-none focus:shadow-outline", __source: { fileName: "", lineNumber: 109, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded w-full", __source: { fileName: "", lineNumber: 118, columnNumber: 9 }, __self: this }, "Submit Prediction"))); }