Skip to main content

​
Overview

Jefftube provides an intuitive video browsing experience that lets users explore the Epstein files video archive. Videos are organized by playlists and can be sorted by popularity.

​
Channel Page

The main channel page (located at /) serves as the primary hub for browsing all available videos.

​
Video Organization

1

Browse All Videos

The Videos tab displays all videos in a responsive grid layout. Videos are automatically sorted with non-playlist videos appearing first, followed by playlist videos sorted alphabetically by playlist name.
// Videos are sorted: no playlist first, then by playlist name
const sortedVideos = [...videos].sort((a, b) => {
  if (!a.playlist && b.playlist) return -1;
  if (a.playlist && !b.playlist) return 1;
  if (a.playlist && b.playlist) {
    return a.playlist.localeCompare(b.playlist);
  }
  return 0;
});
2

Switch to Playlists View

Click the Playlists tab to see videos grouped by collection (e.g., “Elevator Cam”, “Lobby Cam”). Each playlist card shows the thumbnail of the first video, total video count, and combined duration.
3

Click to Watch

Select any video to navigate to the full video player page.

​
Channel Information

The channel page displays:
  • Channel banner image
  • Channel name: “Jeffery Epstein”
  • Channel handle: @jeevacation
  • Total video count
  • Channel description
  • Verified badge

​
Video Player Page

When you click a video, you’re taken to the watch page at /watch/:videoId.

​
Video Playback

The video player automatically starts playing when the page loads: 
<video
  controls
  autoPlay
  playsInline
  poster={thumbnailUrl}
  src={videoUrl}
>
  Your browser does not support the video tag.
</video>
Videos use HTML5 video player with standard controls including play/pause, volume, fullscreen, and playback speed.

​
Video Information

Below the player, you’ll find:

Video Title

Displayed prominently above all other metadata

View Count

Shows how many times the video has been watched

Channel Info

Avatar, channel name, and subscribe button

Engagement Actions

Like button with count, Share button, and More options

​
Video Engagement

Click the like button to register your appreciation. The like count updates in real-time using optimistic UI updates.
// Like button shows filled state when you've liked
<button onClick={() => likeMutation.mutate()}>
  <LikeIcon filled={isLiked} />
  <span>{video.likes}</span>
</button>
Your like status persists across sessions based on your IP address.

​
View Tracking

Every time you watch a video, the view count increments. The platform tracks views using the database: 
// Video schema includes view tracking
export const videos = pgTable("videos", {
  id: varchar("id", { length: 50 }).primaryKey(),
  title: varchar("title", { length: 255 }),
  views: integer("views").notNull().default(0),
  // ... other fields
});
View counts are displayed on:
  • Video cards in the browse view
  • Video player page below the player
  • Formatted with suffixes (e.g., “1.2K views”, “3.4M views”)

​
Suggested Videos Sidebar

While watching a video, the right sidebar displays suggested videos to watch next:
The sidebar shows up to 500 suggested videos, excluding the current video. This helps you continue exploring the archive without returning to the channel page.

​
Navigation Flow

​
Responsive Design

The browsing experience adapts to your screen size:
  • Mobile: Single column grid, stacked layout
  • Tablet: 2-3 column grid
  • Desktop: 4 column grid with sidebar navigation
  • Large Desktop: Maximum width container for optimal viewing
The channel page uses a responsive grid that adjusts based on screen size:
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
  {sortedVideos.map((video) => (
    <VideoCard key={video.id} video={video} size="lg" />
  ))}
</div>
This creates:
  • 1 column on mobile (< 640px)
  • 2 columns on small screens (≥ 640px)
  • 3 columns on medium screens (≥ 768px)
  • 4 columns on large screens (≥ 1024px)

Build docs developers (and LLMs) love

Get started for freeTalk to us