Val Town Code SearchReturn to Val Town

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
176│   ├── database/
177│   │   ├── migrations.ts    # Schema definitions
178│   │   ├── queries.ts       # DB query functions
179│   │   └── README.md
180│   └── routes/              # Route modules
195└── shared/
196    ├── README.md
197    └── utils.ts             # Shared types and functions
198```
199
203- Main entry point should be `backend/index.ts`
204- Do NOT use Hono serveStatic middleware
205- **Static asset serving:** Use the utility functions to read and serve project files:
206  ```ts
207  import { readFile, serveFile } from "https://esm.town/v/std/utils/index.ts";
237- Run migrations on startup or comment out for performance
238- Change table names when modifying schemas rather than altering
239- Export clear query functions with proper TypeScript typing
240
241## Common Gotchas and Solutions

1/** @jsxImportSource https://esm.sh/react@18.2.0?dev */
2
3export function ValTownLogo () {
4  return (
5    <svg

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

1import { useEffect } from "react";
2
3export function useUsageStats(messages: any[], usages: any[]) {
4  useEffect(() => {
5    if (!messages?.length) return;

7 *
8 * @param {Array} dependencies - Array of dependencies that trigger scrolling when changed
9 * @returns {Object} An object containing containerRef and scrollToBottom function
10 */
11export function useScrollToBottomContainer(dependencies = []) {
12  const containerRef = useRef(null);
13
28
29// body scroll version
30export function useScrollToBottom(dependencies = []) {
31  const bottomRef = useRef(null);
32

6 * This includes a fallback to inference calls data when usage data is missing
7 */
8export async function getUserSummary() {
9  // First, get the standard grouped data from the usage table
10  const groupedUsageData = await sqlite.execute(`

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);

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

1import { useEffect } from "react";
2
3function setLoadingFavicon() {
4  document.querySelector('link[rel="icon"]').href = "/favicon-loading.svg";
5}
6function resetFavicon() {
7  document.querySelector('link[rel="icon"]').href = "/favicon.svg";
8}
9
10export function useLoadingFavicon(loading: boolean) {
11  useEffect(() => {
12    if (loading) setLoadingFavicon();

3const ENDPOINT = "/api/create-project";
4
5export function useCreateProject() {
6  const [data, setData] = useState<any>(null);
7  const [loading, setLoading] = useState(false);