Conversation
|
The preview deployment for clipify is ready. 🟢 Open Preview | Open Build Logs | Open Application Logs Last updated at: 2026-04-15 00:20:56 CET |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request introduces a Remote Control Panel for Pro users, allowing for live playback control, volume adjustment, and queue management through a new dedicated interface and enhanced WebSocket logic. It also migrates the project roadmap to a CMS-driven system using PocketBase, implements campaign offer banners with countdown timers, and refactors health monitoring to include database ping and aggregation metrics. Review feedback focused on improving code readability by suggesting that several long, single-line JSX and logic blocks be reverted to their original multi-line formats.
| column.uid === "clipCount" ? "w-[90px] min-w-[90px] max-w-[90px] text-right" : "", | ||
| activeTab === "playlists" && column.uid === "name" ? "w-full" : "", | ||
| ])} | ||
| className={cn([column.uid === "actions" ? "flex items-center justify-end px-[20px]" : "", column.uid === "accessType" ? "w-[48px] min-w-[48px] max-w-[48px] px-1" : "", column.uid === "id" ? "w-[320px] min-w-[320px] max-w-[320px]" : "", column.uid === "clipCount" ? "w-[90px] min-w-[90px] max-w-[90px] text-right" : "", activeTab === "playlists" && column.uid === "name" ? "w-full" : ""])} |
There was a problem hiding this comment.
This line is very long and hard to read. Please format the array passed to cn to be multi-line for better readability.
className={cn([
column.uid === "actions" ? "flex items-center justify-end px-[20px]" : "",
column.uid === "accessType" ? "w-[48px] min-w-[48px] max-w-[48px] px-1" : "",
column.uid === "id" ? "w-[320px] min-w-[320px] max-w-[320px]" : "",
column.uid === "clipCount" ? "w-[90px] min-w-[90px] max-w-[90px] text-right" : "",
activeTab === "playlists" && column.uid === "name" ? "w-full" : "",
])}
There was a problem hiding this comment.
Pull request overview
This PR ships the v2.2.0 feature set, centered on adding a Pro “remote control panel” for overlays, expanding campaign-offer capabilities (including auto-apply at checkout), moving the public roadmap to CMS-backed data, and tightening operational visibility via richer instance health metrics.
Changes:
- Refactors WebSocket subscriptions to support per-owner and per-overlay targeting plus overlay/controller roles, enabling remote control.
- Introduces a new controller surface (page + API) to manage playback/volume/queues for an overlay.
- Expands campaign offer fields across types/UI and updates health snapshot DB metrics + adds queue table indexes.
Reviewed changes
Copilot reviewed 43 out of 43 changed files in this pull request and generated 12 comments.
Show a summary per file
| File | Description |
|---|---|
| test/app/store/overlaySubscribers.test.ts | Updates tests for new owner+overlay subscriber maps. |
| test/app/lib/instanceHealth.test.ts | Updates tests for new DB ping/aggregation metrics. |
| test/app/dashboard/page.test.tsx | Mocks campaign offer fetch used by dashboard page. |
| test/app/components/roadmap/roadmapItem.test.tsx | Updates roadmap tests for string icon + typed colors. |
| test/app/components/overlayPlayer.test.tsx | Updates tests for subscribe role + queue cleanup behavior. |
| test/app/components/dashboardNavbar.test.tsx | Mocks campaign offer action used in navbar. |
| test/app/components/adminHealthCharts.test.tsx | Updates snapshot fixture for new DB metrics. |
| test/app/components/OverlayTable.test.tsx | Adds campaign offer action + upgrade modal mocking. |
| test/app/actions/websocket.test.ts | Updates tests for owner/overlay subscriber separation. |
| test/app/actions/subscription.test.ts | Mocks campaign offer fetch used by checkout link generation. |
| src/db/schema.ts | Adds composite indexes for clip/mod queue ordering. |
| src/app/ws/route.ts | Updates WS client metadata and cleanup for new subscriber model. |
| src/app/store/overlaySubscribers.ts | Introduces ownerSubscribers alongside overlaySubscribers. |
| src/app/roadmap/page.tsx | Fetches roadmap items from CMS via new server lib. |
| src/app/llms.txt/llms.txt | Updates product capability descriptions (remote control, editors/managers). |
| src/app/lib/types.ts | Expands CampaignOffer fields (dashboard banner, floating fields, auto-apply). |
| src/app/lib/roadmap.ts | New CMS roadmap loader with caching + normalization. |
| src/app/lib/instanceHealth.ts | Adds DB ping timing and total health aggregation timing. |
| src/app/lib/campaignOffers.ts | Maps new campaign offer fields + defaults. |
| src/app/dashboard/settings/page.tsx | Adds remote control panel to Pro feature list. |
| src/app/dashboard/page.tsx | Fetches active campaign offer and passes to OverlayTable. |
| src/app/dashboard/overlay/[overlayId]/page.tsx | Adds controller link + Pro gating UI affordance. |
| src/app/controller/[overlayId]/page.tsx | New controller entry page with access/pro checks. |
| src/app/controller/[overlayId]/controllerClient.tsx | New remote controller client UI + WS state rendering + API polling. |
| src/app/components/upgradeModal.tsx | Integrates campaign pricing promo display + fetches active offer. |
| src/app/components/roadmap/roadmapItem.tsx | Switches to string-based icon resolution and typed colors. |
| src/app/components/roadmap/roadmapData.ts | Replaces static roadmap data with normalization helpers + typed colors. |
| src/app/components/overlayPlayer.tsx | Adds WS role, command handling (mute), and overlay state publishing. |
| src/app/components/footer.tsx | Uses mounted-aware disabling to avoid token hydration issues. |
| src/app/components/dashboardNavbar.tsx | Adds dashboard campaign banner + countdown; fetches offer via action. |
| src/app/components/countdownTimer.tsx | New countdown timer component for campaign end times. |
| src/app/components/adminHealthCharts.tsx | Displays DB ping + aggregation metrics. |
| src/app/components/Pricing/pricing-tiers.ts | Updates Pro tier feature bullets. |
| src/app/components/OverlayTable/index.tsx | Adds (currently unused) campaign offer prop + refactors render/handlers. |
| src/app/components/LandingPage/faqs.ts | Updates Pro benefits copy for new features. |
| src/app/api/controller/[overlayId]/route.ts | New controller API (volume, queue management, mod-clip add). |
| src/app/admin/page.tsx | Shows new DB metrics in admin view. |
| src/app/actions/websocket.ts | Implements role-aware subscribe/command/state_update + targeted broadcast. |
| src/app/actions/subscription.ts | Auto-applies campaign offer code at checkout (and records metadata). |
| src/app/actions/campaignOffers.ts | New server action wrapper for campaign offer fetch. |
| src/app/HomePageClient.tsx | Updates landing content + floating banner fields + countdown support. |
| README.md | Updates product feature list and pricing copy. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| import * as TablerIcons from "@tabler/icons-react"; | ||
| import { IconBolt, IconChevronRight, type Icon } from "@tabler/icons-react"; |
There was a problem hiding this comment.
import * as TablerIcons from "@tabler/icons-react" typically pulls the entire icon set into the client bundle and can significantly increase JS size. Consider a small explicit registry of allowed icons (import only what you use) or a safer dynamic import approach so the roadmap page doesn’t ship every Tabler icon.
This pull request introduces several new features, improvements, and backend changes to support enhanced playlist management, remote control capabilities, and campaign offer integration. The most significant updates include new marketing features (Clip Playlists, Remote Control Panel, Editors & Managers), expanded API and WebSocket support for overlay control, and improved campaign offer handling throughout the application.
Feature and Marketing Updates
README.md, pricing, FAQ, and feature cards on the landing page. [1] [2] [3] [4]Campaign Offer Integration
floatingTitle,floatingSubtitle,endAtcountdown), and campaign offer codes are automatically applied at checkout if configured. [1] [2] [3] [4] [5] [6]Overlay and WebSocket Backend Enhancements
src/app/api/controller/[overlayId]/route.ts) for overlay control, supporting queue management, volume control, and moderator queue actions via secure endpoints. (src/app/api/controller/[overlayId]/route.tsR1-R128)General Improvements
These changes collectively improve the product's feature set, enable more flexible overlay management, and streamline campaign-driven marketing and upgrades.