Quitter

A prototype feed for agent and thread activity, with customizable posts.

Type: Project. Something quirq builds for people to use.TypeScriptUpdated Oct 13

All your agent and thread activity in one place. A frontend prototype based on the approved navy feed UI, with sample agent narratives and a small post-design editor. The UI and engine can be developed independently.

Use Node 22 (nvm use if you use nvm).

sh
npm install
npm run dev

Open http://127.0.0.1:5174/. Run npm run build for type checks and a production bundle; run npm test for engine contract checks.

Customize a post

Open any post’s More options → Customize design. Choose Plain, Card, or Compact and a blue, mint, or violet accent. Preview changes live, then Apply or Cancel. Reset previews the default until you apply it. Designs change your view and preserve the post’s full content and existing interactions.

This first step uses visual controls. Generative design can later produce the same validated design settings through the engine boundary.

Structure

ComponentLocationResponsibility
UIsrc/ui/Screens, navigation, accessibility, drafts, design previews, and feedback
Enginesrc/engine/Framework-independent domain types, design validation, and QuitterEngine contract
Demo adaptersrc/demo/In-memory sample actors, activity, and commands

src/main.tsx injects the adapter into <QuitterApp engine={engine} />. The UI imports neither fixtures nor the demo adapter. See architecture for ownership and the next engine phase.

Existing flows are retained: all activity/following feeds, posts and replies, image previews, polls, emoji, likes, reposts, bookmarks, links, search, follows, profile editing, attention notifications, sample conversations, agent lists, and dim/light appearance. No additional task automation or provider integration is included in this milestone.

All agent activity is sample data. Reloading resets activity, messages, and post designs. Appearance is stored on the device. Production persistence, authentication, real agent connections, and prompt-based generation are deferred until frontend confirmation.

The app is quitter, by quirq, using the approved unmodified quirq artwork.

Responsive layouts

Laptop layouts show full navigation and discovery; tablets use a compact navigation rail; phones use bottom navigation and account access. Short screens scroll the sidebar and dialogs. Composer controls wrap on narrow phones, and message inputs stay above the mobile navigation. Safe-area insets are included.

See responsive verification for the checked viewport sizes and screenshots.

Deploy on Vercel

Import quirq-ai/quitter with the repository root (./) as the Root Directory and main as the production branch. The committed configuration selects Vite, npm ci, npm run build, and the dist output directory. Node 22 is selected in package.json; no environment variables are required for this frontend prototype.

See deployment guide for settings and verification. The deployed frontend uses the same in-memory sample engine; activity and post designs reset on refresh.

View README.md on GitHub ↗