Phone system

npx shadcn@latest add @handset/phone-system

Pulls in the whole tree: messaging (→ inbox, thread, composer), call-log (→ call-transcript), and voicemail-player. One command installs nine components.

import { HandsetProvider } from "@handset/react";
import { PhoneSystem } from "@/components/handset/phone-system";

export default function CommunicationsPage() {
  return (
    <HandsetProvider>
      <div className="h-[700px]">
        <PhoneSystem />
      </div>
    </HandsetProvider>
  );
}

This is the demo block — the fastest path from zero to "look what our product does now." Real products usually keep it as-is for an ops/communications page and use the individual components (ContactTimeline, ClickToCallButton) where they belong in context. The tabs are ~40 lines of the copy in your repo; restructure freely.