Spotify Playlist Search

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_216":217,"_218":219},"routes/_app.x.$handle.$name",{"_103":102,"_37":49,"_111":93,"_32":112,"_13":14,"_113":-5,"_11":114,"_115":116,"_117":118,"_119":120,"_121":122,"_26":-5,"_123":-5,"_124":-5,"_125":30,"_126":127,"_128":62,"_129":-5,"_130":-5,"_131":132},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_47":48,"_37":49,"_42":50,"_51":-5,"_52":30,"_53":54,"_55":54,"_56":57,"_58":-5,"_19":59,"_60":36,"_61":62,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":70,"_71":72,"_73":74,"_75":-5,"_76":77,"_78":77,"_79":80,"_81":80,"_82":80,"_83":77,"_84":77,"_85":86,"_87":88,"_89":90,"_91":30},"version",5,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","a53d6a7d-c408-458f-a9a0-e74a7fcd45d2","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":33,"_38":39,"_40":41,"_42":43,"_44":14,"_45":46,"_29":30},"previous","deleted",false,"deletedHere","path","main.ts","latestPath","fileId","6a42df98-8170-11f1-8580-1607ee4eb77e","name","fileType","http","content","import { Hono } from \"npm:hono\";\nimport { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { blob } from \"https://esm.town/v/std/blob/main.ts\";\n\nimport {\n getAuthorizeURL,\n exchangeCode,\n isAuthenticated,\n} from \"./spotify.ts\";\nimport { initDB, searchTracks, getTrackCount } from \"./db.ts\";\nimport { syncAll } from \"./sync.ts\";\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err));\n\nlet dbReady = false;\nasync function ensureDB() {\n if (!dbReady) {\n await initDB();\n dbReady = true;\n }\n}\n\napp.get(\"/\", async (c) => {\n return await serveFile(\"index.html\");\n});\n\napp.get(\"/auth/login\", (c) => {\n const url = new URL(c.req.url);\n const redirectUri = `${url.origin}/auth/callback`;\n const state = crypto.randomUUID();\n blob.setJSON(\"oauth_state\", { state, redirectUri });\n return c.redirect(getAuthorizeURL(redirectUri, state));\n});\n\napp.get(\"/auth/callback\", async (c) => {\n const code = c.req.query(\"code\");\n const state = c.req.query(\"state\");\n const error = c.req.query(\"error\");\n\n if (error) {\n return c.html(\n `

Authorization failed

Spotify error: ${error}

Try again`,\n );\n }\n if (!code || !state) {\n return c.html('

Missing authorization code

Try again');\n }\n\n const stored = await blob.getJSON<{ state: string; redirectUri: string }>(\n \"oauth_state\",\n );\n if (!stored || stored.state !== state) {\n return c.html(\n '

Invalid state parameter

OAuth state mismatch. Please try again.

Try again',\n );\n }\n\n try {\n await exchangeCode(code, stored.redirectUri);\n await blob.delete(\"oauth_state\");\n return c.redirect(\"/\");\n } catch (e) {\n return c.html(\n `

Token exchange failed

${e.message}

Try again`,\n );\n }\n});\n\napp.get(\"/api/status\", async (c) => {\n await ensureDB();\n const authed = await isAuthenticated();\n const trackCount = authed ? await getTrackCount() : 0;\n return c.json({ authenticated: authed, trackCount });\n});\n\napp.get(\"/api/search\", async (c) => {\n await ensureDB();\n const q = c.req.query(\"q\");\n if (!q?.trim()) return c.json({ results: [] });\n try {\n const results = await searchTracks(q.trim());\n return c.json({ results });\n } catch (e) {\n return c.json({ results: [], error: e.message }, 500);\n }\n});\n\napp.post(\"/api/sync\", async (c) => {\n await ensureDB();\n try {\n const result = await syncAll();\n return c.json(result);\n } catch (e) {\n return c.json({ error: e.message }, 500);\n }\n});\n\nexport default app.fetch;\n","createdAt",["D",1784245524420],"branchVersion","branchId","8f73afca-9b8b-4154-8dea-7e96834ce4f8","id","62af4618-56c9-46d3-91f0-9f34eee0a526","spotify-playlist-search",["D",1784245417983],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Full-text search across all your Spotify playlists","imageUrl","666a7e32-624c-44a1-9017-c098238b910d","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","3bbc0830-e929-4c19-b058-a1674c911b22","tursoName","62af461856c946d391f09f34eee0a526","tursoHostname","62af461856c946d391f09f34eee0a526-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789489305251],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_103":102,"_110":106},"org",{"_103":102,"_104":-5,"_105":106,"_19":59,"_107":108,"_109":30},"branch",{"_13":92,"_37":93,"_47":46,"_94":48,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":49,"_101":102},"isOwned",22,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","tod","handle","displayName","avatar","https://secure.gravatar.com/avatar/8effe5d6ffbba460f8a5617306c9ba5b&d=identicon","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_47":48,"_37":49,"_42":211,"_51":-5,"_52":30,"_53":54,"_55":54,"_56":57,"_58":-5,"_19":59,"_60":36,"_61":62,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":70,"_71":72,"_73":212,"_75":-5,"_76":77,"_78":77,"_79":80,"_81":80,"_82":80,"_83":77,"_84":77,"_85":213,"_87":214,"_89":215,"_91":30},"tree",[183,185,186,187,188],"files",[183,184,185,186,187,188],"counts",{"_173":66,"_174":152,"_175":66,"_176":177,"_178":179},"contents",[133,134,135,136,137],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_47":167,"_37":102,"_35":168,"_141":-5,"_45":46,"_44":169,"_143":30,"_42":170,"_13":66,"_38":171,"_40":-5,"_29":30,"_147":-5,"_32":172},{"_47":160,"_37":161,"_35":162,"_141":-5,"_45":46,"_44":163,"_143":62,"_42":164,"_13":66,"_38":145,"_40":165,"_29":30,"_147":-5,"_32":166},{"_47":156,"_37":33,"_35":36,"_141":-5,"_45":46,"_44":14,"_143":62,"_42":157,"_13":66,"_38":39,"_40":41,"_29":30,"_147":158,"_32":159},{"_47":149,"_37":150,"_35":151,"_141":-5,"_45":46,"_44":152,"_143":30,"_42":153,"_13":66,"_38":145,"_40":154,"_29":30,"_147":-5,"_32":155},{"_47":138,"_37":139,"_35":140,"_141":-5,"_45":46,"_44":142,"_143":30,"_42":144,"_13":66,"_38":145,"_40":146,"_29":30,"_147":-5,"_32":148},"f0271347-df28-4d12-ae0e-a017194cb0d6","sync.ts","3ff57e62-8170-11f1-88a5-1607ee4eb77e","parentId",3,"latest",["D",1784245453448],"script","import { fetchAllPlaylists, fetchPlaylistTracks } from \"./spotify.ts\";\nimport { initDB, reindexTracks } from \"./db.ts\";\n\nexport interface SyncProgress {\n playlistsTotal: number;\n playlistsDone: number;\n tracksTotal: number;\n tracksDone: number;\n currentPlaylist: string;\n done: boolean;\n error?: string;\n}\n\n/**\n * Sync all playlists and tracks from Spotify into the FTS index.\n * Returns a summary of what was synced.\n */\nexport async function syncAll(): Promise<{\n playlists: number;\n tracks: number;\n}> {\n await initDB();\n\n // 1. Fetch all playlists\n const playlists = await fetchAllPlaylists();\n\n // 2. Fetch tracks for each playlist, collecting into one array\n const allTracks = [];\n for (const playlist of playlists) {\n const tracks = await fetchPlaylistTracks(playlist);\n allTracks.push(...tracks);\n }\n\n // 3. Re-index everything\n await reindexTracks(allTracks);\n\n return { playlists: playlists.length, tracks: allTracks.length };\n}\n","label",[139],"dc71db32-3c05-4809-9321-8d9487c1cf1c","spotify.ts","3443b7d2-8170-11f1-b0aa-1607ee4eb77e",1,["D",1784245433829],"import { blob } from \"https://esm.town/v/std/blob/main.ts\";\n\nconst SPOTIFY_AUTH = \"https://accounts.spotify.com/authorize\";\nconst SPOTIFY_TOKEN = \"https://accounts.spotify.com/api/token\";\nconst SPOTIFY_API = \"https://api.spotify.com/v1\";\n\nconst SCOPES = \"playlist-read-private playlist-read-collaborative\";\nconst TOKEN_KEY = \"spotify_tokens\";\n\ninterface TokenData {\n access_token: string;\n refresh_token: string;\n expires_at: number; // unix ms\n}\n\n/** Build the Spotify OAuth authorize URL */\nexport function getAuthorizeURL(redirectUri: string, state: string): string {\n const params = new URLSearchParams({\n client_id: Deno.env.get(\"SPOTIFY_CLIENT_ID\")!,\n response_type: \"code\",\n redirect_uri: redirectUri,\n scope: SCOPES,\n state,\n });\n return `${SPOTIFY_AUTH}?${params}`;\n}\n\n/** Exchange authorization code for access + refresh tokens */\nexport async function exchangeCode(code: string, redirectUri: string): Promise {\n const res = await fetch(SPOTIFY_TOKEN, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n body: new URLSearchParams({\n grant_type: \"authorization_code\",\n code,\n redirect_uri: redirectUri,\n client_id: Deno.env.get(\"SPOTIFY_CLIENT_ID\")!,\n client_secret: Deno.env.get(\"SPOTIFY_CLIENT_SECRET\")!,\n }),\n });\n if (!res.ok) {\n const body = await res.text();\n throw new Error(`Spotify token exchange failed: ${res.status} ${body}`);\n }\n const data = await res.json();\n const tokens: TokenData = {\n access_token: data.access_token,\n refresh_token: data.refresh_token,\n expires_at: Date.now() + data.expires_in * 1000,\n };\n await blob.setJSON(TOKEN_KEY, tokens);\n return tokens;\n}\n\n/** Refresh an expired access token using the refresh token */\nasync function refreshToken(refreshToken: string): Promise {\n const res = await fetch(SPOTIFY_TOKEN, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n body: new URLSearchParams({\n grant_type: \"refresh_token\",\n refresh_token: refreshToken,\n client_id: Deno.env.get(\"SPOTIFY_CLIENT_ID\")!,\n client_secret: Deno.env.get(\"SPOTIFY_CLIENT_SECRET\")!,\n }),\n });\n if (!res.ok) {\n const body = await res.text();\n throw new Error(`Spotify token refresh failed: ${res.status} ${body}`);\n }\n const data = await res.json();\n const tokens: TokenData = {\n access_token: data.access_token,\n refresh_token: data.refresh_token ?? refreshToken, // Spotify may issue a new one\n expires_at: Date.now() + data.expires_in * 1000,\n };\n await blob.setJSON(TOKEN_KEY, tokens);\n return tokens;\n}\n\n/** Get a valid access token, refreshing if necessary */\nexport async function getAccessToken(): Promise {\n const tokens = await blob.getJSON(TOKEN_KEY);\n if (!tokens) throw new Error(\"Not authenticated with Spotify\");\n // Refresh if token expires in the next 5 minutes\n if (Date.now() > tokens.expires_at - 5 * 60 * 1000) {\n const refreshed = await refreshToken(tokens.refresh_token);\n return refreshed.access_token;\n }\n return tokens.access_token;\n}\n\n/** Check if user has stored Spotify tokens */\nexport async function isAuthenticated(): Promise {\n const tokens = await blob.getJSON(TOKEN_KEY);\n return !!tokens;\n}\n\nexport interface Playlist {\n id: string;\n name: string;\n description: string;\n uri: string;\n image: string | null;\n tracksHref: string;\n trackCount: number;\n}\n\nexport interface Track {\n name: string;\n artist: string;\n album: string;\n uri: string;\n playlistName: string;\n playlistUri: string;\n playlistImage: string | null;\n addedAt: string;\n}\n\n/** Fetch all playlists for the authenticated user (paginated) */\nexport async function fetchAllPlaylists(): Promise {\n const accessToken = await getAccessToken();\n const playlists: Playlist[] = [];\n let url: string | null =\n `${SPOTIFY_API}/me/playlists?limit=50&offset=0`;\n\n while (url) {\n const res = await fetch(url, {\n headers: { Authorization: `Bearer ${accessToken}` },\n });\n if (!res.ok) {\n const body = await res.text();\n throw new Error(`Spotify playlists fetch failed: ${res.status} ${body}`);\n }\n const data = await res.json();\n for (const p of data.items) {\n playlists.push({\n id: p.id,\n name: p.name,\n description: p.description ?? \"\",\n uri: p.uri,\n image: p.images?.[0]?.url ?? null,\n tracksHref: p.tracks.href,\n trackCount: p.tracks.total,\n });\n }\n url = data.next;\n }\n return playlists;\n}\n\n/** Fetch all tracks for a single playlist (paginated) */\nexport async function fetchPlaylistTracks(\n playlist: Playlist,\n onProgress?: (fetched: number, total: number) => void,\n): Promise {\n const accessToken = await getAccessToken();\n const tracks: Track[] = [];\n let url: string | null =\n `${SPOTIFY_API}/playlists/${playlist.id}/tracks?limit=100&offset=0&fields=items(added_at,track(name,uri,artists(name),album(name))),next,total`;\n\n while (url) {\n const res = await fetch(url, {\n headers: { Authorization: `Bearer ${accessToken}` },\n });\n if (!res.ok) {\n const body = await res.text();\n throw new Error(`Spotify tracks fetch failed: ${res.status} ${body}`);\n }\n const data = await res.json();\n for (const item of data.items) {\n // Skip null tracks (e.g., local files that Spotify can't resolve)\n if (!item?.track?.name) continue;\n tracks.push({\n name: item.track.name,\n artist: item.track.artists.map((a: { name: string }) => a.name).join(\", \"),\n album: item.track.album?.name ?? \"\",\n uri: item.track.uri,\n playlistName: playlist.name,\n playlistUri: playlist.uri,\n playlistImage: playlist.image,\n addedAt: item.added_at ?? \"\",\n });\n }\n onProgress?.(tracks.length, data.total ?? playlist.trackCount);\n url = data.next;\n }\n return tracks;\n}\n",[150],"4379b76c-496c-4adf-a393-098360b74704",["D",1784245524420],"spotify-search",[33],"45aa685c-b05d-4f90-b386-28b752569aaf","db.ts","3c917014-8170-11f1-8990-1607ee4eb77e",2,["D",1784245447761],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport type { Track } from \"./spotify.ts\";\n\n/** Create the FTS5 table if it doesn't exist */\nexport async function initDB() {\n await sqlite.execute(`\n CREATE VIRTUAL TABLE IF NOT EXISTS tracks_fts USING fts5(\n track_name,\n artist_name,\n album_name,\n playlist_name,\n track_uri UNINDEXED,\n playlist_uri UNINDEXED,\n playlist_image UNINDEXED,\n added_at UNINDEXED\n )\n `);\n}\n\n/** Wipe and re-index all tracks */\nexport async function reindexTracks(tracks: Track[]) {\n await sqlite.execute(`DELETE FROM tracks_fts`);\n\n // Insert in batches of 100 for efficiency\n const BATCH_SIZE = 100;\n for (let i = 0; i < tracks.length; i += BATCH_SIZE) {\n const batch = tracks.slice(i, i + BATCH_SIZE);\n const statements = batch.map((t) => ({\n sql: `INSERT INTO tracks_fts\n (track_name, artist_name, album_name, playlist_name, track_uri, playlist_uri, playlist_image, added_at)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n args: [\n t.name,\n t.artist,\n t.album,\n t.playlistName,\n t.uri,\n t.playlistUri,\n t.playlistImage,\n t.addedAt,\n ],\n }));\n await sqlite.batch(statements);\n }\n}\n\nexport interface SearchResult {\n track_name: string;\n artist_name: string;\n album_name: string;\n playlist_name: string;\n track_uri: string;\n playlist_uri: string;\n playlist_image: string | null;\n added_at: string;\n rank: number;\n}\n\n/** Full-text search across all indexed tracks */\nexport async function searchTracks(query: string, limit = 50): Promise {\n // Escape double quotes in the query to prevent FTS5 syntax errors\n const escaped = query.replace(/\"/g, '\"\"');\n const ftsQuery = `\"${escaped}\" *`; // prefix match on last term\n\n const result = await sqlite.execute({\n sql: `SELECT track_name, artist_name, album_name, playlist_name,\n track_uri, playlist_uri, playlist_image, added_at,\n bm25(tracks_fts) as rank\n FROM tracks_fts\n WHERE tracks_fts MATCH ?\n ORDER BY rank\n LIMIT ?`,\n args: [ftsQuery, limit],\n });\n\n return result.rows as unknown as SearchResult[];\n}\n\n/** Count total indexed tracks */\nexport async function getTrackCount(): Promise {\n const result = await sqlite.execute(`SELECT count(*) as count FROM tracks_fts`);\n const row = result.rows[0] as { count: number };\n return row.count;\n}\n",[161],"cb4dcc8f-8a03-4968-b1e7-102c8fa13702","af012c74-26d3-4e73-a64e-fa1c39531cba",4,["D",1784245499082],"directory",[102],"pulls","branches","forks","envVars",{"_180":163,"_182":66},"connections",{"_180":66,"_181":66},"count","unfilledCount","emptyCount",{"_47":167,"_37":102,"_35":168,"_141":-5,"_45":46,"_44":169,"_143":30,"_42":208,"_13":66,"_38":171,"_40":-5,"_29":30,"_147":-5,"_190":209,"_32":210},{"_47":202,"_37":49,"_35":203,"_141":168,"_45":46,"_44":169,"_143":30,"_42":204,"_13":66,"_38":26,"_40":205,"_29":30,"_147":-5,"_190":206,"_32":207},{"_47":160,"_37":161,"_35":162,"_141":-5,"_45":46,"_44":163,"_143":62,"_42":199,"_13":66,"_38":145,"_40":165,"_29":30,"_147":-5,"_190":200,"_32":201},{"_47":156,"_37":33,"_35":36,"_141":-5,"_45":46,"_44":14,"_143":62,"_42":196,"_13":66,"_38":39,"_40":41,"_29":30,"_147":158,"_190":197,"_32":198},{"_47":149,"_37":150,"_35":151,"_141":-5,"_45":46,"_44":152,"_143":30,"_42":193,"_13":66,"_38":145,"_40":154,"_29":30,"_147":-5,"_190":194,"_32":195},{"_47":138,"_37":139,"_35":140,"_141":-5,"_45":46,"_44":142,"_143":30,"_42":189,"_13":66,"_38":145,"_40":146,"_29":30,"_147":-5,"_190":191,"_32":192},["D",1784245453448],"children",[],[139],["D",1784245433829],[],[150],["D",1784245524420],[],[33],["D",1784245447761],[],[161],"cfcb4eec-2982-4654-98fd-ac6af77e1467","5b28a984-8170-11f1-96c7-1607ee4eb77e",["D",1784245499082],"\n\n\n \n \n Spotify Playlist Search\n \n\n\n

\n \n\n\n",[],[102,49],["D",1784245499082],[184],[102],["D",1784245417983],["D",1789489305251],{"_103":102,"_110":106},{"_103":102,"_104":-5,"_105":106,"_19":59,"_107":108,"_109":30},{"_13":92,"_37":93,"_47":46,"_94":48,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":49,"_101":102},"ctx",{"_85":-5,"_130":249,"_250":251,"_252":253,"_254":30,"_255":30,"_256":30,"_257":62,"_258":-5,"_259":-7,"_260":-7,"_261":66,"_262":30,"_263":30,"_264":-5,"_265":30,"_266":30,"_267":30,"_268":-5},"ENV",{"_220":221,"_222":223,"_224":93,"_225":226,"_227":228,"_229":230,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242,"_243":244,"_245":246,"_247":248},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v5