🏢 Job Postings

\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          <button type=\"submit\">Post Job</button>\n        </form>\n        <div className=\"job-list\">\n          {jobs.map((job, index) => (\n            <div key={index} className=\"job-card\">\n              <h3>{job.title} @ {job.company}</h3>\n              <p>{job.description}</p>\n            </div>\n          ))}\n        </div>\n      </div>\n      \n      <div className=\"chat-section\">\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 || 'Anonymous'}</strong>: {msg.content}\n            </div>\n          ))}\n        </div>\n        <form onSubmit={submitMessage}>\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      <a \n        href={import.meta.url.replace(\"esm.town\", \"val.town\")} \n        target=\"_top\" \n        style={{color: '#888', fontSize: '0.8em', textDecoration: 'none'}}\n      >\n        View Source\n      </a>\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  // Dynamically import sqlite with full error handling\n  let sqlite: any;\n  try {\n    const sqliteModule = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n    sqlite = sqliteModule.sqlite;\n  } catch (importError) {\n    console.error('Failed to import SQLite module:', importError);\n    return new Response(JSON.stringify({\n      error: 'Failed to load database module',\n      details: importError.toString()\n    }), { \n      status: 500,\n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n\n  try {\n    const KEY = \"Jobposting\";\n    const SCHEMA_VERSION = 5; // Increment schema version\n\n    // Detailed logging for debugging\n    console.log(`Initializing database for key: ${KEY}, schema version: ${SCHEMA_VERSION}`);\n\n    // Wrap table creation with more robust error handling\n    const createTable = async (tableName: string, schema: string) => {\n      try {\n        console.log(`Attempting to create table: ${tableName}`);\n        await sqlite.execute(`\n          CREATE TABLE IF NOT EXISTS ${tableName} (\n            ${schema}\n          )\n        `);\n        console.log(`Successfully created table: ${tableName}`);\n      } catch (tableError) {\n        console.error(`Error creating table ${tableName}:`, tableError);\n        throw tableError;\n      }\n    };\n\n    // Create jobs table with full schema\n    await createTable(\n      `${KEY}_jobs_${SCHEMA_VERSION}`, \n      `\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        title TEXT NOT NULL,\n        company TEXT NOT NULL,\n        description TEXT NOT NULL,\n        created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n      `\n    );\n\n    // Create messages table with full schema\n    await createTable(\n      `${KEY}_messages_${SCHEMA_VERSION}`, \n      `\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        username TEXT DEFAULT 'Anonymous',\n        content TEXT NOT NULL,\n        created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n      `\n    );\n\n    // Handle job posting\n    if (request.method === 'POST' && new URL(request.url).pathname === '/jobs') {\n      try {\n        const jobData = await request.json();\n        await sqlite.execute(\n          `INSERT INTO ${KEY}_jobs_${SCHEMA_VERSION} (title, company, description) VALUES (?, ?, ?)`,\n          [jobData.title, jobData.company, jobData.description]\n        );\n        return new Response(JSON.stringify({ success: true }), { \n          headers: { 'Content-Type': 'application/json' } \n        });\n      } catch (jobError) {\n        console.error('Job posting error:', jobError);\n        return new Response(JSON.stringify({\n          error: 'Failed to post job',\n          details: jobError.toString()\n        }), { \n          status: 500,\n          headers: { 'Content-Type': 'application/json' } \n        });\n      }\n    }\n\n    // Handle message posting\n    if (request.method === 'POST' && new URL(request.url).pathname === '/messages') {\n      try {\n        const messageData = await request.json();\n        await sqlite.execute(\n          `INSERT INTO ${KEY}_messages_${SCHEMA_VERSION} (content) VALUES (?)`,\n          [messageData.content]\n        );\n        return new Response(JSON.stringify({ success: true }), { \n          headers: { 'Content-Type': 'application/json' } \n        });\n      } catch (messageError) {\n        console.error('Message posting error:', messageError);\n        return new Response(JSON.stringify({\n          error: 'Failed to post message',\n          details: messageError.toString()\n        }), { \n          status: 500,\n          headers: { 'Content-Type': 'application/json' } \n        });\n      }\n    }\n\n    // Fetch jobs\n    if (request.method === 'GET' && new URL(request.url).pathname === '/jobs') {\n      try {\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 new Response(JSON.stringify(jobs.rows || []), { \n          headers: { 'Content-Type': 'application/json' } \n        });\n      } catch (jobFetchError) {\n        console.error('Job fetch error:', jobFetchError);\n        return new Response(JSON.stringify({\n          error: 'Failed to fetch jobs',\n          details: jobFetchError.toString()\n        }), { \n          status: 500,\n          headers: { 'Content-Type': 'application/json' } \n        });\n      }\n    }\n\n    // Fetch messages\n    if (request.method === 'GET' && new URL(request.url).pathname === '/messages') {\n      try {\n        const messages = await sqlite.execute(`\n          SELECT * FROM ${KEY}_messages_${SCHEMA_VERSION} \n          ORDER BY created_at DESC \n          LIMIT 50\n        `);\n        return new Response(JSON.stringify(messages.rows || []), { \n          headers: { 'Content-Type': 'application/json' } \n        });\n      } catch (messageFetchError) {\n        console.error('Message fetch error:', messageFetchError);\n        return new Response(JSON.stringify({\n          error: 'Failed to fetch messages',\n          details: messageFetchError.toString()\n        }), { \n          status: 500,\n          headers: { 'Content-Type': 'application/json' } \n        });\n      }\n    }\n\n    // Serve HTML\n    return new Response(`\n      <html>\n        <head>\n          <title>Job Board & Community Chat</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  } catch (globalError) {\n    console.error('Global server error:', globalError);\n    return new Response(JSON.stringify({\n      error: 'Unexpected server error',\n      details: globalError.toString()\n    }), { \n      status: 500,\n      headers: { 'Content-Type': 'application/json' } \n    });\n  }\n}\n\nconst css = `\nbody {\n  font-family: system-ui, sans-serif;\n  margin: 0;\n  padding: 20px;\n  background-color: #f4f4f4;\n}\n.app-container {\n  display: flex;\n  gap: 20px;\n}\n.jobs-section, .chat-section {\n  background: white;\n  border-radius: 8px;\n  padding: 20px;\n  width: 50%;\n  box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n}\n.error-banner {\n  background-color: #ffdddd;\n  color: red;\n  padding: 10px;\n  margin-bottom: 20px;\n  border-radius: 4px;\n  text-align: center;\n}\nform {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  margin-bottom: 20px;\n}\ninput, textarea {\n  padding: 10px;\n  border: 1px solid #ddd;\n  border-radius: 4px;\n}\nbutton {\n  background-color: #4CAF50;\n  color: white;\n  border: none;\n  padding: 10px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.job-card, .message {\n  background-color: #f9f9f9;\n  border-radius: 4px;\n  padding: 10px;\n  margin-bottom: 10px;\n}\n.message-list {\n  max-height: 400px;\n  overflow-y: auto;\n}\n`;","deleted","label",[98],"permalink","https://www.val.town/x/Cobby_Obieh/Jobposting/code/main.tsx","extension","actionData","errors"]
</article></body></html>