function MainComponent() { const [movieTitle, setMovieTitle] = useState(""); const [loading, setLoading] = useState(false); const [recommendations, setRecommendations] = useState([]); const fetchRottenTomatoesScores = async (movieTitle, year)=>{ try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: `What is the critic score for ${movieTitle} (${year}) on Rotten Tomatoes? Only return the percentage number, nothing else.` } ] }) }); const data = await response.json(); const criticScore = data.choices[0].message.content.replace(/[^0-9]/g, ""); return criticScore ? `${criticScore}%` : "N/A"; } catch (error) { return "N/A"; } }; const fetchAudienceScore = async (movieTitle, year)=>{ try { const response = await fetch("/integrations/web-scraping/post", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ url: `https://www.rottentomatoes.com/m/${movieTitle.toLowerCase().replace(/[^a-z0-9]/g, "_")}_${year}`, getText: true }) }); const text = await response.text(); const scoreMatch = text.match(/Audience Score:\s*(\d+)%/); return scoreMatch ? scoreMatch[1] + "%" : "N/A"; } catch (error) { return "N/A"; } }; const handleSubmit = async ()=>{ setLoading(true); try { const response = await fetch("/integrations/anthropic-claude-sonnet-3-5/", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "system", content: "You are a movie recommendation expert. Return only JSON data matching the schema, with no additional text." }, { role: "user", content: `Provide 10 similar movies to "${movieTitle}". Include the year and a brief explanation of why it's similar.` } ], json_schema: { name: "movie_recommendations", schema: { type: "object", properties: { recommendations: { type: "array", items: { type: "object", properties: { title: { type: "string" }, year: { type: "string" }, explanation: { type: "string" } }, required: [ "title", "year", "explanation" ], additionalProperties: false } } }, required: [ "recommendations" ], additionalProperties: false } }, stream: true }) }); const data = await response.json(); const content = data.choices[0].message.content; const parsedContent = JSON.parse(content); setRecommendations(parsedContent.recommendations); const updatedRecommendations = await Promise.all(recommendations.map(async (movie)=>{ const [audienceScore, criticScore] = await Promise.all([ fetchAudienceScore(movie.title, movie.year), fetchRottenTomatoesScores(movie.title, movie.year) ]); return { ...movie, audienceScore, criticScore }; })); setRecommendations(updatedRecommendations); } catch (error) { console.error(error); setRecommendations([]); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 py-12 px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 118, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto", __source: { fileName: "", lineNumber: 119, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-12", __source: { fileName: "", lineNumber: 120, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-gray-900 mb-4", __source: { fileName: "", lineNumber: 121, columnNumber: 11 }, __self: this }, "Movie Recommendations"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4 justify-center", __source: { fileName: "", lineNumber: 124, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: movieTitle, onChange: (e)=>setMovieTitle(e.target.value), placeholder: "Enter a movie title...", className: "w-64 px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 125, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSubmit, disabled: loading || !movieTitle, className: "bg-blue-500 text-white px-6 py-2 rounded-lg hover:bg-blue-600 disabled:opacity-50", __source: { fileName: "", lineNumber: 132, columnNumber: 13 }, __self: this }, loading ? "Finding movies..." : "Get Recommendations"))), recommendations && recommendations.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 143, columnNumber: 11 }, __self: this }, recommendations.map((movie, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white p-6 rounded-lg shadow-md", __source: { fileName: "", lineNumber: 145, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-gray-900 mb-2", __source: { fileName: "", lineNumber: 146, columnNumber: 17 }, __self: this }, movie.title), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 149, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 150, columnNumber: 19 }, __self: this }, movie.year), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 151, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-green-600", __source: { fileName: "", lineNumber: 152, columnNumber: 21 }, __self: this }, movie.audienceScore && `Audience: ${movie.audienceScore}`), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-red-600", __source: { fileName: "", lineNumber: 156, columnNumber: 21 }, __self: this }, movie.criticScore && `Critics: ${movie.criticScore}`))), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 161, columnNumber: 17 }, __self: this }, movie.explanation)))))); }