function MainComponent() { const [loading, setLoading] = React.useState(false); const [productData, setProductData] = React.useState({ productName: '', amount: '', price: '' }); const [resultUrl, setResultUrl] = React.useState(''); const handleChange = (e)=>{ const { name, value } = e.target; setProductData({ ...productData, [name]: value }); }; const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: "user", content: JSON.stringify(productData) } ], system_prompt: 'Generate a quote form URL' }) }); const responseData = await response.json(); setResultUrl(responseData.choices[0].message.content); } catch (error) { console.error('Error:', error); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100", __source: { fileName: "", lineNumber: 45, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-blue-600 text-white p-4", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-xl", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, "見積もりフォーム共有アプリ")), /*#__PURE__*/ React.createElement("main", { className: "p-4", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-lg shadow-lg bg-white p-4", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("fieldset", { __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("legend", { className: "font-roboto text-lg text-gray-700 mb-4", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, "見積もりフォーム"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "productName", className: "block font-roboto text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, "商品名"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "productName", id: "productName", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm", value: productData.productName, onChange: handleChange, __source: { fileName: "", lineNumber: 58, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "amount", className: "block font-roboto text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "数量"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "amount", id: "amount", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm", value: productData.amount, onChange: handleChange, __source: { fileName: "", lineNumber: 63, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "price", className: "block font-roboto text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 67, columnNumber: 17 }, __self: this }, "価格 (円)"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "price", id: "price", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm", value: productData.price, onChange: handleChange, __source: { fileName: "", lineNumber: 68, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 71, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", disabled: loading, __source: { fileName: "", lineNumber: 72, columnNumber: 17 }, __self: this }, loading ? '生成中...' : '見積もりを作成'), resultUrl && /*#__PURE__*/ React.createElement("a", { href: resultUrl, target: "_blank", rel: "noopener noreferrer", className: "text-blue-600 hover:text-blue-800 visited:text-purple-600", __source: { fileName: "", lineNumber: 75, columnNumber: 31 }, __self: this }, "共有URL: ", resultUrl))))))); }