function OutlineButton({ text, onClick, bgColor = 'bg-white' }) { const textColor = bgColor === 'bg-white' ? 'text-black' : 'text-white'; return /*#__PURE__*/ React.createElement("button", { className: `px-8 py-2 rounded-full border border-current ${textColor} font-inter bg-transparent hover:bg-opacity-10 transition-colors duration-300 w-[240px] h-[60px]`, onClick: onClick, __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, text); } function OutlineButtonStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 flex flex-col space-y-4 justify-center items-center h-screen bg-gray-100", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(OutlineButton, { text: "Click me", onClick: ()=>alert('Button clicked!'), __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(OutlineButton, { text: "Dark version", onClick: ()=>alert('Dark button clicked!'), bgColor: "bg-black", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this })); } function MainComponent() { const [isRunning, setIsRunning] = useState(false); const [time, setTime] = useState(0); const [startTime, setStartTime] = useState(null); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [showResults, setShowResults] = useState(false); const [menuOpen, setMenuOpen] = useState(false); const [showHistory, setShowHistory] = useState(false); const [testHistory, setTestHistory] = useState([]); const [lastTestDate, setLastTestDate] = useState("No tests yet"); const [initials, setInitials] = useState(""); const [name, setName] = useState(""); const [storeNumber, setStoreNumber] = useState(""); const [showSettings, setShowSettings] = useState(false); const [showConfirmClear, setShowConfirmClear] = useState(false); const [showConfirmClearData, setShowConfirmClearData] = useState(false); const [showStoreNumberPrompt, setShowStoreNumberPrompt] = useState(false); const [showInitialsReminder, setShowInitialsReminder] = useState(false); const [showStoreNumberReminder, setShowStoreNumberReminder] = useState(false); const [showDispenserReminder, setShowDispenserReminder] = useState(false); const [showFuelGradeReminder, setShowFuelGradeReminder] = useState(false); const [imageUrls, setImageUrls] = useState({}); const [showThemeSelector, setShowThemeSelector] = useState(false); const [theme, setTheme] = useState("7-11"); const [showFuelSelector, setShowFuelSelector] = useState(false); const [selectedDispenser, setSelectedDispenser] = useState(""); const [selectedFuelGrade, setSelectedFuelGrade] = useState(""); const themes = { "7-11": { background: "#009F3D", text: "#FFFFFF", logo: "https://ucarecdn.com/1d30b8bc-5848-454c-a3ac-b6fb2314093e/-/format/auto/" }, Speedway: { background: "#FF0000", text: "#FFFFFF", logo: "https://ucarecdn.com/cde42b73-ee21-49ca-b52b-fee4cc172f8f/-/format/auto/" }, "Irving/Circle K": { background: "#0033A0", text: "#FFFFFF", logo: "https://ucarecdn.com/fecd928b-eac6-472a-abf0-f731a7573fdd/-/format/auto/" }, Sunoco: { background: "#FFCC00", text: "#000000", logo: "https://ucarecdn.com/d32b4848-0692-4710-974e-240dd37a1fce/-/format/auto/" }, "Stewart's Shops": { background: "#800000", text: "#FFFFFF", logo: "https://ucarecdn.com/3b0df8b6-5dfa-4cff-8c91-a9aa52e614e0/" }, "Quik Trip": { background: "#E31837", text: "#FFFFFF", logo: "https://ucarecdn.com/3bdf9293-4a5e-4d8e-83f2-b6fd068b70ad/-/format/auto/" }, "Cumberland Farms": { background: "#32CD32", text: "#FFFFFF", logo: "https://ucarecdn.com/5917aa50-f05a-44e4-ae85-e68d03292752/-/format/auto/" }, Shell: { background: "#FFD700", text: "#000000", logo: "https://ucarecdn.com/c9b261be-208c-446f-a6d6-90d11272e8e9/-/format/auto/" }, Loves: { background: "#FFCC00", text: "#000000", logo: "https://ucarecdn.com/6d01488b-b707-459e-bf97-61b07ae46ccb/-/format/auto/" }, Valero: { background: "#007A33", text: "#FFFFFF", logo: "https://ucarecdn.com/cea24b1f-9435-4f8b-8f24-f553c0c11f47/-/format/auto/" } }; const SEVEN_ELEVEN_RED = "#FF0000"; const SEVEN_ELEVEN_ORANGE = "#FF7F00"; const SEVEN_ELEVEN_GREEN = "#00FF00"; const REQUIRED_GALLONS = 4; const REQUIRED_GPM = 6; const MAX_GPM = 10; useEffect(()=>{ let interval; if (isRunning) { interval = setInterval(()=>{ setTime((prev)=>prev + 10); }, 10); } return ()=>clearInterval(interval); }, [ isRunning ]); useEffect(()=>{ fetchHistory(); const savedInitials = localStorage.getItem("initials"); const savedStoreNumber = localStorage.getItem("storeNumber"); if (savedInitials) { setInitials(savedInitials); } if (savedStoreNumber) { setStoreNumber(savedStoreNumber); } }, []); const generateImage = async (test)=>{ try { const prompt = `Flow test result: ${test.passed ? "PASS" : "FAIL"}, Flow Rate: ${test.flow_rate.toFixed(2)} GPM, Duration: ${(new Date(test.end_time) - new Date(test.start_time)) / 1000} seconds, Gallons: ${test.gallons}`; const response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(prompt)}`, { method: "GET" }); const data = await response.json(); if (data && data.data && data.data[0]) { setImageUrls((prev)=>({ ...prev, [test.id]: data.data[0] })); } } catch (err) { console.error("Failed to generate image:", err); } }; const formatTime = (milliseconds)=>{ const secs = Math.floor(milliseconds / 1000); const ms = Math.floor(milliseconds % 1000 / 10); return `${secs.toString().padStart(2, "0")}:${ms.toString().padStart(2, "0")}`; }; const calculateResults = (timeMilliseconds)=>{ const timeSeconds = timeMilliseconds / 1000; const flowRateGPM = REQUIRED_GALLONS / timeSeconds * 60; const timePerGallon = timeSeconds / REQUIRED_GALLONS; const passed = flowRateGPM >= REQUIRED_GPM && flowRateGPM <= MAX_GPM; return { flowRateGPM, timePerGallon, passed, totalTime: timeSeconds, totalGallons: REQUIRED_GALLONS }; }; const handleStart = ()=>{ if (!initials) { setShowInitialsReminder(true); return; } if (!storeNumber) { setShowStoreNumberReminder(true); return; } if (!selectedDispenser) { setShowDispenserReminder(true); return; } if (!selectedFuelGrade) { setShowFuelGradeReminder(true); return; } setIsRunning(true); setStartTime(new Date().toISOString()); setShowResults(false); }; const handleStop = async ()=>{ setIsRunning(false); const endTime = new Date().toISOString(); try { setLoading(true); const response = await fetch("/api/create-flow-test", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ gallons: REQUIRED_GALLONS, start_time: startTime, end_time: endTime, user_initials: initials, user_name: name || undefined, store_number: storeNumber, dispenser: selectedDispenser, fuel_grade: selectedFuelGrade }) }); if (!response.ok) throw new Error("Failed to save test"); await fetchHistory(); setShowResults(true); } catch (err) { setError("Failed to save test results"); console.error("Error saving test results:", err); } finally{ setLoading(false); } }; const handleStoreNumber = ()=>{ setShowStoreNumberPrompt(true); }; const handleStoreNumberSubmit = ()=>{ localStorage.setItem("storeNumber", storeNumber); setShowStoreNumberPrompt(false); }; const fetchHistory = async ()=>{ if (!initials) return; try { setLoading(true); const response = await fetch("/api/list-flow-tests2", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ context: { session: { user: { id: initials } } } }) }); if (!response.ok) throw new Error("Failed to fetch history"); const data = await response.json(); setTestHistory(data.tests || []); if (data.tests && data.tests.length > 0) { const mostRecentTest = data.tests[0]; const date = new Date(mostRecentTest.start_time); setLastTestDate(date.toLocaleDateString("en-US", { month: "2-digit", day: "2-digit", year: "numeric" })); data.tests.forEach((test)=>{ if (!imageUrls[test.id]) { generateImage(test); } }); } } catch (err) { setError("Failed to load test history"); console.error("Error fetching history:", err); } finally{ setLoading(false); } }; const handleClearHistory = async ()=>{ try { setLoading(true); const response = await fetch("/api/clear-flow-tests", { method: "POST" }); if (!response.ok) throw new Error("Failed to clear history"); setTestHistory([]); setLastTestDate("No tests yet"); setShowConfirmClear(false); } catch (err) { setError("Failed to clear test history"); console.error(err); } finally{ setLoading(false); } }; const handleClearUserData = ()=>{ setInitials(""); setName(""); setStoreNumber(""); localStorage.removeItem("initials"); localStorage.removeItem("storeNumber"); setShowConfirmClearData(false); }; const handleUpdateUser = ()=>{ if (initials) { localStorage.setItem("initials", initials); localStorage.setItem("storeNumber", storeNumber); setShowSettings(false); } }; const handleThemeChange = (selectedTheme)=>{ setTheme(selectedTheme); setShowThemeSelector(false); }; const handleFuelSelector = ()=>{ setShowFuelSelector((prev)=>!prev); }; const isPopupVisible = showSettings || showConfirmClear || showConfirmClearData || showResults || menuOpen || showHistory || showStoreNumberPrompt || showInitialsReminder || showStoreNumberReminder || showDispenserReminder || showFuelGradeReminder || showThemeSelector || showFuelSelector; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen", style: { backgroundColor: themes[theme].background }, __source: { fileName: "", lineNumber: 296, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto min-h-screen relative border-x-4 border-[#333] px-8", style: { backgroundColor: `${themes[theme].background}20` }, __source: { fileName: "", lineNumber: 300, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center py-2 space-x-4", __source: { fileName: "", lineNumber: 304, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: themes[theme].logo, alt: `${theme} logo`, className: "h-12", __source: { fileName: "", lineNumber: 305, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-white text-lg", __source: { fileName: "", lineNumber: 310, columnNumber: 11 }, __self: this }, "Store Number: ", storeNumber || "N/A")), /*#__PURE__*/ React.createElement("div", { className: "border-t-2 border-[#333] w-full", __source: { fileName: "", lineNumber: 314, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setMenuOpen((prev)=>!prev), className: "fixed top-4 left-4 text-2xl z-50", style: { color: themes[theme].text, backgroundColor: "transparent", zIndex: 60 }, __source: { fileName: "", lineNumber: 315, columnNumber: 9 }, __self: this }, "≡"), showInitialsReminder && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 328, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 329, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 330, columnNumber: 15 }, __self: this }, "Initials Required"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-center", __source: { fileName: "", lineNumber: 331, columnNumber: 15 }, __self: this }, "Please enter your initials in the settings."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowInitialsReminder(false); setShowSettings(true); }, className: "w-full mt-4 px-4 py-2 bg-white text-black", __source: { fileName: "", lineNumber: 334, columnNumber: 15 }, __self: this }, "Go to Settings"))), showStoreNumberReminder && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 348, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 349, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 350, columnNumber: 15 }, __self: this }, "Store Number Required"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-center", __source: { fileName: "", lineNumber: 353, columnNumber: 15 }, __self: this }, "Please enter a store number before starting the test."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowStoreNumberReminder(false), className: "w-full mt-4 px-4 py-2 bg-white text-black", __source: { fileName: "", lineNumber: 356, columnNumber: 15 }, __self: this }, "Close"))), showDispenserReminder && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 367, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 368, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 369, columnNumber: 15 }, __self: this }, "Dispenser Required"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-center", __source: { fileName: "", lineNumber: 372, columnNumber: 15 }, __self: this }, "Please select a dispenser before starting the test."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowDispenserReminder(false), className: "w-full mt-4 px-4 py-2 bg-white text-black", __source: { fileName: "", lineNumber: 375, columnNumber: 15 }, __self: this }, "Close"))), showFuelGradeReminder && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 386, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 387, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 388, columnNumber: 15 }, __self: this }, "Fuel Grade Required"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-center", __source: { fileName: "", lineNumber: 391, columnNumber: 15 }, __self: this }, "Please select a fuel grade before starting the test."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowFuelGradeReminder(false), className: "w-full mt-4 px-4 py-2 bg-white text-black", __source: { fileName: "", lineNumber: 394, columnNumber: 15 }, __self: this }, "Close"))), showStoreNumberPrompt && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 405, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 406, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 407, columnNumber: 15 }, __self: this }, "Enter Store Number"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 408, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: storeNumber, onChange: (e)=>setStoreNumber(e.target.value), className: "w-full px-4 py-2 bg-transparent border border-gray-700 text-white", placeholder: "Enter store number", __source: { fileName: "", lineNumber: 409, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleStoreNumberSubmit, className: "w-full mt-4 px-4 py-2 bg-white text-black", __source: { fileName: "", lineNumber: 416, columnNumber: 17 }, __self: this }, "Save")))), menuOpen && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 z-40", onClick: ()=>setMenuOpen(false), __source: { fileName: "", lineNumber: 429, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "fixed left-0 top-0 h-full w-[250px] bg-white bg-opacity-80 z-50 transform transition-transform duration-300 ease-in-out", __source: { fileName: "", lineNumber: 433, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 space-y-2 pt-16", __source: { fileName: "", lineNumber: 434, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "block py-2 px-4", style: { color: themes[theme].text, backgroundColor: themes[theme].background }, onClick: ()=>setMenuOpen(false), __source: { fileName: "", lineNumber: 435, columnNumber: 17 }, __self: this }, "Flow Rate Timer"), /*#__PURE__*/ React.createElement("button", { className: "block w-full text-left py-2 px-4", style: { color: themes[theme].text, backgroundColor: SEVEN_ELEVEN_RED }, onClick: ()=>{ if (!initials) { setShowInitialsReminder(true); return; } setMenuOpen(false); fetchHistory(); setShowHistory(true); }, __source: { fileName: "", lineNumber: 446, columnNumber: 17 }, __self: this }, "View Test History"), /*#__PURE__*/ React.createElement("a", { href: "/contact", className: "block py-2 px-4", style: { color: themes[theme].text, backgroundColor: SEVEN_ELEVEN_RED }, onClick: ()=>setMenuOpen(false), __source: { fileName: "", lineNumber: 464, columnNumber: 17 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("button", { className: "block w-full text-left py-2 px-4", style: { color: themes[theme].text, backgroundColor: SEVEN_ELEVEN_ORANGE }, onClick: ()=>{ setMenuOpen(false); setShowThemeSelector(true); }, __source: { fileName: "", lineNumber: 475, columnNumber: 17 }, __self: this }, "Select Theme"), /*#__PURE__*/ React.createElement("button", { className: "block w-full text-left py-2 px-4", style: { color: themes[theme].text, backgroundColor: SEVEN_ELEVEN_ORANGE }, onClick: ()=>{ setMenuOpen(false); setShowSettings(true); }, __source: { fileName: "", lineNumber: 488, columnNumber: 17 }, __self: this }, "Settings")))), showThemeSelector && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 507, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 508, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 509, columnNumber: 15 }, __self: this }, "Select Theme"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 510, columnNumber: 15 }, __self: this }, Object.keys(themes).map((themeName)=>/*#__PURE__*/ React.createElement("button", { key: themeName, onClick: ()=>handleThemeChange(themeName), className: "w-full px-4 py-2", style: { backgroundColor: themes[themeName].background, color: themes[themeName].text }, __source: { fileName: "", lineNumber: 512, columnNumber: 19 }, __self: this }, themeName)), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowThemeSelector(false), className: "w-full mt-4 px-4 py-2 bg-gray-800 text-white", __source: { fileName: "", lineNumber: 524, columnNumber: 17 }, __self: this }, "Close")))), showSettings && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 536, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 537, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 538, columnNumber: 15 }, __self: this }, "Settings"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 539, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 540, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 541, columnNumber: 19 }, __self: this }, "Name (optional)"), /*#__PURE__*/ React.createElement("input", { type: "text", value: name, onChange: (e)=>setName(e.target.value), className: "w-full px-4 py-2 bg-transparent border border-gray-700 text-white", placeholder: "Enter your name", __source: { fileName: "", lineNumber: 542, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 550, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 551, columnNumber: 19 }, __self: this }, "Initials (required)"), /*#__PURE__*/ React.createElement("input", { type: "text", value: initials, onChange: (e)=>setInitials(e.target.value.toUpperCase()), className: "w-full px-4 py-2 bg-transparent border border-gray-700 text-white", maxLength: 3, placeholder: "Enter your initials", required: true, __source: { fileName: "", lineNumber: 552, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: handleUpdateUser, disabled: !initials, className: "w-full mt-4 px-4 py-2 bg-white text-black disabled:opacity-50", __source: { fileName: "", lineNumber: 562, columnNumber: 17 }, __self: this }, "Update"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowConfirmClear(true), className: "w-full mt-4 px-4 py-2 bg-transparent border border-white text-white", __source: { fileName: "", lineNumber: 569, columnNumber: 17 }, __self: this }, "Clear History"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowConfirmClearData(true), className: "w-full mt-4 px-4 py-2 bg-transparent border border-white text-white", __source: { fileName: "", lineNumber: 575, columnNumber: 17 }, __self: this }, "Clear User Data"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSettings(false), className: "w-full mt-4 px-4 py-2 bg-gray-800 text-white", __source: { fileName: "", lineNumber: 581, columnNumber: 17 }, __self: this }, "Close")))), showConfirmClear && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 593, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 594, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4 text-center", __source: { fileName: "", lineNumber: 595, columnNumber: 15 }, __self: this }, "Clear History?"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-center", __source: { fileName: "", lineNumber: 596, columnNumber: 15 }, __self: this }, "This action cannot be undone."), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 597, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleClearHistory, className: "flex-1 px-4 py-2 bg-red-600 text-white", __source: { fileName: "", lineNumber: 598, columnNumber: 17 }, __self: this }, "Clear"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowConfirmClear(false), className: "flex-1 px-4 py-2 bg-gray-800 text-white", __source: { fileName: "", lineNumber: 604, columnNumber: 17 }, __self: this }, "Cancel")))), showConfirmClearData && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 616, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 617, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4 text-center", __source: { fileName: "", lineNumber: 618, columnNumber: 15 }, __self: this }, "Clear User Data?"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-center", __source: { fileName: "", lineNumber: 619, columnNumber: 15 }, __self: this }, "This will clear your name and initials."), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 622, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleClearUserData, className: "flex-1 px-4 py-2 bg-red-600 text-white", __source: { fileName: "", lineNumber: 623, columnNumber: 17 }, __self: this }, "Clear"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowConfirmClearData(false), className: "flex-1 px-4 py-2 bg-gray-800 text-white", __source: { fileName: "", lineNumber: 629, columnNumber: 17 }, __self: this }, "Cancel")))), /*#__PURE__*/ React.createElement("div", { className: "pt-4 pb-6 border-b-4 border-[#333]", __source: { fileName: "", lineNumber: 640, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center space-x-1 border border-black p-2", __source: { fileName: "", lineNumber: 641, columnNumber: 11 }, __self: this }, formatTime(time).split("").map((digit, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white border border-gray-300 w-14 h-20 flex items-center justify-center relative overflow-hidden", style: { boxShadow: "inset 0 0 10px rgba(0, 0, 0, 0.1)" }, __source: { fileName: "", lineNumber: 645, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-b from-transparent via-gray-100 to-transparent pointer-events-none", style: { mixBlendMode: "overlay" }, __source: { fileName: "", lineNumber: 652, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-black text-5xl font-mono", style: { fontFamily: "Digital-7, monaco, monospace" }, __source: { fileName: "", lineNumber: 656, columnNumber: 19 }, __self: this }, digit)))), /*#__PURE__*/ React.createElement("div", { className: "text-white text-center text-sm mt-4 border-b border-white pb-2", __source: { fileName: "", lineNumber: 667, columnNumber: 11 }, __self: this }, "Testing: 4 GAL • Target: 6-10 GPM"), /*#__PURE__*/ React.createElement("div", { className: "py-12 grid grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 670, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: isRunning ? handleStop : handleStart, className: `h-32 rounded-md text-xl font-bold transition-all transform hover:scale-95 active:scale-90 ${isRunning ? "text-white" : "text-black"}`, style: { backgroundColor: isRunning ? SEVEN_ELEVEN_RED : "#FFEB00", boxShadow: `0 4px 6px rgba(0, 0, 0, 0.1), inset 0 2px 4px rgba(255, 255, 255, 0.1), 0 0 15px ${isRunning ? SEVEN_ELEVEN_RED : "#FFEB00"}` }, __source: { fileName: "", lineNumber: 671, columnNumber: 13 }, __self: this }, isRunning ? "STOP\nTEST" : "START\nTEST"), /*#__PURE__*/ React.createElement("button", { onClick: handleStoreNumber, disabled: isRunning, className: "h-32 rounded-md text-black text-2xl font-bold transition-all transform hover:scale-95 active:scale-90 disabled:opacity-50 disabled:hover:scale-100", style: { backgroundColor: storeNumber ? SEVEN_ELEVEN_ORANGE : "#FFEB00", boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1), inset 0 2px 4px rgba(255, 255, 255, 0.1)" }, __source: { fileName: "", lineNumber: 681, columnNumber: 13 }, __self: this }, "Store #"), /*#__PURE__*/ React.createElement("button", { onClick: handleFuelSelector, disabled: isRunning, className: "h-32 rounded-md text-black text-2xl font-bold transition-all transform hover:scale-95 active:scale-90 disabled:opacity-50 disabled:hover:scale-100", style: { backgroundColor: selectedDispenser && selectedFuelGrade ? SEVEN_ELEVEN_ORANGE : "#FFEB00", boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1), inset 0 2px 4px rgba(255, 255, 255, 0.1)" }, __source: { fileName: "", lineNumber: 693, columnNumber: 13 }, __self: this }, "Fuel")), showFuelSelector && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 708, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 709, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 text-center", __source: { fileName: "", lineNumber: 710, columnNumber: 17 }, __self: this }, "Select Fuel Options"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 711, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 712, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 713, columnNumber: 21 }, __self: this }, "Dispenser"), /*#__PURE__*/ React.createElement("select", { value: selectedDispenser, onChange: (e)=>setSelectedDispenser(e.target.value), className: "w-full px-4 py-2 bg-transparent border border-gray-700 text-white", __source: { fileName: "", lineNumber: 714, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 719, columnNumber: 23 }, __self: this }, "Select Dispenser"), Array.from({ length: 30 }, (_, i)=>i + 1).map((num)=>/*#__PURE__*/ React.createElement("option", { key: num, value: num, __source: { fileName: "", lineNumber: 721, columnNumber: 25 }, __self: this }, num)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 727, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 728, columnNumber: 21 }, __self: this }, "Fuel Grade"), /*#__PURE__*/ React.createElement("select", { value: selectedFuelGrade, onChange: (e)=>setSelectedFuelGrade(e.target.value), className: "w-full px-4 py-2 bg-transparent border border-gray-700 text-white", __source: { fileName: "", lineNumber: 729, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 734, columnNumber: 23 }, __self: this }, "Select Fuel Grade"), /*#__PURE__*/ React.createElement("option", { value: "Regular (87 Octane)", __source: { fileName: "", lineNumber: 735, columnNumber: 23 }, __self: this }, "Regular (87 Octane)"), /*#__PURE__*/ React.createElement("option", { value: "Mid-Grade (89-90 Octane)", __source: { fileName: "", lineNumber: 736, columnNumber: 23 }, __self: this }, "Mid-Grade (89-90 Octane)"), /*#__PURE__*/ React.createElement("option", { value: "Premium (91-94 Octane)", __source: { fileName: "", lineNumber: 737, columnNumber: 23 }, __self: this }, "Premium (91-94 Octane)"), /*#__PURE__*/ React.createElement("option", { value: "Kerosene", __source: { fileName: "", lineNumber: 738, columnNumber: 23 }, __self: this }, "Kerosene"), /*#__PURE__*/ React.createElement("option", { value: "Diesel", __source: { fileName: "", lineNumber: 739, columnNumber: 23 }, __self: this }, "Diesel"))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowFuelSelector(false), className: "w-full mt-4 px-4 py-2 bg-white text-black", __source: { fileName: "", lineNumber: 742, columnNumber: 19 }, __self: this }, "Close")))), showResults && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center", __source: { fileName: "", lineNumber: 754, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-6 border border-gray-700 w-full max-w-md mx-4", __source: { fileName: "", lineNumber: 755, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4 text-center", __source: { fileName: "", lineNumber: 756, columnNumber: 17 }, __self: this }, "Test Results"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 758, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center text-xl", __source: { fileName: "", lineNumber: 759, columnNumber: 19 }, __self: this }, calculateResults(time).passed ? /*#__PURE__*/ React.createElement("div", { className: "px-4 py-2", style: { backgroundColor: SEVEN_ELEVEN_GREEN }, __source: { fileName: "", lineNumber: 761, columnNumber: 23 }, __self: this }, "PASS") : /*#__PURE__*/ React.createElement("div", { className: "px-4 py-2", style: { backgroundColor: SEVEN_ELEVEN_RED }, __source: { fileName: "", lineNumber: 768, columnNumber: 23 }, __self: this }, "FAIL")), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 777, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl", __source: { fileName: "", lineNumber: 778, columnNumber: 21 }, __self: this }, "Flow Rate: ", calculateResults(time).flowRateGPM.toFixed(2), " ", "GPM"), calculateResults(time).flowRateGPM > MAX_GPM && /*#__PURE__*/ React.createElement("div", { className: "text-red-500 text-center", __source: { fileName: "", lineNumber: 783, columnNumber: 23 }, __self: this }, "Warning: Flow rate exceeds 10 GPM!", /*#__PURE__*/ React.createElement("p", { className: "text-white mt-2", __source: { fileName: "", lineNumber: 785, columnNumber: 25 }, __self: this }, "Federal Air Regulations limit the flow rate of gas pumps. Higher flow rates could increase the risk of accidents and spills.")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 792, columnNumber: 21 }, __self: this }, "Required: ", REQUIRED_GPM, " GPM minimum"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 793, columnNumber: 21 }, __self: this }, "Maximum: ", MAX_GPM, " GPM"), /*#__PURE__*/ React.createElement("div", { className: "mt-4 pt-4 border-t border-gray-700", __source: { fileName: "", lineNumber: 794, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 795, columnNumber: 23 }, __self: this }, "Total Time: ", formatTime(time)), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 796, columnNumber: 23 }, __self: this }, "Total Gallons: ", REQUIRED_GALLONS), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 797, columnNumber: 23 }, __self: this }, "Time per Gallon:", " ", calculateResults(time).timePerGallon.toFixed(1), " ", "seconds"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 802, columnNumber: 23 }, __self: this }, "Store Number: ", storeNumber || "N/A"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 803, columnNumber: 23 }, __self: this }, "Dispenser: ", selectedDispenser || "N/A"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 804, columnNumber: 23 }, __self: this }, "Fuel Grade: ", selectedFuelGrade || "N/A"))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setTime(0); setStartTime(null); setShowResults(false); setStoreNumber(""); setSelectedDispenser(""); setSelectedFuelGrade(""); localStorage.removeItem("storeNumber"); }, className: "w-full mt-4 px-4 py-2 bg-gray-800 text-white hover:bg-gray-700 transition-colors", __source: { fileName: "", lineNumber: 808, columnNumber: 19 }, __self: this }, "Close")))), showHistory && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 828, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 max-w-3xl w-full mx-4 max-h-[80vh] flex flex-col overflow-auto", __source: { fileName: "", lineNumber: 829, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6 sticky top-0 bg-white", __source: { fileName: "", lineNumber: 830, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl", __source: { fileName: "", lineNumber: 831, columnNumber: 19 }, __self: this }, "Test History"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowHistory(false), className: "text-2xl", __source: { fileName: "", lineNumber: 832, columnNumber: 19 }, __self: this }, "×")), /*#__PURE__*/ React.createElement("div", { className: "overflow-y-auto flex-1", __source: { fileName: "", lineNumber: 840, columnNumber: 17 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "text-center py-4", __source: { fileName: "", lineNumber: 842, columnNumber: 21 }, __self: this }, "Loading...") : error ? /*#__PURE__*/ React.createElement("div", { className: "text-red-500 text-center py-4", __source: { fileName: "", lineNumber: 844, columnNumber: 21 }, __self: this }, error) : /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 846, columnNumber: 21 }, __self: this }, testHistory.map((test)=>{ const startTime = new Date(test.start_time); const endTime = new Date(test.end_time); const duration = (endTime - startTime) / 1000; const flowRate = Number(test.flow_rate); const passed = flowRate <= MAX_GPM && test.passed; const elementId = `test-card-${test.id}`; return /*#__PURE__*/ React.createElement("div", { id: elementId, key: test.id, className: "p-4 border space-y-2", style: { borderColor: passed ? SEVEN_ELEVEN_GREEN : SEVEN_ELEVEN_RED }, __source: { fileName: "", lineNumber: 856, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 866, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 867, columnNumber: 31 }, __self: this }, "Date: ", startTime.toLocaleDateString()), /*#__PURE__*/ React.createElement("span", { className: "px-3 py-1 text-white", style: { backgroundColor: passed ? SEVEN_ELEVEN_GREEN : SEVEN_ELEVEN_RED }, __source: { fileName: "", lineNumber: 870, columnNumber: 31 }, __self: this }, passed ? "PASS" : "FAIL")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 881, columnNumber: 29 }, __self: this }, "Time: ", startTime.toLocaleTimeString()), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 882, columnNumber: 29 }, __self: this }, "Duration: ", duration.toFixed(1), " seconds"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 883, columnNumber: 29 }, __self: this }, "Gallons: ", test.gallons), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 884, columnNumber: 29 }, __self: this }, "Flow Rate: ", flowRate.toFixed(2), " GPM"), flowRate > MAX_GPM && /*#__PURE__*/ React.createElement("div", { className: "text-red-500", __source: { fileName: "", lineNumber: 886, columnNumber: 31 }, __self: this }, "Warning: Flow rate exceeds 10 GPM!"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 890, columnNumber: 29 }, __self: this }, "Store Number: ", test.store_number || "N/A"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 893, columnNumber: 29 }, __self: this }, "Dispenser: ", test.dispenser || "N/A"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 894, columnNumber: 29 }, __self: this }, "Fuel Grade: ", test.fuel_grade || "N/A"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 895, columnNumber: 29 }, __self: this }, "Tested by:", " ", test.user_initials ? test.user_name ? `${test.user_initials} - ${test.user_name}` : test.user_initials : "Unknown"), imageUrls[test.id] && /*#__PURE__*/ React.createElement("img", { src: imageUrls[test.id], alt: `Test result for ${test.id}`, className: "w-full", __source: { fileName: "", lineNumber: 904, columnNumber: 31 }, __self: this })); })))))), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center space-x-4 mt-4", __source: { fileName: "", lineNumber: 920, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 w-28 text-center border-4 border-black shadow-md", __source: { fileName: "", lineNumber: 921, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-black font-crimson-text text-sm", __source: { fileName: "", lineNumber: 922, columnNumber: 13 }, __self: this }, "Certified By: ", initials || "N/A"), /*#__PURE__*/ React.createElement("div", { className: "text-black font-crimson-text text-sm", __source: { fileName: "", lineNumber: 925, columnNumber: 13 }, __self: this }, "Last Test: ", lastTestDate)), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 w-28 text-center border-4 border-black shadow-md", __source: { fileName: "", lineNumber: 929, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-black font-crimson-text text-sm", __source: { fileName: "", lineNumber: 930, columnNumber: 13 }, __self: this }, "Instructions:"), /*#__PURE__*/ React.createElement("ol", { className: "text-black font-crimson-text list-decimal list-inside text-xs", __source: { fileName: "", lineNumber: 933, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 934, columnNumber: 15 }, __self: this }, "Enter initials"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 935, columnNumber: 15 }, __self: this }, "Start test"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 936, columnNumber: 15 }, __self: this }, "Stop test")))), /*#__PURE__*/ React.createElement("div", { className: "border-t-4 border-[#333] mt-4 w-full", __source: { fileName: "", lineNumber: 940, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 942, columnNumber: 7 }, __self: this }, ` /* Add any global styles or animations here */ `), /*#__PURE__*/ React.createElement("script", { __source: { fileName: "", lineNumber: 945, columnNumber: 7 }, __self: this }, ` // Add any scripts you want to include in the head section here `)); }