OpenHive — Open-source Slack alternative with TipTap-powered message editor

[arseneHuot]

Hey TipTap community! 👋

I built OpenHive — an open-source, self-hosted Slack alternative, and TipTap powers the entire message input experience.

How we use TipTap

OpenHive uses TipTap as the rich text message editor with several extensions:

• @tiptap/starter-kit — Base editing (bold, italic, lists, code, blockquotes)
• @tiptap/extension-mention — @mentions with autocomplete popup showing workspace members
• @tiptap/extension-placeholder — Dynamic placeholder text ("Message #channel-name")
• @tiptap/extension-code-block-lowlight — Syntax-highlighted code blocks in messages
• @tiptap/pm — ProseMirror integration for custom keyboard shortcuts

TipTap made it incredibly easy to build a Slack-quality message composer with rich formatting, mentions, and code blocks — all with a great developer experience.

Features

• Rich text formatting toolbar (bold, italic, code, links)
• @mention autocomplete with real-time member lookup
• Code blocks with syntax highlighting
• File uploads alongside message text
• Keyboard shortcuts (Cmd+B, Cmd+I, Enter to send, Shift+Enter for newline)

Tech Stack

• Editor: TipTap (React) with StarterKit + Mention + CodeBlockLowlight + Placeholder
• Frontend: Next.js 14 + TypeScript + Tailwind CSS + shadcn/ui
• Backend: Supabase (PostgreSQL, Auth, Realtime, Storage)
• State: Zustand
• Calls: LiveKit WebRTC

Try it

git clone https://github.com/arseneHuot/openhive.git
cd openhive && npm install && npm run dev

🔗 GitHub: https://github.com/arseneHuot/openhive

Thanks to the TipTap team for such an amazing editor!