function MainComponent() { const speciesData = [ { name: 'Rohu (Labeo rohita)', a: 0.0612, b: -0.209, c: 0.0613, k: 2.5, p: 0.6 }, { name: 'Catla (Catla catla)', a: 0.0541, b: -0.192, c: 0.0597, k: 2.7, p: 0.5 }, { name: 'Mrigal (Cirrhinus mrigala)', a: 0.0459, b: -0.174, c: 0.0611, k: 2.8, p: 0.6 }, { name: 'Grass carp (Ctenopharyngodon idella)', a: 0.0456, b: -0.195, c: 0.0481, k: 2.7, p: 0.5 }, { name: 'Silver carp (Hypophthalmichthys molitrix)', a: 0.0442, b: -0.186, c: 0.0475, k: 2.5, p: 0.5 }, { name: 'Bighead carp (Hypophthalmichthys nobilis)', a: 0.0456, b: -0.192, c: 0.0487, k: 2.6, p: 0.6 }, { name: 'Pangasius (Pangasius hypophthalmus)', a: 0.0693, b: -0.248, c: 0.06, k: 2.5, p: 0.5 }, { name: 'Nile Tilapia (Oreochromis niloticus)', a: 0.0801, b: -0.272, c: 0.0604, k: 2.0, p: 0.5 }, { name: 'Rainbow Trout (Oncorhynchus mykiss)', a: 0.0275, b: -0.211, c: 0.0613, k: 3.0, p: 0.6 }, { name: 'Channel Catfish', a: 0.0402, b: -0.166, c: 0.0475, k: 3.0, p: 0.5 } ]; const [result, setResult] = React.useState(null); function calculateFeedingRate(event) { event.preventDefault(); const formData = new FormData(event.target); const selectedSpeciesName = formData.get('species'); const weight = parseFloat(formData.get('weight')); const temperature = parseFloat(formData.get('temperature')); const dissolvedOxygen = parseFloat(formData.get('dissolvedOxygen')); const proteinContent = parseFloat(formData.get('proteinContent')); const selectedSpecies = speciesData.find((species)=>species.name === selectedSpeciesName); const { a, b, c, k, p } = selectedSpecies; const d = 0.1; const expPart = Math.exp(c * temperature); const doPart = (dissolvedOxygen / (dissolvedOxygen + k)) ** p; const proteinPart = 1 + d * proteinContent; const feedingRate = a * weight ** b * expPart * doPart * proteinPart * 10; setResult(feedingRate.toFixed(4)); } return /*#__PURE__*/ React.createElement("div", { className: "p-8 font-roboto", __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold mb-4", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, "Calculate Feeding Rate"), /*#__PURE__*/ React.createElement("form", { className: "grid grid-cols-1 gap-4", onSubmit: calculateFeedingRate, __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "Fish Species"), /*#__PURE__*/ React.createElement("select", { name: "species", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, speciesData.map((species)=>/*#__PURE__*/ React.createElement("option", { key: species.name, value: species.name, __source: { fileName: "", lineNumber: 46, columnNumber: 15 }, __self: this }, species.name)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, "Fish Body Weight (g)"), /*#__PURE__*/ React.createElement("input", { name: "weight", type: "number", step: "0.01", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, "Water Temperature (°C)"), /*#__PURE__*/ React.createElement("input", { name: "temperature", type: "number", step: "0.01", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "Dissolved Oxygen Concentration (mg/L)"), /*#__PURE__*/ React.createElement("input", { name: "dissolvedOxygen", type: "number", step: "0.01", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "Protein Content in Feed (%)"), /*#__PURE__*/ React.createElement("input", { name: "proteinContent", type: "number", step: "0.01", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-4 bg-blue-500 text-white py-2 px-4 rounded", __source: { fileName: "", lineNumber: 66, columnNumber: 9 }, __self: this }, "Calculate")), result && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-green-100 text-green-700 rounded", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, "Feeding Rate: ", result, "% body weight per day")); }