fix: calculate actual read time and improve read time UI on blog cards#1544
fix: calculate actual read time and improve read time UI on blog cards#1544aaniya22 wants to merge 6 commits into
Conversation
Fixes recodehive#1491 - Replaced hardcoded '5 min read' with dynamically calculated read time - Read time is calculated based on content length (200 words/min average) - Added clock emoji for better visual clarity - Applied to both blogCard component and blogs index page
|
@aaniya22 is attempting to deploy a commit to the recode Team on Vercel. A member of the Team first needs to authorize it. |
|
Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. The estimated time for response is 5–8 hrs. In the meantime, please provide all necessary screenshots and make sure you run - npm build run , command and provide a screenshot, a video recording, or an image of the update you made below, which helps speed up the review and assignment. If you have questions, reach out to LinkedIn. Your contributions are highly appreciated!😊 Note: I maintain the repo issue every day twice at 8:00 AM IST and 9:00 PM IST. If your PR goes stale for more than one day, you can tag and comment on this same issue by tagging @sanjay-kv. We are here to help you on this journey of open source. Consistent 20 contributions are eligible for sponsorship 💰 🎁 check our list of amazing people we sponsored so far: GitHub Sponsorship. ✨ 📚Your perks for contribution to this community 👇🏻
If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊 |
github-actions
Bot
added
in-review
github-actions
Bot
added
Enhacement
|
✅ Synchronized metadata from Issue #1491:
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
@aaniya22 it failed the deployent provided you the log |
|
@aaniya22 you can go with |
|
21:42:27.361 Running build in Washington, D.C., USA (East) – iad1 |
There was a problem hiding this comment.
Pull request overview
This PR updates blog listing cards to show a computed “min read” label instead of a hardcoded “5 min read”, and adds a clock indicator to improve clarity on the blog card UI.
Changes:
- Replace the hardcoded read-time label with a calculated value (200 words/min, minimum 1 minute).
- Add a clock indicator alongside the read-time text on blog cards.
- Apply the update in both the main blogs list and the blog carousel card.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| src/pages/blogs/index.tsx | Replaces the hardcoded read-time label in the blogs listing card with a computed value (currently references an undefined item / missing content). |
| src/components/blogCarousel/blogCard.tsx | Replaces the hardcoded read-time label in the carousel card with a computed value based on the provided content prop. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| </div> | ||
| <span className="card-read-time">5 min read</span> | ||
| <span className="card-read-time"> | ||
| 🕒 {Math.max(1, Math.ceil(content.split(" ").length / 200))} min read |
| <span className="card-read-time"> | ||
| 🕒 {Math.max(1, Math.ceil(content.split(" ").length / 200))} min read | ||
| </span> |
| 🕒 {Math.max(1, Math.ceil((item.content || "").split(" ").length / 200))} min read | ||
| </span> |
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
|
✅ Synchronized metadata from Issue #1491:
|
|
@aaniya22 can you look into the build error |
|
This is the vercel preview and the main page crashes @aaniya22 @Adez017
|
preview not available although i there's some bug with our package file local build also failing @sanjay-kv |
|
Will try to resolve again there's some version mismatch |
|
✅ Synchronized metadata from Issue #1491:
|
|
✅ Synchronized metadata from Issue #1491:
|
|
#1546 caused the vercel deployment fail again, lets focus 1:1 PR: Issue |
This reverts commit d77c655.
|
✅ Synchronized metadata from Issue #1491:
|
|
@aaniya22 can you open a fresh PR with the changes ? This PR is failing on vercel CI and the errors are uncertain . |
ok, will do it |
|
@Adez017 @sanjay-kv opened the fresh PR as requested: #1668 Branch has been rebased on latest main, no conflicts, and lint is passing. The only pending item is Vercel authorization which requires maintainer approval. |
Fixes #1491
Problem
Blog article cards were showing a hardcoded "5 min read" label
regardless of the actual article length, which was inaccurate
and had no visual styling.
Solution
5 min readwith dynamically calculatedread time based on content length (200 words per minute average)
blogCard.tsxandblogs/index.tsxFiles Updated