function MainComponent() { const [username, setUsername] = React.useState(''); const [videos, setVideos] = React.useState([]); const fetchVideos = async ()=>{ const response = await fetch(`/api/tiktok?username=${username}`); const fetchedVideos = await response.json(); setVideos(fetchedVideos); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4 font-sans", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "username", value: username, onChange: (e)=>setUsername(e.target.value), placeholder: "Enter TikTok username", className: "p-2 border border-gray-300 rounded w-full", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: fetchVideos, className: "mt-2 p-2 bg-blue-500 text-white rounded w-full", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, "Fetch Videos")), /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 29, columnNumber: 7 }, __self: this }, username, "'s TikTok Videos"), /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, videos.map((video, index)=>{ const { title, likes, comments } = video; return /*#__PURE__*/ React.createElement("li", { key: index, className: "mb-4 p-4 border-b border-gray-300", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 35, columnNumber: 15 }, __self: this }, "Title: ", title), /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }, "Likes: ", likes), /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this }, "Comments: ", comments)); }))); }