Circle

A Linear-inspired project management interface built with Next.js and shadcn/ui — issues, cycles, projects, teams, and a mocked AI agent chat, running entirely on client-side mock data as a self-hostable front-end template.

4.5Kstars
MIT License

Repository Health

Pre-computed score based on development activity, maintenance, community, maturity, and trend momentum.How we score it →
70/100Good
Development Activity92
Maintenance52
Community56
Maturity40
Momentum40

Technical Analysis

AI-assessed by reading the actual repository — architecture, code quality, innovation, and documentation.How we score it →
64/100Good
Architecture78
Code Quality55
Innovation48
Learning Curve75

Circle is a pixel-close recreation of Linear’s project management interface, built as a pure Next.js 15 (App Router) front-end template with shadcn/ui and Tailwind CSS v4. It reproduces the full feel of a modern issue tracker — issues, sub-issues, cycles with burn-up charts, projects, initiatives, teams, inbox/triage/review flows, and a command palette — without shipping any backend, database, or authentication.

All data lives in static TypeScript fixtures under mock-data/, and every mutation (creating an issue, changing a status, reordering the board) happens in-memory through Zustand stores. Filters and sorting are synced to the URL with nuqs so views stay shareable. The project ships its own AI_GUIDE.md, written explicitly for AI coding assistants, documenting how to swap the mock stores for real API calls without touching the component tree.

It’s aimed at teams and individual developers who want a Linear-quality UI as a starting point for an internal tool, a learning reference for combining Next.js, shadcn/ui, Zustand, and nuqs, or a source of individual components (the command palette, drag-and-drop board, or vendored data-table-filter) to lift into another app.

Circle is MIT licensed and maintained by ln-dev7 (lndev-ui). A separate, more complete paid version built on BaseUI is sold independently through Square UI Pro, but it is a different product rather than a licensed upgrade of this repository.

What You Get

  • A full Linear-style issue tracker: issues, sub-issues, priorities, labels, statuses, and LexoRank-based manual drag-and-drop ordering
  • Cycles with active/upcoming views and a Recharts-powered burn-up chart
  • Projects and initiatives, each with overview, activity, and issues tabs
  • Inbox, triage, and review workflows for processing incoming issues before they’re assigned to a cycle
  • Team and member management across a fake multi-tenant [orgId] route structure
  • A cmdk-powered command palette for keyboard-driven navigation and issue creation
  • A mocked AI agent chat panel that streams canned replies word-by-word
  • A complete, pre-themed shadcn/ui component set (Radix primitives) with dark-by-default theming

Common Use Cases

  • Cloning it as the front-end shell for an internal Linear-style tracker, then wiring the Zustand stores to a real API and database
  • Using it as a learning project for combining Next.js App Router, shadcn/ui, Zustand, and nuqs URL-synced filters
  • Extracting individual pieces — the vendored data-table-filter, the command palette, or the drag-and-drop board — into another Next.js app
  • Prototyping the look and feel of a project-management product before committing to a real backend
  • Studying the CSS-variable theming system in app/globals.css to build another app in the same visual style

Under The Hood

Architecture Circle is a Next.js 15 App Router application with a fake multi-tenant [orgId] segment; app/page.tsx simply redirects into a fixed org/team. components/common/ holds the real feature UI (issues, projects, teams, cycles, inbox, agent, reviews), components/layout/ holds the sidebar shell and command palette, and components/ui/ is a vendored shadcn/ui set. All state lives client-side in Zustand stores under store/ (issues-store.ts, filter-store.ts, and similar), seeded from static TypeScript fixtures in mock-data/. There is no server, API route, or database layer — every store mutation runs purely in memory and resets on reload — while nuqs syncs filter and sort state to the URL for shareable views. Components read from the store hooks rather than the mock modules directly, which is a deliberate seam: the project’s own AI_GUIDE.md documents swapping that layer for real API calls without touching the component tree.

Tech Stack The stack is Next.js 15 (App Router, Turbopack in dev) on React 19 and strict TypeScript, styled with Tailwind CSS v4 and CSS-variable theme tokens. UI primitives come from shadcn/ui over Radix (dialog, dropdown, popover, tabs, and more), state from Zustand 5 with nuqs 2 for URL-synced filters, drag-and-drop from react-dnd’s HTML5 backend, and charts from Recharts for the cycle burn-up view. Issue ordering uses LexoRank (@kayron013/lexorank), forms use react-hook-form with zod validation, and the command palette is built on cmdk. There is no database, ORM, or auth library anywhere in the dependency tree — every dependency is front-end only.

Code Quality There are no test files or test runner configured anywhere in the repository, and no CI workflow beyond a GitHub FUNDING.yml — the project instead relies on strict TypeScript, an ESLint flat config extending next/core-web-vitals and next/typescript, Prettier with a 3-space/100-column house style, and Husky plus lint-staged running on every commit. Store and component code is consistently typed against shared interfaces from mock-data/, file and component naming is consistent throughout, and the vendored components/data-table-filter directory is explicitly carved out with relaxed lint rules since it’s kept close to its upstream source. The overall standard is solid for a hand-authored template, but the total absence of automated tests limits confidence in regressions.

What Makes It Unique Circle’s distinguishing trait isn’t a new technical mechanism — it’s fidelity: an unusually complete, feature-for-feature recreation of Linear’s interface, down to cycles, triage, initiatives, inbox, and a command palette, packaged as a pure front-end template with a companion guide aimed specifically at AI coding assistants explaining how to attach a real backend. That framing, plus the deliberate mock-data/store separation, is more of a packaging choice than an architectural innovation; the underlying patterns of Zustand, nuqs, and shadcn/ui are otherwise standard practice.

Self-Hosting

Licensing Model MIT licensed — all features available with no restrictions or license keys required.

Self-Hosting Restrictions None. The entire template ships as static front-end code; there is no gated “enterprise” build or paid tier in this repository.

Enterprise Features Not applicable — this repo has no enterprise or paid tier. A separate, more complete version of Circle built on BaseUI is sold independently on Square UI Pro (pro.lndevui.com), but it is a different product, not a licensed upgrade of this repo.

Cloud vs Self-Hosted Not applicable — Circle has no hosted offering; the public demo at circle.lndev.me runs the same open-source code over the same mock data.

License Key Required No.

Join founders buildingwith open source

Opinionated takes, migration guides, cost-saving tips, and insights from the open source ecosystem.

Subscribe on Substack
Join 750+ subscribers

Search