ProjectsThreadline
Threadline
Version 1
Stack
- Next.js
- React
- TypeScript
- Tailwind
- Zod
- TanStack Form
What it is
Comments study for reply, vote, edit, and delete on a short phone thread.
Why it exists
Outside my day job, I chose a supplied discussion design to keep growing my frontend craft and build a deployed reference. Replies and changes needed clear context and consequences.
How it works
One sample user can reply, vote, edit and delete in the current browser. Replies have one level. A You badge and Edit / Delete controls identify that user's comments. Changes and votes stay local; nothing is published to other people.
Story
What should disappear when a comment is deleted?
Threadline gave me a discussion interface to turn into deployed work. I chose the design and shipped it; AI coding agents wrote the code, in Next.js with TypeScript. The useful reference was in the actions: reply in context, change a vote, edit a comment and make deletion understandable.
A comments demo needs replies, votes, editing and deletion. The deletion raised a second question: what happens to the replies under the comment?
Threadline uses one sample person in one browser. Editing and deletion belong only to that person's rows. Replies stop at one level, keeping the discussion within the phone's column. That made a root comment and its replies a small, explicit group.
Deleting the root removes those direct replies too, so the confirmation dialog says so before the action happens. Reply context also stays visible in the composer and on the posted reply, so the destination does not depend on someone remembering the earlier click.
Where it stands: the people are fictional and every change stays in this browser; nothing is posted to anyone else.
The useful result is a discussion whose changes have visible consequences. Before a comment and its replies disappear, the person deleting them is told what will go.
Design: Frontend Mentor's Interactive comments section (opens in a new tab). Build: Royer Adames, with AI agents.