📋 Post a Job

\n setJobTitle(e.target.value)}\n style={inputStyle}\n />\n setJobCompany(e.target.value)}\n style={inputStyle}\n />\n

setJobDescription(e.target.value)}\n        style={{...inputStyle, height: '150px'}}\n      />\n      <button \n        onClick={submitJob}\n        style={buttonStyle}\n      >\n        Post Job\n      </button>\n    </div>\n  );\n\n  const renderJobList = () => (\n    <div>\n      <h2>💼 Job Listings</h2>\n      {jobs.length === 0 ? (\n        <p>No job listings yet</p>\n      ) : (\n        jobs.map((job, index) => (\n          <div \n            key={index} \n            style={{\n              border: '1px solid #e0e0e0', \n              borderRadius: '5px', \n              padding: '15px', \n              marginBottom: '10px'\n            }}\n          >\n            <h3>{job.title}</h3>\n            <p><strong>Company:</strong> {job.company}</p>\n            <p>{job.description}</p>\n            <small>Posted on {new Date(job.timestamp).toLocaleString()}</small>\n          </div>\n        ))\n      )}\n    </div>\n  );\n\n  const renderChatRoom = () => (\n    <div style={{ display: 'flex', flexDirection: 'column', height: '500px' }}>\n      <div \n        style={{ \n          flexGrow: 1, \n          overflowY: 'auto', \n          border: '1px solid #e0e0e0', \n          padding: '10px' \n        }}\n      >\n        {chatMessages.map((msg, index) => (\n          <div \n            key={index} \n            style={{ \n              marginBottom: '10px', \n              padding: '5px', \n              backgroundColor: '#f0f0f0', \n              borderRadius: '5px' \n            }}\n          >\n            <strong>{msg.username || 'Anonymous'}</strong>\n            <p>{msg.message}</p>\n            <small>{new Date(msg.timestamp).toLocaleTimeString()}</small>\n          </div>\n        ))}\n        <div ref={chatEndRef} />\n      </div>\n      <div style={{ display: 'flex', marginTop: '10px' }}>\n        <input \n          type=\"text\" \n          placeholder=\"Type a message...\" \n          value={chatMessage}\n          onChange={(e) => setChatMessage(e.target.value)}\n          onKeyPress={(e) => e.key === 'Enter' && sendChatMessage()}\n          style={{...inputStyle, flexGrow: 1, marginRight: '10px'}}\n        />\n        <button \n          onClick={sendChatMessage}\n          style={buttonStyle}\n        >\n          Send\n        </button>\n      </div>\n    </div>\n  );\n\n  const renderGoogleForm = () => (\n    <div>\n      <h2>📝 Community Survey</h2>\n      <iframe \n        src=\"https://docs.google.com/forms/d/e/1FAIpQLSdJNHxhOKqLWfNj4dZQg7ydmVkJDrVVVRQVqQJNmEF3fmTOUQ/viewform?embedded=true\" \n        width=\"100%\" \n        height=\"600\" \n        frameBorder=\"0\" \n        marginHeight=\"0\" \n        marginWidth=\"0\"\n        style={{\n          border: '1px solid #e0e0e0',\n          borderRadius: '5px'\n        }}\n      >\n        Loading…\n      </iframe>\n      <p style={{ textAlign: 'center', marginTop: '10px' }}>\n        <a \n          href=\"https://docs.google.com/forms/d/1-8DTHn8ArVRUQ-FR-cx8n6i8aPAgJbytVFqJINmd1i0/edit\" \n          target=\"_blank\" \n          rel=\"noopener noreferrer\"\n          style={{\n            color: '#4CAF50',\n            textDecoration: 'none',\n            fontWeight: 'bold'\n          }}\n        >\n          Open Form in New Tab\n        </a>\n      </p>\n    </div>\n  );\n\n  return (\n    <div style={{ maxWidth: '800px', margin: 'auto', padding: '20px', fontFamily: 'Arial' }}>\n      <h1>🚀 Job Opportunities Network</h1>\n      <div style={{ \n        display: 'flex', \n        marginBottom: '20px', \n        justifyContent: 'center',\n        flexWrap: 'wrap'\n      }}>\n        <button \n          onClick={() => setView('jobs')}\n          style={{...buttonStyle, margin: '0 10px 10px 10px'}}\n        >\n          Job Listings\n        </button>\n        <button \n          onClick={() => setView('post')}\n          style={{...buttonStyle, margin: '0 10px 10px 10px'}}\n        >\n          Post Job\n        </button>\n        <button \n          onClick={() => setView('chat')}\n          style={{...buttonStyle, margin: '0 10px 10px 10px'}}\n        >\n          Chat Room\n        </button>\n        <button \n          onClick={() => setView('survey')}\n          style={{...buttonStyle, margin: '0 10px 10px 10px'}}\n        >\n          Community Survey\n        </button>\n      </div>\n\n      {view === 'jobs' && renderJobList()}\n      {view === 'post' && renderJobPosting()}\n      {view === 'chat' && renderChatRoom()}\n      {view === 'survey' && renderGoogleForm()}\n\n      <a \n        href={import.meta.url.replace(\"esm.town\", \"val.town\")} \n        target=\"_top\" \n        style={{ color: '#888', fontSize: '0.8em', textDecoration: 'none', display: 'block', marginTop: '20px' }}\n      >\n        View Source\n      </a>\n    </div>\n  );\n}\n\nconst inputStyle = {\n  width: '100%', \n  padding: '10px', \n  marginBottom: '10px', \n  border: '1px solid #ccc', \n  borderRadius: '5px'\n};\n\nconst buttonStyle = {\n  padding: '10px 15px', \n  background: '#4CAF50', \n  color: 'white', \n  border: 'none', \n  borderRadius: '5px',\n  cursor: 'pointer'\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 = new URL(import.meta.url).pathname.split(\"/\").at(-1);\n  const SCHEMA_VERSION = 1;\n\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      description TEXT NOT NULL,\n      company TEXT NOT NULL,\n      timestamp DATETIME DEFAULT CURRENT_TIMESTAMP\n    )\n  `);\n\n  await sqlite.execute(`\n    CREATE TABLE IF NOT EXISTS ${KEY}_chat_${SCHEMA_VERSION} (\n      id INTEGER PRIMARY KEY AUTOINCREMENT,\n      username TEXT,\n      message TEXT NOT NULL,\n      timestamp DATETIME DEFAULT CURRENT_TIMESTAMP\n    )\n  `);\n\n  const url = new URL(request.url);\n\n  if (request.method === 'POST' && url.pathname === '/submit-job') {\n    const { title, description, company } = await request.json();\n    await sqlite.execute(`\n      INSERT INTO ${KEY}_jobs_${SCHEMA_VERSION} (title, description, company) \n      VALUES (?, ?, ?)\n    `, [title, description, company]);\n    return new Response(JSON.stringify({ success: true }), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  if (request.method === 'POST' && url.pathname === '/send-chat') {\n    const { message } = await request.json();\n    await sqlite.execute(`\n      INSERT INTO ${KEY}_chat_${SCHEMA_VERSION} (message, username) \n      VALUES (?, ?)\n    `, [message, 'Anonymous']);\n    return new Response(JSON.stringify({ success: true }), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  if (request.method === 'GET' && url.pathname === '/get-jobs') {\n    const result = await sqlite.execute(`\n      SELECT title, description, company, timestamp \n      FROM ${KEY}_jobs_${SCHEMA_VERSION} \n      ORDER BY timestamp DESC \n      LIMIT 20\n    `);\n    return new Response(JSON.stringify(result.rows), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  if (request.method === 'GET' && url.pathname === '/get-chat') {\n    const result = await sqlite.execute(`\n      SELECT username, message, timestamp \n      FROM ${KEY}_chat_${SCHEMA_VERSION} \n      ORDER BY timestamp DESC \n      LIMIT 50\n    `);\n    return new Response(JSON.stringify(result.rows.reverse()), { \n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  return new Response(`\n    <html>\n      <head>\n        <title>Job Opportunities Network</title>\n        <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\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}",["D",1739814901233],"version","currentUserHasLiked","referenceCount","dependencyCount","commentCount","prCount","mergedPr",{"_96":97,"_101":102},"forkedVal","interval","description","@jsxImportSource https://esm.sh/react@18.2.0","latestEvaluation","slug","Sindy04/moodTracker","versions",[159,163,166],{"_98":160,"_142":90,"_161":162},["D",1739814901233],"n","1",{"_98":164,"_142":110,"_161":165},["D",1739814235830],"2",{"_98":167,"_142":31,"_161":168},["D",1739813879623],"3","hasNext","filters",{"_172":173,"_174":175,"_131":132},"sort","newest","type","all","routes/_app","actionData","errors"]
</article></body></html>