💼 Job Opportunities

\n setNewJob({...newJob, title: e.target.value})}\n required\n />\n setNewJob({...newJob, company: e.target.value})}\n required\n />\n

setNewJob({...newJob, description: e.target.value})}\n          required\n        />\n        <input \n          type=\"email\"\n          placeholder=\"Contact Email\" \n          value={newJob.contactEmail}\n          onChange={(e) => setNewJob({...newJob, contactEmail: e.target.value})}\n          required\n        />\n        <button type=\"submit\">Post Job</button>\n      </form>\n      <div className=\"job-list\">\n        {jobs.map((job, index) => (\n          <div key={index} className=\"job-item\">\n            <h3>{job.title} @ {job.company}</h3>\n            <p>{job.description}</p>\n            <p>Contact: {job.contactEmail}</p>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n}\n\nfunction UsernameModal({ onSetUsername }) {\n  const [username, setUsername] = useState('');\n\n  const handleSubmit = (e) => {\n    e.preventDefault();\n    if (username.trim()) {\n      onSetUsername(username.trim());\n    }\n  };\n\n  return (\n    <div className=\"username-modal\">\n      <div className=\"username-content\">\n        <h2>👤 Choose Your Username</h2>\n        <form onSubmit={handleSubmit}>\n          <input \n            placeholder=\"Enter your username\" \n            value={username}\n            onChange={(e) => setUsername(e.target.value)}\n            required\n            maxLength={20}\n          />\n          <button type=\"submit\">Join Chat</button>\n        </form>\n      </div>\n    </div>\n  );\n}\n\nfunction ChatRoom() {\n  const [messages, setMessages] = useState([]);\n  const [newMessage, setNewMessage] = useState('');\n  const [username, setUsername] = useState(localStorage.getItem('chatUsername') || '');\n\n  const fetchMessages = async () => {\n    const response = await fetch('/chat');\n    const chatData = await response.json();\n    setMessages(chatData);\n  };\n\n  const handleUsernameSet = (name) => {\n    setUsername(name);\n    localStorage.setItem('chatUsername', name);\n  };\n\n  const handleMessageSubmit = async (e) => {\n    e.preventDefault();\n    await fetch('/chat', {\n      method: 'POST',\n      headers: { 'Content-Type': 'application/json' },\n      body: JSON.stringify({ \n        message: newMessage,\n        username: username \n      })\n    });\n    setNewMessage('');\n    fetchMessages();\n  };\n\n  useEffect(() => {\n    fetchMessages();\n    const interval = setInterval(fetchMessages, 5000);\n    return () => clearInterval(interval);\n  }, []);\n\n  if (!username) {\n    return <UsernameModal onSetUsername={handleUsernameSet} />;\n  }\n\n  return (\n    <div className=\"chat-room\">\n      <h2>💬 Community Chat</h2>\n      <div className=\"message-list\">\n        {messages.map((msg, index) => (\n          <div key={index} className=\"message\">\n            <strong>{msg.username}</strong>: {msg.message}\n          </div>\n        ))}\n      </div>\n      <form onSubmit={handleMessageSubmit}>\n        <input \n          placeholder=\"Type a message\" \n          value={newMessage}\n          onChange={(e) => setNewMessage(e.target.value)}\n          required\n        />\n        <button type=\"submit\">Send</button>\n      </form>\n    </div>\n  );\n}\n\nfunction App() {\n  return (\n    <div className=\"job-chat-app\">\n      <JobBoard />\n      <ChatRoom />\n    </div>\n  );\n}\n\nfunction client() {\n  createRoot(document.getElementById(\"root\")).render(<App />);\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise<Response> {\n  const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n  const KEY = \"ALXAISK\";\n  const SCHEMA_VERSION = 3; // Increment schema version due to username change\n\n  // Create jobs table\n  await sqlite.execute(`\n    CREATE TABLE IF NOT EXISTS ${KEY}_jobs_${SCHEMA_VERSION} (\n      id INTEGER PRIMARY KEY AUTOINCREMENT,\n      title TEXT NOT NULL,\n      company TEXT NOT NULL,\n      description TEXT NOT NULL,\n      contact_email TEXT NOT NULL,\n      created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n    )\n  `);\n\n  // Create chat messages table\n  await sqlite.execute(`\n    CREATE TABLE IF NOT EXISTS ${KEY}_chat_${SCHEMA_VERSION} (\n      id INTEGER PRIMARY KEY AUTOINCREMENT,\n      username TEXT NOT NULL,\n      message TEXT NOT NULL,\n      created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n    )\n  `);\n\n  // Route handling\n  const url = new URL(request.url);\n  \n  // Jobs endpoint\n  if (url.pathname === '/jobs' && request.method === 'GET') {\n    const jobs = await sqlite.execute(`\n      SELECT * FROM ${KEY}_jobs_${SCHEMA_VERSION} \n      ORDER BY created_at DESC \n      LIMIT 50\n    `);\n    return Response.json(jobs.rows);\n  }\n\n  if (url.pathname === '/jobs' && request.method === 'POST') {\n    const { title, company, description, contactEmail } = await request.json();\n    await sqlite.execute(`\n      INSERT INTO ${KEY}_jobs_${SCHEMA_VERSION} \n      (title, company, description, contact_email) \n      VALUES (?, ?, ?, ?)\n    `, [title, company, description, contactEmail]);\n    return Response.json({ success: true });\n  }\n\n  // Chat endpoint\n  if (url.pathname === '/chat' && request.method === 'GET') {\n    const messages = await sqlite.execute(`\n      SELECT * FROM ${KEY}_chat_${SCHEMA_VERSION} \n      ORDER BY created_at DESC \n      LIMIT 50\n    `);\n    return Response.json(messages.rows);\n  }\n\n  if (url.pathname === '/chat' && request.method === 'POST') {\n    const { message, username } = await request.json();\n    await sqlite.execute(`\n      INSERT INTO ${KEY}_chat_${SCHEMA_VERSION} \n      (username, message) \n      VALUES (?, ?)\n    `, [username, message]);\n    return Response.json({ success: true });\n  }\n\n  // Main page\n  return new Response(`\n    <html>\n      <head>\n        <title>Job Chat App</title>\n        <style>${css}</style>\n      </head>\n      <body>\n        <div id=\"root\"></div>\n        <script src=\"https://esm.town/v/std/catch\"></script>\n        <script type=\"module\" src=\"${import.meta.url}\"></script>\n      </body>\n    </html>\n  `, {\n    headers: { 'Content-Type': 'text/html' }\n  });\n}\n\nconst css = `\nbody {\n  font-family: system-ui, sans-serif;\n  max-width: 800px;\n  margin: 0 auto;\n  padding: 20px;\n  background-color: #f4f4f4;\n}\n\n.job-chat-app {\n  display: flex;\n  gap: 20px;\n}\n\n.job-board, .chat-room {\n  background: white;\n  padding: 20px;\n  border-radius: 8px;\n  box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n  flex: 1;\n}\n\nform {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  margin-bottom: 20px;\n}\n\ninput, textarea {\n  padding: 10px;\n  border: 1px solid #ddd;\n  border-radius: 4px;\n}\n\nbutton {\n  background-color: #007bff;\n  color: white;\n  border: none;\n  padding: 10px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n\n.job-list, .message-list {\n  max-height: 400px;\n  overflow-y: auto;\n}\n\n.job-item, .message {\n  border-bottom: 1px solid #eee;\n  padding: 10px 0;\n}\n\n.username-modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: rgba(0,0,0,0.5);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  z-index: 1000;\n}\n\n.username-content {\n  background: white;\n  padding: 30px;\n  border-radius: 8px;\n  text-align: center;\n  box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n}\n`;","deleted","label","children",[],[152],"files",[150],"counts",{"_173":32,"_174":175,"_176":32,"_177":178},"pulls","branches",1,"forks","envVars",{"_179":32,"_180":32},"count","emptyCount","contents",[183],{"_102":151,"_95":152,"_153":114,"_154":-5,"_155":138,"_156":137,"_157":116,"_104":184,"_99":159,"_160":161,"_162":163,"_164":22,"_165":-5,"_98":185},["D",1742858994428],[152],"file","upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name._index",{"_93":94,"_95":96,"_97":-7,"_99":-7,"_100":195,"_181":200,"_203":-7,"_204":-5,"_205":-5,"_169":206,"_210":211},{"_102":103,"_95":96,"_104":196,"_106":-5,"_107":22,"_108":109,"_110":-5,"_111":-5,"_14":112,"_113":114,"_115":116,"_117":-5,"_118":32,"_16":119,"_120":121,"_122":121,"_123":124,"_125":124,"_126":124,"_127":121,"_128":121,"_23":197,"_132":198,"_135":199,"_147":22},["D",1746230407522],{"_93":94,"_130":131},{"_93":94,"_134":131},{"_99":137,"_95":43,"_102":138,"_139":103,"_140":-5,"_141":-5,"_142":-5,"_143":-5,"_144":-5,"_145":96,"_146":94},[201],{"_102":151,"_95":152,"_153":114,"_154":-5,"_155":138,"_156":137,"_157":116,"_104":184,"_99":159,"_160":161,"_162":163,"_164":22,"_165":-5,"_98":202},[152],"readme","upstream","pull",[207],{"_102":151,"_95":152,"_153":114,"_154":-5,"_155":138,"_156":137,"_157":116,"_104":158,"_99":159,"_160":161,"_162":163,"_164":22,"_165":-5,"_166":208,"_98":209},[],[152],"previews",[207],"actionData","errors"]
</article></body></html>

triniteams

ALXAISK