React Hono Val Town Starter

\n );\n};\n\n// User list component\nconst UserList = ({ users }: { users: User[] }) => {\n return (\n

Online Users

\n {users.map((user) => (\n

{user.username}

\n ))}\n

\n );\n};\n\n// Message component\nconst MessageItem = ({ message, currentUserId }: { message: Message, currentUserId: number }) => {\n const isMyMessage = message.userId === currentUserId;\n const messageClass = isMyMessage ? \"my-message\" : \"other-message\";\n \n const formatTime = (timestamp: string) => {\n const date = new Date(timestamp);\n return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\n };\n \n const renderContent = () => {\n switch (message.type) {\n case MessageType.TEXT:\n return

{message.content}

;\n \n case MessageType.IMAGE:\n return (\n $\"Shared$ window.open(`/api/blob/${message.content}`, '_blank')}\n />\n );\n \n case MessageType.VOICE:\n return (\n

\n );\n \n default:\n return

{message.content}

;\n }\n };\n \n return (\n

\n {!isMyMessage &&

{message.username}

}\n {renderContent()}\n

{formatTime(message.timestamp)}

\n );\n};\n\n// Chat component\nconst Chat = ({ user, users, onLogout }: { user: User, users: User[], onLogout: () => void }) => {\n const [messages, setMessages] = useState([]);\n const [inputMessage, setInputMessage] = useState(\"\");\n const [isRecording, setIsRecording] = useState(false);\n const [mediaRecorder, setMediaRecorder] = useState(null);\n const [recordedChunks, setRecordedChunks] = useState([]);\n const messagesEndRef = useRef(null);\n const wsRef = useRef(null);\n \n // Scroll to bottom of messages\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: \"smooth\" });\n };\n \n useEffect(() => {\n scrollToBottom();\n }, [messages]);\n \n // Initialize WebSocket connection\n useEffect(() => {\n const connectWebSocket = () => {\n const ws = new WebSocket(`${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}/ws?userId=${user.id}&username=${user.username}`);\n \n ws.onopen = () => {\n console.log('WebSocket connected');\n };\n \n ws.onmessage = (event) => {\n const data = JSON.parse(event.data);\n \n switch (data.type) {\n case WebSocketMessageType.NEW_MESSAGE:\n if (Array.isArray(data.data)) {\n setMessages(data.data);\n } else {\n setMessages(prev => [...prev, data.data]);\n }\n break;\n \n case WebSocketMessageType.USER_LIST:\n // This is handled by the parent component\n break;\n \n case WebSocketMessageType.USER_JOINED:\n case WebSocketMessageType.USER_LEFT:\n // These are handled by the parent component\n break;\n }\n };\n \n ws.onclose = () => {\n console.log('WebSocket disconnected');\n // Try to reconnect after a delay\n setTimeout(connectWebSocket, 3000);\n };\n \n wsRef.current = ws;\n };\n \n connectWebSocket();\n \n // Fetch initial messages\n fetch('/api/messages')\n .then(res => res.json())\n .then(data => {\n if (data.messages) {\n setMessages(data.messages);\n }\n })\n .catch(err => console.error('Error fetching messages:', err));\n \n // Cleanup on unmount\n return () => {\n if (wsRef.current) {\n wsRef.current.close();\n }\n };\n }, [user]);\n \n // Send text message\n const sendMessage = () => {\n if (!inputMessage.trim()) return;\n \n if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {\n wsRef.current.send(JSON.stringify({\n type: 'message',\n messageType: MessageType.TEXT,\n content: inputMessage\n }));\n \n setInputMessage(\"\");\n }\n };\n \n // Handle Enter key press\n const handleKeyPress = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n sendMessage();\n }\n };\n \n // Start voice recording\n const startRecording = async () => {\n try {\n const stream = await navigator.mediaDevices.getUserMedia({ audio: true });\n const recorder = new MediaRecorder(stream);\n const chunks: Blob[] = [];\n \n recorder.ondataavailable = (e) => {\n if (e.data.size > 0) {\n chunks.push(e.data);\n }\n };\n \n recorder.onstop = async () => {\n const blob = new Blob(chunks, { type: 'audio/webm' });\n \n // Upload voice recording\n const formData = new FormData();\n formData.append('voice', blob);\n \n try {\n const response = await fetch('/api/upload/voice', {\n method: 'POST',\n body: formData\n });\n \n const data = await response.json();\n \n if (data.key) {\n // Send voice message\n if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {\n wsRef.current.send(JSON.stringify({\n type: 'message',\n messageType: MessageType.VOICE,\n content: data.key\n }));\n }\n }\n } catch (error) {\n console.error('Error uploading voice:', error);\n }\n \n // Clear recording state\n setIsRecording(false);\n setRecordedChunks([]);\n \n // Stop all tracks\n stream.getTracks().forEach(track => track.stop());\n };\n \n recorder.start();\n setMediaRecorder(recorder);\n setIsRecording(true);\n setRecordedChunks([]);\n } catch (error) {\n console.error('Error starting recording:', error);\n }\n };\n \n // Stop voice recording\n const stopRecording = () => {\n if (mediaRecorder) {\n mediaRecorder.stop();\n }\n };\n \n // Handle image upload\n const handleImageUpload = async (e: React.ChangeEvent) => {\n const files = e.target.files;\n if (!files || files.length === 0) return;\n \n const file = files[0];\n const formData = new FormData();\n formData.append('image', file);\n \n try {\n const response = await fetch('/api/upload/image', {\n method: 'POST',\n body: formData\n });\n \n const data = await response.json();\n \n if (data.key) {\n // Send image message\n if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {\n wsRef.current.send(JSON.stringify({\n type: 'message',\n messageType: MessageType.IMAGE,\n content: data.key\n }));\n }\n }\n } catch (error) {\n console.error('Error uploading image:', error);\n }\n \n // Clear the input\n e.target.value = '';\n };\n \n return (\n

\n \n \n

Chat Room

\n \n

\n {messages.map((message) => (\n \n ))}\n

\n \n

\n {isRecording && (\n

\n Recording...\n

\n )}\n \n setInputMessage(e.target.value)}\n onKeyPress={handleKeyPress}\n disabled={isRecording}\n />\n \n

\n \n \n 📷\n \n \n {isRecording ? (\n \n ) : (\n \n )}\n \n \n

\n );\n};\n\n// Main App component\nexport function App() {\n const [user, setUser] = useState(null);\n const [users, setUsers] = useState([]);\n const [loading, setLoading] = useState(true);\n \n // Check for initial data\n useEffect(() => {\n // @ts-ignore - This is injected by the server\n const initialData = window.__INITIAL_DATA__;\n \n if (initialData && initialData.onlineUsers) {\n setUsers(initialData.onlineUsers);\n }\n \n setLoading(false);\n }, []);\n \n // Handle login\n const handleLogin = async (username: string) => {\n try {\n const response = await fetch('/api/login', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify({ username })\n });\n \n const data = await response.json();\n \n if (data.user) {\n setUser(data.user);\n \n // Set up WebSocket for user updates\n const ws = new WebSocket(`${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}/ws?userId=${data.user.id}&username=${data.user.username}`);\n \n ws.onmessage = (event) => {\n const wsData = JSON.parse(event.data);\n \n switch (wsData.type) {\n case WebSocketMessageType.USER_LIST:\n setUsers(wsData.data);\n break;\n \n case WebSocketMessageType.USER_JOINED:\n setUsers(prev => {\n // Check if user already exists\n if (prev.some(u => u.id === wsData.data.id)) {\n return prev;\n }\n return [...prev, wsData.data];\n });\n break;\n \n case WebSocketMessageType.USER_LEFT:\n setUsers(prev => prev.filter(u => u.id !== wsData.data.id));\n break;\n }\n };\n }\n } catch (error) {\n console.error('Login error:', error);\n }\n };\n \n // Handle logout\n const handleLogout = () => {\n setUser(null);\n };\n \n if (loading) {\n return

;\n }\n \n return (\n <>\n {user ? (\n \n ) : (\n \n )}\n \n );\n}",[],[99,214,220],[99,214],{"_103":229,"_95":230,"_146":231,"_148":209,"_149":133,"_150":232,"_151":152,"_105":233,"_100":138,"_154":234,"_156":235,"_157":27,"_158":-5,"_159":236,"_98":237},"938e9c78-352e-11f0-ab99-9e149126039e","favicon.svg","37e8e734-62b2-4d89-be66-3be9eb83d321",10,["D",1747713460879],"file","\n",[],[99,230],{"_103":239,"_95":240,"_146":241,"_148":209,"_149":133,"_150":138,"_151":152,"_105":242,"_100":31,"_154":234,"_156":243,"_157":27,"_158":-5,"_159":244,"_98":245},"a6b8516e-352d-11f0-8b64-9e149126039e","index.html","38fce3df-0f19-42a9-8c4a-c2c1286f8a83",["D",1747713063501],"\n\n \n \n \n React Hono Val Town Starter\n \n \n \n \n

\n \n \n \n",[],[99,240],{"_103":247,"_95":248,"_146":249,"_148":209,"_149":133,"_150":138,"_151":152,"_105":250,"_100":31,"_154":173,"_156":251,"_157":27,"_158":-5,"_159":252,"_98":253},"a6b86960-352d-11f0-8b64-9e149126039e","index.tsx","35fb2351-4b31-44f2-9a81-4920dfc00f42",["D",1747713063501],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[99,248],{"_103":255,"_95":256,"_146":257,"_148":209,"_149":133,"_150":258,"_151":152,"_105":259,"_100":138,"_154":234,"_156":260,"_157":27,"_158":-5,"_159":261,"_98":262},"631c8ad2-352e-11f0-b0e4-9e149126039e","style.css","855ae783-233e-46b7-be37-f2c116fa0eec",8,["D",1747713379600],":root {\n --primary-color: #4a90e2;\n --secondary-color: #f0f2f5;\n --text-color: #333;\n --light-text: #777;\n --border-color: #ddd;\n --success-color: #4caf50;\n --error-color: #f44336;\n}\n\n* {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n color: var(--text-color);\n background-color: #f9f9f9;\n height: 100vh;\n overflow: hidden;\n}\n\n.login-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100vh;\n padding: 20px;\n}\n\n.login-form {\n background-color: white;\n padding: 30px;\n border-radius: 8px;\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n width: 100%;\n max-width: 400px;\n text-align: center;\n}\n\n.login-form h1 {\n margin-bottom: 20px;\n color: var(--primary-color);\n}\n\n.login-form input {\n width: 100%;\n padding: 12px;\n margin-bottom: 20px;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n font-size: 16px;\n}\n\n.chat-container {\n display: grid;\n grid-template-columns: 250px 1fr;\n height: 100vh;\n}\n\n.sidebar {\n background-color: white;\n border-right: 1px solid var(--border-color);\n display: flex;\n flex-direction: column;\n}\n\n.sidebar-header {\n padding: 15px;\n border-bottom: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.sidebar-header h2 {\n font-size: 18px;\n font-weight: 600;\n}\n\n.user-list {\n flex: 1;\n overflow-y: auto;\n padding: 10px 0;\n}\n\n.user-item {\n padding: 10px 15px;\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n\n.user-item:hover {\n background-color: var(--secondary-color);\n}\n\n.user-status {\n width: 10px;\n height: 10px;\n border-radius: 50%;\n margin-right: 10px;\n}\n\n.status-online {\n background-color: var(--success-color);\n}\n\n.status-offline {\n background-color: var(--light-text);\n}\n\n.main-content {\n display: flex;\n flex-direction: column;\n background-color: white;\n}\n\n.chat-header {\n padding: 15px;\n border-bottom: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.chat-header h2 {\n font-size: 18px;\n font-weight: 600;\n}\n\n.messages-container {\n flex: 1;\n overflow-y: auto;\n padding: 15px;\n background-color: var(--secondary-color);\n}\n\n.message {\n margin-bottom: 15px;\n display: flex;\n flex-direction: column;\n}\n\n.message-content {\n max-width: 70%;\n padding: 10px 15px;\n border-radius: 18px;\n background-color: white;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n position: relative;\n}\n\n.message-sender {\n font-weight: 600;\n margin-bottom: 5px;\n font-size: 14px;\n}\n\n.message-time {\n font-size: 12px;\n color: var(--light-text);\n margin-top: 5px;\n}\n\n.message-image {\n max-width: 300px;\n max-height: 300px;\n border-radius: 8px;\n cursor: pointer;\n}\n\n.message-voice {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.message-voice audio {\n max-width: 250px;\n}\n\n.my-message {\n align-items: flex-end;\n}\n\n.my-message .message-content {\n background-color: var(--primary-color);\n color: white;\n}\n\n.other-message {\n align-items: flex-start;\n}\n\n.input-container {\n padding: 15px;\n border-top: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n}\n\n.message-input {\n flex: 1;\n padding: 12px 15px;\n border: 1px solid var(--border-color);\n border-radius: 24px;\n font-size: 14px;\n margin-right: 10px;\n}\n\n.message-input:focus {\n outline: none;\n border-color: var(--primary-color);\n}\n\n.input-actions {\n display: flex;\n gap: 10px;\n}\n\n.action-button {\n background-color: var(--secondary-color);\n color: var(--text-color);\n border: none;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: background-color 0.2s;\n}\n\n.action-button:hover {\n background-color: #e4e6e9;\n}\n\n.send-button {\n background-color: var(--primary-color);\n color: white;\n}\n\n.send-button:hover {\n background-color: #357ae8;\n}\n\n.recording-indicator {\n color: var(--error-color);\n font-size: 14px;\n margin-right: 10px;\n display: flex;\n align-items: center;\n gap: 5px;\n}\n\n.recording-indicator span {\n display: inline-block;\n width: 10px;\n height: 10px;\n background-color: var(--error-color);\n border-radius: 50%;\n animation: pulse 1.5s infinite;\n}\n\n@keyframes pulse {\n 0% {\n transform: scale(0.8);\n opacity: 0.8;\n }\n 50% {\n transform: scale(1.2);\n opacity: 1;\n }\n 100% {\n transform: scale(0.8);\n opacity: 0.8;\n }\n}\n\n.btn {\n background-color: var(--primary-color);\n color: white;\n border: none;\n padding: 12px 20px;\n border-radius: 4px;\n font-size: 16px;\n cursor: pointer;\n transition: background-color 0.2s;\n}\n\n.btn:hover {\n background-color: #357ae8;\n}\n\n.error-message {\n color: var(--error-color);\n margin-bottom: 15px;\n}\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n .chat-container {\n grid-template-columns: 1fr;\n }\n \n .sidebar {\n display: none;\n }\n \n .message-content {\n max-width: 85%;\n }\n}",[],[99,256],[99],{"_103":265,"_95":266,"_146":267,"_148":-5,"_149":133,"_150":268,"_151":152,"_105":269,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_159":270,"_98":279},"314c2904-352e-11f0-b2b2-9e149126039e","shared","a4fd03c8-1841-4a8b-bddf-29af38c40685",3,["D",1747713296025],[271],{"_103":272,"_95":273,"_146":274,"_148":267,"_149":133,"_150":268,"_151":152,"_105":275,"_100":31,"_154":173,"_156":276,"_157":27,"_158":-5,"_159":277,"_98":278},"314c064a-352e-11f0-b2b2-9e149126039e","types.ts","314c0708-352e-11f0-b2b2-9e149126039e",["D",1747713296025],"// Message types\nexport enum MessageType {\n TEXT = 'text',\n VOICE = 'voice',\n IMAGE = 'image',\n}\n\n// User status\nexport enum UserStatus {\n ONLINE = 'online',\n OFFLINE = 'offline',\n}\n\n// User interface\nexport interface User {\n id: number;\n username: string;\n status: UserStatus;\n lastSeen: string; // ISO date string\n}\n\n// Message interface\nexport interface Message {\n id: number;\n userId: number;\n username: string;\n type: MessageType;\n content: string; // Text content or blob key for voice/image\n timestamp: string; // ISO date string\n}\n\n// WebSocket message types\nexport enum WebSocketMessageType {\n USER_JOINED = 'user_joined',\n USER_LEFT = 'user_left',\n NEW_MESSAGE = 'new_message',\n USER_LIST = 'user_list',\n}\n\n// WebSocket message interface\nexport interface WebSocketMessage {\n type: WebSocketMessageType;\n data: User | Message | User[] | any;\n}",[],[266,273],[266],{"_103":281,"_95":282,"_146":283,"_148":-5,"_149":133,"_150":284,"_151":152,"_105":285,"_100":138,"_154":234,"_156":286,"_157":27,"_158":-5,"_159":287,"_98":288},"2e00d3a8-352e-11f0-9c0c-9e149126039e","README.md","c1e45f2c-598f-4c85-bb44-85695011a8c8",2,["D",1747713290500],"# Real-time Chat Application\n\nA feature-rich chat application built with React and Hono that allows users to:\n\n- Login with just a username\n- Send and receive text messages in real-time\n- Record and share voice messages\n- Upload and share images\n- See who's currently online\n\n## Project Structure\n\n- **Backend** (`/backend/index.ts`): Hono HTTP server with WebSocket support for real-time messaging\n- **Frontend** (`/frontend/components/App.tsx`): React application for the chat interface\n- **Database**: SQLite for storing users, messages, and file references\n- **Storage**: Val Town blob storage for images and voice recordings\n\n## How to Use\n\n1. Enter your username to log in\n2. Send text messages by typing in the input field and pressing Enter\n3. Record voice messages by clicking the microphone button\n4. Upload images by clicking the image button\n5. See who's online in the user list on the side panel",[],[282],"files",[143,161,168,177,187,197,207,212,218,228,238,246,254,264,271,280],"counts",{"_293":31,"_294":138,"_295":138,"_296":31},"pulls","branches","forks","envVars","contents",[299,302,305,308,311],{"_103":213,"_95":214,"_146":215,"_148":209,"_149":133,"_150":138,"_151":152,"_105":300,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_98":301},["D",1747713063501],[99,214],{"_103":229,"_95":230,"_146":231,"_148":209,"_149":133,"_150":232,"_151":152,"_105":303,"_100":138,"_154":234,"_156":235,"_157":27,"_158":-5,"_98":304},["D",1747713460879],[99,230],{"_103":239,"_95":240,"_146":241,"_148":209,"_149":133,"_150":138,"_151":152,"_105":306,"_100":31,"_154":234,"_156":243,"_157":27,"_158":-5,"_98":307},["D",1747713063501],[99,240],{"_103":247,"_95":248,"_146":249,"_148":209,"_149":133,"_150":138,"_151":152,"_105":309,"_100":31,"_154":173,"_156":251,"_157":27,"_158":-5,"_98":310},["D",1747713063501],[99,248],{"_103":255,"_95":256,"_146":257,"_148":209,"_149":133,"_150":258,"_151":152,"_105":312,"_100":138,"_154":234,"_156":260,"_157":27,"_158":-5,"_98":313},["D",1747713379600],[99,256],{"_103":208,"_95":99,"_146":209,"_148":-5,"_149":133,"_150":138,"_151":152,"_105":315,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_98":316},["D",1747713063501],[99],"upstream",{"_103":319,"_95":320,"_111":-5,"_112":-5,"_109":110,"_21":321},"9da4c742-352d-11f0-aae4-9e149126039e","reactHonoStarter",{"_93":94,"_128":129},"emptyEnvVars","isNew","routes/_app.x.$handle.$name.code.$",{"_93":94,"_95":96,"_97":41,"_100":-7,"_98":99,"_101":326,"_141":330,"_289":379,"_234":380,"_297":382,"_317":393,"_402":152,"_403":-5},{"_103":104,"_95":96,"_105":327,"_107":-5,"_108":27,"_109":110,"_111":-5,"_112":-5,"_12":113,"_114":-5,"_115":27,"_116":-5,"_117":31,"_118":119,"_120":119,"_121":122,"_123":122,"_124":122,"_125":119,"_126":27,"_21":328,"_130":329},["D",1747713063501],{"_93":94,"_128":129},{"_100":132,"_95":41,"_103":133,"_134":104,"_135":136,"_137":138,"_139":110,"_140":113},[331,349,370,376],{"_103":144,"_95":145,"_146":147,"_148":-5,"_149":133,"_150":138,"_151":152,"_105":153,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_159":332,"_98":348},[333,342,345],{"_103":162,"_95":163,"_146":164,"_148":147,"_149":133,"_150":165,"_151":152,"_105":166,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_159":334,"_98":341},[335,338],{"_103":169,"_95":170,"_146":171,"_148":164,"_149":133,"_150":165,"_151":152,"_105":172,"_100":31,"_154":173,"_156":174,"_157":27,"_158":-5,"_159":336,"_98":337},[],[145,163,170],{"_103":178,"_95":179,"_146":180,"_148":164,"_149":133,"_150":181,"_151":152,"_105":182,"_100":31,"_154":173,"_156":183,"_157":27,"_158":-5,"_159":339,"_98":340},[],[145,163,179],[145,163],{"_103":188,"_95":189,"_146":190,"_148":147,"_149":133,"_150":191,"_151":152,"_105":192,"_100":138,"_154":193,"_156":194,"_157":27,"_158":-5,"_159":343,"_98":344},[],[145,189],{"_103":198,"_95":199,"_146":200,"_148":147,"_149":133,"_150":201,"_151":152,"_105":202,"_100":31,"_154":173,"_156":203,"_157":27,"_158":-5,"_159":346,"_98":347},[],[145,199],[145],{"_103":208,"_95":99,"_146":209,"_148":-5,"_149":133,"_150":138,"_151":152,"_105":210,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_159":350,"_98":369},[351,357,360,363,366],{"_103":213,"_95":214,"_146":215,"_148":209,"_149":133,"_150":138,"_151":152,"_105":216,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_159":352,"_98":356},[353],{"_103":219,"_95":220,"_146":221,"_148":215,"_149":133,"_150":222,"_151":152,"_105":223,"_100":138,"_154":173,"_156":224,"_157":27,"_158":-5,"_159":354,"_98":355},[],[99,214,220],[99,214],{"_103":229,"_95":230,"_146":231,"_148":209,"_149":133,"_150":232,"_151":152,"_105":233,"_100":138,"_154":234,"_156":235,"_157":27,"_158":-5,"_159":358,"_98":359},[],[99,230],{"_103":239,"_95":240,"_146":241,"_148":209,"_149":133,"_150":138,"_151":152,"_105":242,"_100":31,"_154":234,"_156":243,"_157":27,"_158":-5,"_159":361,"_98":362},[],[99,240],{"_103":247,"_95":248,"_146":249,"_148":209,"_149":133,"_150":138,"_151":152,"_105":250,"_100":31,"_154":173,"_156":251,"_157":27,"_158":-5,"_159":364,"_98":365},[],[99,248],{"_103":255,"_95":256,"_146":257,"_148":209,"_149":133,"_150":258,"_151":152,"_105":259,"_100":138,"_154":234,"_156":260,"_157":27,"_158":-5,"_159":367,"_98":368},[],[99,256],[99],{"_103":265,"_95":266,"_146":267,"_148":-5,"_149":133,"_150":268,"_151":152,"_105":269,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_159":371,"_98":375},[372],{"_103":272,"_95":273,"_146":274,"_148":267,"_149":133,"_150":268,"_151":152,"_105":275,"_100":31,"_154":173,"_156":276,"_157":27,"_158":-5,"_159":373,"_98":374},[],[266,273],[266],{"_103":281,"_95":282,"_146":283,"_148":-5,"_149":133,"_150":284,"_151":152,"_105":285,"_100":138,"_154":234,"_156":286,"_157":27,"_158":-5,"_159":377,"_98":378},[],[282],[331,333,335,338,342,345,349,351,353,357,360,363,366,370,372,376],{"_103":208,"_95":99,"_146":209,"_148":-5,"_149":133,"_150":138,"_151":152,"_105":315,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_98":381},[99],[383,385,387,389,391],{"_103":213,"_95":214,"_146":215,"_148":209,"_149":133,"_150":138,"_151":152,"_105":300,"_100":31,"_154":155,"_156":-5,"_157":27,"_158":-5,"_98":384},[99,214],{"_103":229,"_95":230,"_146":231,"_148":209,"_149":133,"_150":232,"_151":152,"_105":303,"_100":138,"_154":234,"_156":235,"_157":27,"_158":-5,"_98":386},[99,230],{"_103":239,"_95":240,"_146":241,"_148":209,"_149":133,"_150":138,"_151":152,"_105":306,"_100":31,"_154":234,"_156":243,"_157":27,"_158":-5,"_98":388},[99,240],{"_103":247,"_95":248,"_146":249,"_148":209,"_149":133,"_150":138,"_151":152,"_105":309,"_100":31,"_154":173,"_156":251,"_157":27,"_158":-5,"_98":390},[99,248],{"_103":255,"_95":256,"_146":257,"_148":209,"_149":133,"_150":258,"_151":152,"_105":312,"_100":138,"_154":234,"_156":260,"_157":27,"_158":-5,"_98":392},[99,256],{"_103":136,"_105":394,"_395":396,"_95":41,"_134":319,"_100":138,"_135":397,"_137":398,"_399":-5,"_126":27,"_109":110,"_400":94,"_401":320},["D",1747713048302],"updatedAt",["D",1747713048302],"961078ea-f528-11ef-aa68-569c3dd06744",54,"lockfileKey","userHandle","projectName","showCompareCallout","pull","routes/_app","actionData","errors"]