Photo Analysis

Reference Image

Image Of The Day

Details

${details}

Tips for better match

${tips}

`; const pdfResponse = await fetch('/integrations/pdf-generation/pdf', { method: 'POST', body: JSON.stringify({ source: { "html": htmlContent } }) }); const pdfBlob = await pdfResponse.blob(); const downloadUrl = URL.createObjectURL(pdfBlob); const link = document.createElement('a'); link.href = downloadUrl; link.download = "analysis-report.pdf"; document.body.appendChild(link); link.click(); document.body.removeChild(link); setLoading(false); setProgress(100); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f2f5]", __source: { fileName: "", lineNumber: 106, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-roboto text-[#333] mb-6", __source: { fileName: "", lineNumber: 107, columnNumber: 7 }, __self: this }, "Find Differences Between Two Photos"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-row justify-between gap-10 mb-4", __source: { fileName: "", lineNumber: 108, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 109, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", name: "imageReference", accept: "image/*", onChange: handleImageChange, className: "mb-2", __source: { fileName: "", lineNumber: 110, columnNumber: 11 }, __self: this }), imageReference && /*#__PURE__*/ React.createElement("img", { src: imageReference, alt: "Reference photo uploaded", className: "w-[300px] h-[300px] object-cover", __source: { fileName: "", lineNumber: 111, columnNumber: 30 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 113, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", name: "imageOfTheDay", accept: "image/*", onChange: handleImageChange, className: "mb-2", __source: { fileName: "", lineNumber: 114, columnNumber: 11 }, __self: this }), imageOfTheDay && /*#__PURE__*/ React.createElement("img", { src: imageOfTheDay, alt: "Daily photo uploaded", className: "w-[300px] h-[300px] object-cover", __source: { fileName: "", lineNumber: 115, columnNumber: 29 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { onClick: analyzeImages, disabled: loading || !imageReference || !imageOfTheDay, className: "px-4 py-2 bg-[#007bff] text-white font-roboto rounded disabled:opacity-50 mb-4", __source: { fileName: "", lineNumber: 118, columnNumber: 7 }, __self: this }, "Start Analysis"), loading && /*#__PURE__*/ React.createElement("div", { className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700", __source: { fileName: "", lineNumber: 119, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-blue-600 h-2.5 rounded-full", style: { width: `${progress}%` }, __source: { fileName: "", lineNumber: 120, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: handleDetailsClick, disabled: loading, className: "px-4 py-2 bg-[#28a745] text-white font-roboto rounded mb-4", __source: { fileName: "", lineNumber: 122, columnNumber: 7 }, __self: this }, "More Details"), /*#__PURE__*/ React.createElement("button", { onClick: handleTipsClick, disabled: loading, className: "px-4 py-2 bg-[#ffc107] text-white font-roboto rounded", __source: { fileName: "", lineNumber: 123, columnNumber: 7 }, __self: this }, "Tips"), details && /*#__PURE__*/ React.createElement("p", { className: "text-base text-[#555] font-roboto", __source: { fileName: "", lineNumber: 124, columnNumber: 19 }, __self: this }, details), tips && /*#__PURE__*/ React.createElement("p", { className: "text-base text-[#555] font-roboto", __source: { fileName: "", lineNumber: 125, columnNumber: 16 }, __self: this }, tips)); }