Val Town Code SearchReturn to Val Town

14
15// Create the attendees table if it doesn't exist
16async function initializeDatabase() {
17  console.log("Initializing database...");
18  try {

3const USER_ENDPOINT = "/api/user";
4
5export function useUser () {
6  const [data, setData] = useState<any>(null);
7  const [loading, setLoading] = useState(true);

4
5- Ask clarifying questions when requirements are ambiguous
6- Provide complete, functional solutions rather than skeleton implementations
7- Test your logic against edge cases before presenting the final solution
8- Ensure all code follows Val Town's specific platform requirements
17- **Never bake in secrets into the code** - always use environment variables
18- Include comments explaining complex logic (avoid commenting obvious operations)
19- Follow modern ES6+ conventions and functional programming practices if possible
20
21## Types of triggers
28
29```ts
30export default async function (req: Request) {
31  return new Response("Hello World");
32}
40
41```ts
42export default async function () {
43  // Scheduled task code
44}
52
53```ts
54export default async function (email: Email) {
55  // Process email
56}
60## Val Town Standard Libraries
61
62Val Town provides several hosted services and utility functions.
63
64### Blob Storage
114```
115
116## Val Town Utility Functions
117
118Val Town provides several utility functions to help with common project tasks.
119
120### Importing Utilities
194│   ├── database/
195│   │   ├── migrations.ts    # Schema definitions
196│   │   ├── queries.ts       # DB query functions
197│   │   └── README.md
198│   └── routes/              # Route modules
213└── shared/
214    ├── README.md
215    └── utils.ts             # Shared types and functions
216```
217
221- Main entry point should be `backend/index.ts`
222- Do NOT use Hono serveStatic middleware
223- **Static asset serving:** Use the utility functions to read and serve project files:
224  ```ts
225  import { readFile, serveFile } from "https://esm.town/v/std/utils@85-main/index.ts";
255- Run migrations on startup or comment out for performance
256- Change table names when modifying schemas rather than altering
257- Export clear query functions with proper TypeScript typing
258
259## Common Gotchas and Solutions

3const ENDPOINT = "/api/project-branches";
4
5export function useBranches (projectId: string) {
6  const [data, setData] = useState<any>(null);
7  const [loading, setLoading] = useState(true);

4const FILES_ENDPOINT = "/api/project-files";
5
6export function useProject (projectId: string, branchId?: string) {
7  const [data, setData] = useState<any>(null);
8  const [loading, setLoading] = useState(true);

7const NEW_BRANCH_VAL = "__NEW_BRANCH__";
8
9export function BranchSelect () {
10  const { projectId, branchId } = useParams() as {
11    projectId: string;

3const ENDPOINT = "/api/projects-loader";
4
5export function useProjects () {
6  const [data, setData] = useState<any>(null);
7  const [loading, setLoading] = useState(true);

6import { AppContext } from "./App.tsx";
7
8export function Header () {
9  const navigate = useNavigate();
10
25}
26
27function LogOut () {
28  const { user } = useContext(AppContext);
29  return (
46}
47
48function ValTownLogo () {
49  return (
50    <svg
64}
65
66function DarkButton () {
67  const [dark, setDark] = useLocalStorage("DARK_MODE", false);
68  const toggle = () => {
89}
90
91function AudioButton () {
92  const {audio, setAudio} = useContext(AppContext);
93

2import React from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
3
4export function EventDetails() {
5  return (
6    <div className="mt-4 p-4 bg-blue-50 rounded-lg border border-blue-100 text-gray-700 text-left w-full">

2import React from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
3
4export function ThankYouMessage() {
5  return (
6    <div className="text-center py-8">