Error: Username is required

`);\n }\n try {\n let graph = await generateGraph(username);\n return c.html(`

${graph}

`);\n } catch (error) {\n console.error(`Error generating graph for ${username}:`, error);\n return c.html(`

Error: ${error.message}

`);\n }\n});\n\n\n// hono bug doesn't handle optional params? so have to do this\napp.get(\"/graph/\", async (c) => {\n const username = c.req.param(\"username\") || c.req.query(\"username\");\n if (!username) {\n return c.html(`

Error: Username is required

`);\n }\n try {\n let graph = await generateGraph(username);\n return c.html(`

${graph}

`);\n } catch (error) {\n console.error(`Error generating graph for ${username}:`, error);\n return c.html(`

Error: ${error.message}

`);\n }\n});\n\n\n\n\napp.get(\"/:username\", (c) => {\n if (c.req.url.pathname === '/favicon.ico') {\n return c.json(null, 404);\n }\n const username = c.req.param(\"username\") || c.req.query(\"username\");\n console.log(`Rendering page for username: ${username}`);\n return renderPage(c, username);\n});\n\napp.get(\"/\", (c) => {\n console.log(\"Rendering home page\");\n const username = c.req.query(\"username\");\n if (username === 'favicon.ico') {\n return c.json(null, 404);\n }\n if (username) {\n console.log(`Username provided in query: ${username}`);\n return renderPage(c, username);\n }\n return renderPage(c);\n});\n\n\nasync function generateGraph(username, useVersions = true) {\n if (!username) {\n return html`

Please enter a username

`;\n }\n\n console.log(`Fetching contributions for ${username}`);\n try {\n let vals;\n if (useVersions) {\n vals = await getValsWithVersions(username, 200);\n } else {\n vals = await getVals(username);\n }\n\n // if use all versions, we get all the versions of each val\n if (useVersions) {\n vals = vals.map(val => val.versions ? val.versions : val).flat();\n }\n\n console.log(`Fetched ${vals.length} contributions`);\n const contributionData = processVals(vals, useVersions);\n console.log(`Processed ${contributionData.length} contributions`);\n return html`\n

Contribution Graph for ${username}

\n \n \n \n \n ${generateMonthLabels(contributionData)}\n \n \n \n ${generateContributionRows(contributionData)}\n \n

\n `;\n } catch (error) {\n console.error(`Error processing data for ${username}:`, error);\n throw new Error(`Failed to process data: ${error.message}`);\n }\n}\n\nfunction renderPage(c, initialUsername = null) {\n return c.html(html`\n \n \n \n \n \n \n \n Val Wall\n \n \n \n

Valtown Contribution Graph

\n \n \n \n

\n ${initialUsername ? html`

Loading graph...

` : ''}\n

\n Source: https://www.val.town/v/yawnxyz/valWall\n

\n \n \n `);\n}\nfunction generateMonthLabels(contributionData) {\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n const today = dayjs();\n const oneYearAgo = today.subtract(1, 'year').add(1, 'day');\n const totalDays = today.diff(oneYearAgo, 'day') + 1;\n const totalWeeks = Math.ceil(totalDays / 7);\n\n let currentDate = oneYearAgo;\n let monthLabels = [];\n let currentMonth = null;\n let columnCount = 0;\n\n for (let week = 0; week < totalWeeks; week++) {\n const monthOfWeek = currentDate.month();\n \n if (monthOfWeek !== currentMonth) {\n if (currentMonth !== null) {\n monthLabels.push({ name: months[currentMonth], columns: columnCount });\n }\n currentMonth = monthOfWeek;\n columnCount = 1;\n } else {\n columnCount++;\n }\n\n currentDate = currentDate.add(1, 'week');\n }\n\n // Add the last month\n monthLabels.push({ name: months[currentMonth], columns: columnCount });\n\n return html`${monthLabels.map(month => html`${month.name}`)}`;\n}\n\nfunction generateContributionRows(contributionData) {\n const dayLabels = ['', 'Mon', '', 'Wed', '', 'Fri', ''];\n let rows = [];\n\n for (let i = 0; i < 7; i++) {\n rows.push(html`\n \n ${dayLabels[i]}\n ${generateContributionCells(contributionData, i)}\n \n `);\n }\n\n return rows;\n}\nfunction generateContributionCells(contributionData, dayOfWeek) {\n let cells = [];\n for (let i = dayOfWeek; i < contributionData.length; i += 7) {\n const day = contributionData[i];\n cells.push(html`\n \n

\n ${day.date}: ${day.count} contribution${day.count !== 1 ? 's' : ''}\n

\n \n `);\n }\n return cells;\n}\nfunction processVals(vals, useVersions) {\n const today = new Date();\n const oneYearAgo = new Date(today.getFullYear() - 1, today.getMonth(), today.getDate());\n const contributionMap = new Map();\n\n // Initialize the map with all dates in the last year\n for (let d = new Date(oneYearAgo); d <= today; d.setDate(d.getDate() + 1)) {\n contributionMap.set(d.toISOString().split('T')[0], 0);\n }\n\n // Count contributions\n vals.forEach(val => {\n const date = new Date(val.createdAt).toISOString().split('T')[0];\n if (contributionMap.has(date)) {\n contributionMap.set(date, contributionMap.get(date) + 1);\n }\n });\n\n // Convert to array and add level\n return Array.from(contributionMap, ([date, count]) => ({\n date,\n count,\n level: count === 0 ? 0 : \n useVersions ? \n count < 10 ? 1 : \n count < 25 ? 2 : \n count < 50 ? 3 : 4 \n : \n count < 5 ? 1 : \n count < 10 ? 2 : \n count < 15 ? 3 : 4\n }));\n}\n\nexport default (typeof Deno !== \"undefined\" && Deno.env.get(\"valtown\")) ? app.fetch : app;\n","deleted","label",[98],"permalink","https://www.val.town/x/yawnxyz/valWall/code/main.tsx","extension","actionData","errors"]