Skip to content

feat(workout-session): share completed workout as a social-ready image - #252

Open
luke-song wants to merge 1 commit into
Snouzy:mainfrom
luke-song:feat/share-workout-success-image
Open

luke-song wants to merge 1 commit into
Snouzy:mainfrom
luke-song:feat/share-workout-success-image

Conversation

@luke-song

Copy link
Copy Markdown

Summary

Adds a Share my success button on the workout complete screen (next to Go to my profile) so users can generate a social-friendly summary image client-side.

Closes #54.

What changed

  • New ShareWorkoutCard (4:5 / 600×750) with date, muscles worked, exercise count, motivational message, and workout.cool logo
  • New ShareWorkoutButton that captures the card with html-to-image, then uses the Web Share API with a PNG file when available (mobile), otherwise downloads the image
  • Wired into the actual end-of-session UI in WorkoutStepper (and the congrats branch in WorkoutSessionSets for consistency)
  • Locale strings for en / fr / es / pt / ru / zh-CN
  • Adds html-to-image dependency

Why this approach

  • After completeWorkout(), isWorkoutActive becomes false, so the visible congrats screen is in WorkoutStepper — not only WorkoutSessionSets. This PR puts the share CTA where users actually land.
  • Uses formatDate from shared/lib/date (FSD) and a plain <img> for the logo so html-to-image captures reliably.
  • No server-side image rendering.

How to test

  1. Start a workout (equipment → muscles → exercises → start).
  2. Finish the session (complete sets / finish session).
  3. On the congrats screen, confirm Share my success appears next to Go to my profile.
  4. Click share:
    • Mobile / share-capable browsers: native share sheet with the PNG.
    • Desktop: PNG downloads as workout-cool-summary.png.
  5. Confirm the image includes date, muscle pills, exercise count, logo, and “Keep going!”-style motivation.

Notes

There is an existing open PR (#250) for the same issue; this implementation differs mainly by wiring the button into the WorkoutStepper congrats screen users actually see after finish, plus multi-locale strings and FSD date formatting.

@vercel

vercel Bot commented Sep 19, 2026

Copy link
Copy Markdown

@luke-song is attempting to deploy a commit to the Workoutcool Team Team on Vercel.

A member of the Team first needs to authorize it.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

🤝 Help wanted: Allow user to share their completed workout as an image (social-ready)

1 participant