\n \n \n

\n );\n}\n\nfunction App({ initialTime }: { initialTime: string }) {\n const [currentTime, setCurrentTime] = useState(DateTime.now());\n const [userTimezone, setUserTimezone] = useState(\"\");\n const [customTimezones, setCustomTimezones] = useState(() => {\n // Load custom timezones from localStorage on initial render\n if (typeof localStorage !== 'undefined') {\n const saved = localStorage.getItem('customTimezones');\n return saved ? JSON.parse(saved) : [];\n }\n return [];\n });\n\n useEffect(() => {\n const timer = setInterval(() => {\n setCurrentTime(DateTime.now());\n }, 1000);\n setUserTimezone(DateTime.local().zoneName);\n return () => clearInterval(timer);\n }, []);\n\n useEffect(() => {\n // Save custom timezones to localStorage whenever they change\n if (typeof localStorage !== 'undefined') {\n localStorage.setItem('customTimezones', JSON.stringify(customTimezones));\n }\n }, [customTimezones]);\n\n const addCustomTimezone = useCallback((newZone: string) => {\n if (newZone && !customTimezones.includes(newZone)) {\n setCustomTimezones([...customTimezones, newZone]);\n }\n }, [customTimezones]);\n\n return (\n

Timezone Comparison Tool

\n Your timezone: {userTimezone}\n

\n Current time: {currentTime.setZone(userTimezone).toFormat(\"HH:mm:ss\")}\n

\n {timezones.map((zone) => (\n \n ))}\n {customTimezones.map((zone) => (\n \n ))}\n

\n \n

\n );\n}\n\nfunction TimezoneRow({ zone, currentTime }: { zone: string; currentTime: DateTime }) {\n const localTime = currentTime.setZone(zone || 'UTC');\n const offset = localTime.offset / 60;\n const offsetString = offset >= 0 ? `+${offset}` : `${offset}`;\n\n return (\n

\n {zone.replace(\"_\", \" \")}\n GMT{offsetString}\n

\n {localTime.toFormat(\"HH:mm:ss\")}\n

\n );\n}\n\n// client-side only code\nif (typeof window !== \"undefined\") {\n const client = () => {\n const root = document.getElementById(\"root\");\n if (root) createRoot(root).render();\n };\n \n // Execute client-side code after the script has loaded\n window.addEventListener('load', client);\n}\n\nasync function server(request: Request): Promise {\n try {\n // Set CORS headers\n const headers = new Headers({\n \"Access-Control-Allow-Origin\": \"*\",\n \"Content-Type\": \"text/html\",\n });\n\n return new Response(`\n \n \n Timezone Comparison Tool\n \n \n \n \n

\n \n \n \n `,\n { headers }\n );\n } catch (error) {\n console.error(\"Server error:\", error);\n return new Response(`Server Error: ${error.message}`, {\n status: 500,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n }\n}\n\nconst css = `\nbody {\n font-family: Arial, sans-serif;\n margin: 0;\n padding: 0;\n background-color: #f0f0f0;\n}\n.container {\n max-width: 800px;\n margin: 0 auto;\n padding: 20px;\n}\nh1 {\n text-align: center;\n color: #333;\n}\n.user-timezone-box {\n background-color: #e6f3ff;\n border-radius: 8px;\n padding: 15px;\n margin-bottom: 20px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n}\n.user-timezone-box .user-timezone {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.user-timezone-box .user-timezone strong {\n font-size: 1.2em;\n color: #0056b3;\n}\n.user-timezone-box .user-time {\n font-size: 1.5em;\n font-weight: bold;\n color: #007bff;\n margin-top: 10px;\n}\n.timezone-list {\n background-color: white;\n border-radius: 8px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n overflow: hidden;\n}\n.timezone-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 15px 20px;\n border-bottom: 1px solid #eee;\n}\n.timezone-row:last-child {\n border-bottom: none;\n}\n.timezone-info {\n display: flex;\n flex-direction: column;\n}\n.timezone-name {\n font-weight: bold;\n color: #333;\n}\n.timezone-offset {\n font-size: 0.8em;\n color: #666;\n}\n.timezone-time {\n font-size: 1.2em;\n font-weight: bold;\n color: #007bff;\n}\nfooter {\n text-align: center;\n margin-top: 20px;\n font-size: 0.8em;\n color: #666;\n}\nfooter a {\n color: #007bff;\n text-decoration: none;\n}\nfooter a:hover {\n text-decoration: underline;\n}\n.add-timezone {\n padding: 15px 20px;\n border-top: 1px solid #eee;\n}\n.timezone-select {\n display: flex;\n gap: 10px;\n}\n.timezone-select select {\n flex-grow: 1;\n padding: 10px;\n font-size: 1em;\n border: 1px solid #ccc;\n border-radius: 4px;\n background-color: #f8f8f8;\n}\n.timezone-select button {\n padding: 10px 20px;\n font-size: 1em;\n color: white;\n background-color: #007bff;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n}\n.timezone-select button:disabled {\n background-color: #cccccc;\n cursor: not-allowed;\n}\n.timezone-select button:hover:not(:disabled) {\n background-color: #0056b3;\n}\n.timezone-select select optgroup {\n font-weight: bold;\n}\n.timezone-select select option {\n font-weight: normal;\n}\n`;\n\nexport default server;","deleted","label","children",[],[152],"files",[150],"counts",{"_173":31,"_174":175,"_176":31,"_177":31},"pulls","branches",1,"forks","envVars","contents",[180],{"_107":151,"_100":152,"_153":120,"_154":-5,"_155":140,"_156":139,"_157":113,"_109":181,"_104":159,"_160":161,"_162":163,"_164":27,"_165":-5,"_103":182},["D",1725615033076],[152],"file","upstreamProject","upstreamBranch","emptyEnvVars","isNew","routes/_app.x.$handle.$name._index",{"_98":99,"_100":101,"_102":-7,"_104":-7,"_105":190,"_178":194,"_197":-7,"_198":-5,"_199":-5,"_169":200,"_204":205},{"_107":108,"_100":101,"_109":191,"_111":-5,"_112":113,"_114":115,"_116":-5,"_117":-5,"_12":118,"_119":120,"_121":113,"_122":-5,"_123":31,"_124":125,"_126":125,"_127":128,"_129":128,"_130":128,"_131":125,"_132":125,"_133":27,"_21":192,"_137":193},["D",1746134635406],{"_98":99,"_135":136},{"_104":139,"_100":42,"_107":140,"_141":108,"_142":-5,"_143":-5,"_144":-5,"_145":-5,"_146":101,"_147":99},[195],{"_107":151,"_100":152,"_153":120,"_154":-5,"_155":140,"_156":139,"_157":113,"_109":181,"_104":159,"_160":161,"_162":163,"_164":27,"_165":-5,"_103":196},[152],"readme","upstream","pull",[201],{"_107":151,"_100":152,"_153":120,"_154":-5,"_155":140,"_156":139,"_157":113,"_109":158,"_104":159,"_160":161,"_162":163,"_164":27,"_165":-5,"_166":202,"_103":203},[],[152],"previews",[201],"routes/_app","actionData","errors"]