Social Feed

Role-specific social feeds for client and trainer dashboards. Clients discover trainers and content through an algorithmic feed, while trainers manage leads, celebrate client milestones, and share expertise.

Overview

The Social Feed is the primary dashboard experience for both clients and trainers, but with completely different content tailored to each role. The feed serves as the central hub where users spend most of their time, combining content discovery, social engagement, and business management in a single scrollable view.

For clients, the feed is an algorithmic, non-chronological stream featuring trainer posts, program recommendations, community highlights, challenges, and motivational content. A stories section at the top shows recommended trainers with connect buttons. Post interactions include like (with animation), comment, bookmark/save, and share. Content includes images/videos, hashtags, pricing information, ratings, enrollment numbers, and call-to-action buttons.

For trainers, the feed doubles as a business management tool. It surfaces new client leads with match percentages, client milestones and check-ins (mood/energy tracking), upcoming sessions, success stories, and community events. Trainers can accept, view, or pass on leads directly from their feed, and interact with other trainers' content through likes, comments, and follows.

User Stories

Client Stories

As a client, I want to see a personalized feed of trainer content so that I can discover new trainers and training ideas.

As a client, I want to browse recommended trainers in a stories carousel so that I can quickly find and connect with trainers.

As a client, I want to like, comment, bookmark, and share posts so that I can engage with content that interests me.

As a client, I want to see program recommendations with pricing and ratings so that I can evaluate programs directly from my feed.

As a client, I want to join challenges from my feed so that I can stay motivated and compete with the community.

Trainer Stories

As a trainer, I want to see new client leads with match percentages in my feed so that I can quickly identify good-fit clients.

As a trainer, I want to accept, view, or pass on leads directly from my feed so that I can manage my pipeline efficiently.

As a trainer, I want to see client milestones and check-ins so that I can celebrate progress and stay engaged with my clients.

As a trainer, I want a stats bar showing new leads, responses, active clients, and rating so that I have a quick overview of my business.

As a trainer, I want to share pro tips, success stories, and program updates so that I can grow my brand and attract clients.

As a trainer, I want to boost my posts for increased visibility so that my content reaches more potential clients.

Post Types

Client Feed Post Types

post Trainer content posts with images/videos
tip Pro tips and training advice
recommendation Platform-curated trainer/program recommendations
challenge Time-limited fitness challenges with prizes
transformation Client transformation spotlights
program Marketplace program cards with pricing
motivation Motivational content and community highlights

Trainer Feed Post Types

new_lead New client leads with match percentage
client_milestone Client achievement notifications
check_in Client mood/energy check-ins
upcoming_session Scheduled session reminders
success_story Client success highlights
pro_tip Training tips shared by trainers
program_update Program edits and new releases
community_event Platform events and announcements

Data Model

Table Key Columns Description
posts id, author_id, content, type, image_url, video_url, hashtags[], is_boosted, boost_expires_at, like_count, comment_count, share_count, created_at Feed posts from trainers and platform. Type determines card layout and CTAs.
post_likes id, post_id, user_id, created_at Like records. Unique constraint on (post_id, user_id) prevents double-likes.
post_comments id, post_id, user_id, content, parent_id, created_at Threaded comments with optional parent_id for replies.
saved_posts id, post_id, user_id, created_at Bookmark/save functionality for posts.

Post Interactions

♡

Like

Animated heart with count. Toggleable. Optimistic UI update.

💬

Comment

Threaded comments with replies. Opens inline or in modal.

🔖

Bookmark

Save posts to personal collection for later viewing.

↪

Share

Share post externally or within platform. Track share count.

Screens & Routes

Route File Description
/dashboard src/routes/_authed/_onboarded/dashboard.tsx Main dashboard — redirects to role-specific feed (client or trainer)
/feed src/routes/_authed/_onboarded/_trainer/feed.tsx Trainer feed — leads, milestones, check-ins, stats bar

Acceptance Criteria

Client Feed

Trainer Feed

Post Boosting

API Surface

The social feed API is planned but not yet implemented. The current UI uses mock data from src/mocks/feed.ts.

Planned Server Functions

GET getFeed — Paginated, algorithmic feed for the current user's role

POST createPost — Create a new post (trainer-only)

POST likePost / unlikePost — Toggle like with optimistic update

POST addComment — Add comment or reply to a post

POST savePost / unsavePost — Toggle bookmark

GET getSavedPosts — User's bookmarked posts

POST boostPost — Purchase and apply boost to a post

GET getRecommendedTrainers — Stories carousel data

Current Status

Built
  • Client feed page UI with mock data
  • Trainer feed page UI with mock data
  • Post card component with interactions
  • Trainer stats bar
  • Stories section carousel
  • Mock data for all post types
In Progress
  • Database schema for posts, likes, comments, saved_posts
Not Started
  • Feed algorithm / ranking logic
  • API server functions (all CRUD)
  • React Query hooks
  • Post creation flow (trainer)
  • Image/video upload for posts
  • Comment system backend
  • Post boosting with credits
  • Infinite scroll pagination
  • Lead management actions from feed