Claude's design docs and implementation plans for thalida.com.
101 items
Chat / Client Identity
Mar 2026Client identity (clientId) is currently generated on the frontend and trusted blindly by the API. A malicious user can send any clientId to impersonate another user.
Code Quality / Api Code Audit
Mar 2026The API is a Cloudflare Workers application with Durable Objects for real-time chat, serving ~1,400 lines of TypeScript across 6 source files. It handles WebSocket chat, authentication, geolocation, and weather endpoints.
Code Quality / App Code Audit
Mar 2026Fix the top 5 priority findings from the app code and security audit (docs/plans/2026-03-05-app-code-audit.md).
Code Quality / App Code Audit
Mar 2026The app is well-architected for its purpose — an Astro 5 SSG personal site with a real-time chat feature and an interactive live-window web component. The codebase demonstrates strong engineering in several areas:
Content / Version Post
Mar 2026A version post for thalida.com v2026, written from Claude's perspective as a collaborator who helped build the site. Fun, friendly, witty — a highlight reel of the major features.
Live Window / Weather Api Proxy
Mar 2026Move the OpenWeather API call from the client-side app to the Cloudflare Worker backend, removing the exposed API key.
Live Window / Weather Api Proxy
Mar 2026The OpenWeather API key is exposed client-side via `PUBLIC_OPENWEATHER_KEY`. Move the call behind the Cloudflare Worker, matching the pattern used for IP Registry geolocation.
Chat / Idle Websocket Disconnect
Mar 2026The ChatRoom Durable Object accumulates wall-clock duration as long as any WebSocket is connected. Idle browser tabs keep connections open indefinitely, which exceeded the Cloudflare free tier limit (2,147,483,647 ms/day).
Chat / Idle Websocket Disconnect
Mar 2026Disconnect idle chat WebSockets after 5 minutes to reduce Cloudflare Durable Object duration usage on the free tier.
Layout / Info Panel
Mar 2026Replace `WeatherTextComponent` with a combined `InfoPanelComponent` that displays location, coordinates/timezone, and weather info inside the live-window shadow DOM. Use static white text instead of the current dynamic WCAG-contrast color.
Layout / Info Panel
Mar 2026Replace `WeatherTextComponent` with a combined `InfoPanelComponent` that displays location name, coordinates/timezone, and weather info inside the live-window shadow DOM with static white text.
Live Window / Live Window Test Page
Mar 2026Add optional `latitude`/`longitude`/`timezone` attributes to `<live-window>` so it can render any location, then create a test page displaying 8 world cities side-by-side.
Live Window / Live Window Test Page
Mar 2026Add optional `latitude`/`longitude`/`timezone` attributes to `<live-window>` so it can render any location without IP geolocation. Create a test page displaying 8 world cities side-by-side with real weather data and local clocks.
Live Window / Sun Moon Layers
Mar 2026Add sun and moon celestial bodies to the live window sky using the celestial circle model.
Live Window / Sun Moon Layers
Mar 2026Add sun and moon celestial bodies to the live window sky, using simple geometric CSS shapes that move realistically across the sky based on time of day and lunar phase.
Live Window / Stars Layer
Mar 2026Add a stars layer to the live window that displays varied, realistic stars at night, fading in/out with the sky phase system.
Live Window / Stars Layer
Mar 2026Add a stars layer to the live window that displays varied, realistic stars at night. Stars gradually appear during dusk and fade during dawn, synced to the existing 16-phase sky system. Star positions are seeded-random (consistent within a day, fresh each day).
Live Window / Live Window Refactor
Mar 2026Refactor `<live-window>` into self-contained SceneComponent classes (sky, blinds, clock, weather text) with a unified LiveWindowState and utils/ folder.
Live Window / Live Window Refactor
Mar 2026Refactor the `<live-window>` web component into a class-based architecture where each scene part (sky, blinds, clock, weather text) is a self-contained class implementing a shared `SceneComponent` interface. Move utilities (color, phase calculations, sky gradient math) into a `utils/` folder. Merge state into a single `LiveWindowState` with clearly separated sections.
Live Window / Live Window Refactor
Mar 2026Refactor the monolithic `<live-window>` web component into focused modules with a `SkyLayer` interface for extensibility.
Live Window / Live Window Refactor
Mar 2026Refactor the `<live-window>` web component from a monolithic 700-line class into focused modules with a `SkyLayer` interface, making it easy to add time-aware celestial features (stars, moon, sun) in the future.
Live Window / Sky Gradient
Mar 2026Replace the live window's 8-color flat gradient with a 16-phase, 4-stop vertical gradient that matches real-world sky appearance based on sunrise, sunset, and twilight phases.
Live Window / Sky Gradient
Mar 2026Replace the live window's 8-color flat gradient system with a 16-phase, 4-stop vertical gradient that matches real-world sky appearance based on sunrise, sunset, and twilight phases.
Content / Meta Seo
Mar 2026Replace the outdated OG/social card image with a neon-glow `<3` mark on midnight background, matching the site's current design.
Content / Meta Seo
Mar 2026The current OG/social card image (`card-512x512.png`) features a lime-to-teal gradient background with purple text and a Memoji avatar. This no longer matches the site's design, which uses a dark midnight theme with neon/teal accents and monospace typography.
Content / Meta Seo
Mar 2026Add comprehensive meta tags, OpenGraph, Twitter Cards, structured data, favicons, sitemap, and robots.txt so thalida.com shows up well in search and looks great when shared.
Content / Meta Seo
Mar 2026Add comprehensive meta tags, OpenGraph, Twitter Cards, structured data, and SEO infrastructure so thalida.com shows up well in search results and looks great when links are shared on social media.
Code Quality / Css Audit
Mar 2026Remove all HTML IDs, inline styles, and hardcoded JS styles — replacing them with data attributes (JS targeting), CSS classes (styling), and Tailwind utilities.
Code Quality / Css Audit
Mar 2026Establish clear separation of concerns across HTML, CSS, and JS:
Chat / Client Identity
Mar 2026Replace IP-based identity with clientId throughout the chat system so flag, block, delete-by-user, and rename operate per-browser, and users on the same network are independent.