Val Town Code SearchReturn to Val Town

1import { email } from "https://esm.town/v/std/email?v=9";
2
3// Fetches a random joke.
4async function fetchRandomJoke() {
5  const response = await fetch(
6    "https://official-joke-api.appspot.com/random_joke",
7  );
9}
10
11const randomJoke = await fetchRandomJoke();
12const setup = randomJoke.setup;
13const punchline = randomJoke.punchline;

10
11  const queryUrl = `https://steamcommunity.com/market/pricehistory/?appid=730&market_hash_name=${name}`;
12  const res = await fetch(queryUrl, {
13    headers: { "Cookie": Deno.env.get("steam_cookie") ?? "" },
14  });

230      uploadButton.disabled = true;
231      uploadButton.textContent = "Uploading...";
232      const response = await fetch("/api/upload", {
233        method: "POST",
234        body,
250  );
251
252  async function fetchUploads() {
253    const response = await fetch("/api/list");
254    const data = await response.json();
255    return data.rows;
260    previewAllButton.hidden = true;
261    refreshButton.textContent = "Refreshing...";
262    const uploads = await fetchUploads();
263    renderUploads(uploads);
264    refreshButton.textContent = "Refresh";
310        previewContainer.innerHTML = "";
311        try {
312          fetch(`https://spag.cc/${upload.name}`).then(async (response) => {
313            if (!response.ok) {
314              const textElement = document.createElement("p");
394        deleteButton.disabled = true;
395        deleteButton.textContent = "Deleting...";
396        const response = await fetch(
397          `/api/delete`,
398          {

234  const [isDragging, setIsDragging] = useState(false);
235
236  const fetchBlobs = useCallback(async () => {
237    setLoading(true);
238    try {
239      const response = await fetch(`/api/blobs?prefix=${encodeKey(searchPrefix)}&limit=${limit}`);
240      const data = await response.json();
241      setBlobs(data);
242    } catch (error) {
243      console.error("Error fetching blobs:", error);
244    } finally {
245      setLoading(false);
248
249  useEffect(() => {
250    fetchBlobs();
251  }, [fetchBlobs]);
252
253  const handleSearch = (e) => {
264      setBlobContentLoading(true);
265      try {
266        const response = await fetch(`/api/blob?key=${encodeKey(clickedBlob.key)}`);
267        const content = await response.text();
268        setSelectedBlob({ ...clickedBlob, key: decodeKey(clickedBlob.key) });
269        setEditContent(content);
270      } catch (error) {
271        console.error("Error fetching blob content:", error);
272      } finally {
273        setBlobContentLoading(false);
278  const handleSave = async () => {
279    try {
280      await fetch(`/api/blob?key=${encodeKey(selectedBlob.key)}`, {
281        method: "PUT",
282        body: editContent,
290  const handleDelete = async (key) => {
291    try {
292      await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
293      setBlobs(blobs.filter(b => b.key !== key));
294      if (selectedBlob && selectedBlob.key === key) {
307        const key = `${searchPrefix}${file.name}`;
308        formData.append("key", encodeKey(key));
309        await fetch("/api/blob", { method: "POST", body: formData });
310        const newBlob = { key, size: file.size, lastModified: new Date().toISOString() };
311        setBlobs([newBlob, ...blobs]);
315      }
316    }
317    fetchBlobs();
318  };
319
329      try {
330        const fullKey = `${searchPrefix}${key}`;
331        await fetch(`/api/blob?key=${encodeKey(fullKey)}`, {
332          method: "PUT",
333          body: "",
344  const handleDownload = async (key) => {
345    try {
346      const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
347      const blob = await response.blob();
348      const url = window.URL.createObjectURL(blob);
363    if (newKey && newKey !== oldKey) {
364      try {
365        const response = await fetch(`/api/blob?key=${encodeKey(oldKey)}`);
366        const content = await response.blob();
367        await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
368          method: "PUT",
369          body: content,
370        });
371        await fetch(`/api/blob?key=${encodeKey(oldKey)}`, { method: "DELETE" });
372        setBlobs(blobs.map(b => b.key === oldKey ? { ...b, key: newKey } : b));
373        if (selectedBlob && selectedBlob.key === oldKey) {
383    const newKey = `__public/${key}`;
384    try {
385      const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
386      const content = await response.blob();
387      await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
388        method: "PUT",
389        body: content,
390      });
391      await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
392      setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));
393      if (selectedBlob && selectedBlob.key === key) {
402    const newKey = key.slice(9); // Remove "__public/" prefix
403    try {
404      const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
405      const content = await response.blob();
406      await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
407        method: "PUT",
408        body: content,
409      });
410      await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
411      setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));
412      if (selectedBlob && selectedBlob.key === key) {
838});
839
840export default lastlogin((request: Request) => app.fetch(request));

64
65  useEffect(() => {
66    fetchContent();
67    fetchHistory();
68  }, []);
69
70  async function fetchContent() {
71    const storedContent = await get(STORAGE_KEY);
72    setContent(storedContent || "<h1>Edit Me!</h1>");
73  }
74
75  async function fetchHistory() {
76    const storedHistory = await get(HISTORY_KEY) || [];
77    setHistory(storedHistory);
108      await set(STORAGE_KEY, sanitizedHtml);
109      await updateHistory(sanitizedHtml);
110      await fetchHistory();
111      setEditRequest("");
112    } catch (err) {

1# Framer Fetch: Basic
2
3A basic example of an API endpoint to use with Framer Fetch. 

1import { useState, useEffect } from "https://esm.sh/react@18.2.0?dev";
2import { fetchProjectFiles } from "../utils/api.ts";
3
4interface UseProjectFilesProps {
15
16/**
17 * Custom hook to fetch and manage project files
18 */
19export function useProjectFiles({
38      
39      try {
40        const filesData = await fetchProjectFiles({
41          bearerToken,
42          projectId,
51        }
52      } catch (err) {
53        console.error("Error fetching project files:", err);
54        setProjectFiles([]);
55        setError(err instanceof Error ? err : new Error(String(err)));

135  let type_: "file" | "http" | "script";
136  if (path.includes("backend/index.ts")) type_ = "http";
137  if (file_text?.includes("export default app.fetch")) type_ = "http";
138  if ([".ts", ".tsx", ".js", ".jsx"].some(ext => path.endsWith(ext))) {
139    type_ = "script";

71```
72
735. **fetchTranspiledJavaScript** - Fetch and transpile TypeScript to JavaScript:
74```ts
75const jsCode = await fetchTranspiledJavaScript("https://esm.town/v/username/project/path/to/file.ts");
76```
77
200    
201    // Inject data to avoid extra round-trips
202    const initialData = await fetchInitialData();
203    const dataScript = `<script>
204      window.__INITIAL_DATA__ = ${JSON.stringify(initialData)};
258
2595. **API Design:**
260   - `fetch` handler is the entry point for HTTP vals
261   - Run the Hono app with `export default app.fetch // This is the entry point for HTTP vals`
262   - Properly handle CORS if needed for external access

94  }
95
96  // If there are selected files, fetch their content and add them to the messages
97  if (selectedFiles && selectedFiles.length > 0) {
98    const vt = new ValTown({ bearerToken });
114          fileContents += `## File: ${filePath}\n\`\`\`\n${content}\n\`\`\`\n\n`;
115        } catch (error) {
116          console.error(`Error fetching file ${filePath}:`, error);
117          fileContents += `## File: ${filePath}\nError: Could not fetch file content\n\n`;
118        }
119      }