function MainComponent() { const [loading, setLoading] = React.useState(false); const [customerInput, setCustomerInput] = React.useState(''); const [selectedCompany, setSelectedCompany] = React.useState(''); const [selectedISP, setSelectedISP] = React.useState(''); const handleAutoFill = async ()=>{ setLoading(true); const messages = [ { role: "user", content: customerInput } ]; try { const response = await fetch('/integrations/anthropic-claude/', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages }) }); const data = await response.json(); let companyPrediction = ""; let ispPrediction = ""; if (data.choices?.[0]?.message?.content) { const content = data.choices[0].message.content.toLowerCase(); if (content.includes("ntt") || content.includes("n西") || content.includes("n東") || content.includes("ntt西") || content.includes("ntt東")) { companyPrediction = "NTT"; } else if (content.includes("softbank") || content.includes("sb")) { companyPrediction = "SOFTBANK"; } else if (content.includes("kddi") || content.includes("au")) { companyPrediction = "KDDI"; } if (content.includes("biglobe") || content.includes("びっくろーぶ") || content.includes("びっぐろーぶ")) { ispPrediction = "BIGLOBE"; } else if (content.includes("ocn") || content.includes("おーしーえぬ")) { ispPrediction = "OCN"; } else if (content.includes("plala") || content.includes("ぷらら")) { ispPrediction = "plala"; } else if (content.includes("@nifty") || content.includes("にふてぃ") || content.includes("nifty")) { ispPrediction = "nifty"; } } setSelectedCompany(companyPrediction); setSelectedISP(ispPrediction); } catch (error) { console.error('Error obtaining response:', error); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 49, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "customer-input", className: "block mb-2 font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, "お客様の発言:"), /*#__PURE__*/ React.createElement("input", { id: "customer-input", name: "customerInput", className: "w-full p-2 border border-gray-300 rounded", value: customerInput, onChange: (e)=>setCustomerInput(e.target.value), __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: `px-4 py-2 rounded text-white ${loading ? 'bg-gray-500' : 'bg-blue-500'}`, onClick: handleAutoFill, disabled: loading, __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, loading ? '読み込み中...' : 'AIで自動入力'), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 67, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "company-select", className: "block mb-2 font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 68, columnNumber: 9 }, __self: this }, "回線会社:"), /*#__PURE__*/ React.createElement("select", { id: "company-select", name: "company", value: selectedCompany, className: "w-full p-2 border border-gray-300 rounded", onChange: (e)=>setSelectedCompany(e.target.value), __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, "選択してください"), /*#__PURE__*/ React.createElement("option", { value: "NTT", __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, "NTT"), /*#__PURE__*/ React.createElement("option", { value: "SOFTBANK", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, "SOFTBANK"), /*#__PURE__*/ React.createElement("option", { value: "KDDI", __source: { fileName: "", lineNumber: 79, columnNumber: 11 }, __self: this }, "KDDI"))), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 82, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "isp-select", className: "block mb-2 font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, "ISP:"), /*#__PURE__*/ React.createElement("select", { id: "isp-select", name: "isp", value: selectedISP, className: "w-full p-2 border border-gray-300 rounded", onChange: (e)=>setSelectedISP(e.target.value), __source: { fileName: "", lineNumber: 84, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, "選択してください"), /*#__PURE__*/ React.createElement("option", { value: "BIGLOBE", __source: { fileName: "", lineNumber: 92, columnNumber: 11 }, __self: this }, "BIGLOBE"), /*#__PURE__*/ React.createElement("option", { value: "OCN", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, "OCN"), /*#__PURE__*/ React.createElement("option", { value: "plala", __source: { fileName: "", lineNumber: 94, columnNumber: 11 }, __self: this }, "plala"), /*#__PURE__*/ React.createElement("option", { value: "nifty", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, "@nifty")))); }