function MainComponent() { const [selectedSpecies, setSelectedSpecies] = React.useState(''); const [temperature, setTemperature] = React.useState(28); const [weight, setWeight] = React.useState(125); const [oxygenConsumption, setOxygenConsumption] = React.useState(''); const [phytoplanktonRespiration, setPhytoplanktonRespiration] = React.useState(''); const [microbialRespiration, setMicrobialRespiration] = React.useState(''); const [sedimentRespiration, setSedimentRespiration] = React.useState(''); const handleChange = (event)=>{ setSelectedSpecies(event.target.value); }; const calculateRates = ()=>{ const T = temperature; const W = weight; const Sd = 0.37; const Nr = 28; const KNR = 0.1 * Math.pow(1.08, T - 20); const Z = 1.0; const Kom = 1.5; const Ksed = 0.008; const Fr = 2014.45 + 2.75 * W - 165.2 * T + 0.007 * Math.pow(W, 2) * T - 0.21 * W * T; const SDD = 0.37; let oxygenRate; if (selectedSpecies === 'Catfish') { oxygenRate = Math.pow(10, -0.999 - 0.000957 * W + 0.0000006 * Math.pow(W, 2) + 0.0327 * T - 0.0000087 * Math.pow(T, 2) + 0.00000003 * W * T); } else { oxygenRate = Fr * Sd / 1000; } const phytoRate = -1.133 + 0.0038 * SDD + 0.000014 * Math.pow(SDD, 2) + 0.081 * T - 0.000749 * T * T - 0.00035 * SDD * T; const microbialRate = 4.57 * KNR * Nr / 1000; const sedimentRate = Ksed / 1000 * Math.pow(1.065, T - 20) * Z; setOxygenConsumption(oxygenRate.toFixed(2)); setPhytoplanktonRespiration(Math.pow(10, phytoRate).toFixed(2)); setMicrobialRespiration(microbialRate.toFixed(2)); setSedimentRespiration(sedimentRate.toFixed(2)); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center space-y-4 p-4", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-xs", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg font-roboto", __source: { fileName: "", lineNumber: 47, columnNumber: 17 }, __self: this }, "Select Fish Species:"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 mt-2 border border-gray-300 rounded-md", name: "fishSpecies", onChange: handleChange, value: selectedSpecies, __source: { fileName: "", lineNumber: 48, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 54, columnNumber: 21 }, __self: this }, "Choose a species"), /*#__PURE__*/ React.createElement("option", { value: "Catfish", __source: { fileName: "", lineNumber: 55, columnNumber: 21 }, __self: this }, "Catfish"), /*#__PURE__*/ React.createElement("option", { value: "Tilapia", __source: { fileName: "", lineNumber: 56, columnNumber: 21 }, __self: this }, "Tilapia"), /*#__PURE__*/ React.createElement("option", { value: "Carps", __source: { fileName: "", lineNumber: 57, columnNumber: 21 }, __self: this }, "Carps"), /*#__PURE__*/ React.createElement("option", { value: "Koi", __source: { fileName: "", lineNumber: 58, columnNumber: 21 }, __self: this }, "Koi"), /*#__PURE__*/ React.createElement("option", { value: "Shol", __source: { fileName: "", lineNumber: 59, columnNumber: 21 }, __self: this }, "Shol")), /*#__PURE__*/ React.createElement("button", { className: "mt-4 p-2 bg-blue-500 text-white rounded-md", onClick: calculateRates, __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, "Calculate Rates"), selectedSpecies && /*#__PURE__*/ React.createElement("div", { className: "mt-4 space-y-2 font-roboto", __source: { fileName: "", lineNumber: 68, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 69, columnNumber: 25 }, __self: this }, "Oxygen Consumption Rate: ", oxygenConsumption, " g O2/kg fish/hr"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 70, columnNumber: 25 }, __self: this }, "Phytoplankton Respiration Rate: ", phytoplanktonRespiration, " g O2/m^2/hr"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 71, columnNumber: 25 }, __self: this }, "Microbial Respiration Rate: ", microbialRespiration, " g O2/m^2/hr"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 72, columnNumber: 25 }, __self: this }, "Sediment Respiration Rate: ", sedimentRespiration, " g O2/m^2/hr")))); }