Replace frontend with React 19 + TailwindCSS stack, implement all pages

[Copilot]

Removes incomplete yarn/reactstrap frontend, replaces with modern stack per issue requirements.

Stack

• pnpm, Vite 7, React 19, TypeScript
• TailwindCSS 4, TanStack Router, MobX
• Recharts for data visualization

Pages Implemented

Dashboard — Time range selector (day/week/month), 4 stat cards, stacked area chart, pie chart

Timeline — 24-hour horizontal timeline, color-coded activity blocks, click-for-details panel

TagTree — Hierarchical tree grouped by / delimiter, progress bars, expand/collapse all

Plot — Tag filter dropdown, bin size (hourly/daily/weekly), area/bar toggle

RuleEditor — Rule groups list, modal editor for all 6 rule types, save/discard with dirty state

Structure

src/
├── components/   # TimeRangeSelector, StatCard, CategoryHistoryChart, CategoryPieChart
├── stores/       # dashboardStore, timelineStore, tagTreeStore, plotStore, ruleEditorStore
├── lib/          # api.ts, formatDuration.ts, categoryColors.ts
└── pages/        # Dashboard, Timeline, TagTree, Plot, RuleEditor

Screenshots

Dashboard	Timeline

Tag Tree	Plot	Rule Editor

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Implement new UI</issue_title>
<issue_description>The existing incomplete UI in frontend should be removed. Instead we should write a new frontend using the following technologies: tailwind, typescript, react, tanstack-router, mobx, vite, eslint, pnpm.</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes Implement new UI #31

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.