Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Live stops if Date value is changed. #154

Closed
JoFont opened this issue Mar 24, 2021 · 8 comments
Closed

Live stops if Date value is changed. #154

JoFont opened this issue Mar 24, 2021 · 8 comments

Comments

@JoFont
Copy link

JoFont commented Mar 24, 2021

Hello, good afternoon,

The live functionality stops working when you update the date object and the component re-renders. Is there any way to prevent this?

Thank you very much!

@Eyal-VR
Copy link

Eyal-VR commented Apr 1, 2021

I'm experiencing this as well. any suggestions?

@dorukusumezbas
Copy link

same problem here.

@TomBailey167
Copy link
Contributor

I am also experiencing this issue and think it's also probably the cause of the problem on this Stack Overflow question:

https://stackoverflow.com/questions/66322904/how-to-fix-react-timeago-not-updating-on-its-own

@BrennanWilkins
Copy link

I was stuck on this for awhile, what worked for me was to add the date prop to the useEffect dependencies and then change Infinity to a large number.

@TomBailey167
Copy link
Contributor

TomBailey167 commented Apr 29, 2021

EDIT

Unfortunately I've just realised that the times started updating when I pressed save on the code on the development server (repeatable behaviour). The times didn't start updating because of the code change below. I'm curious as to why saving my code (which triggers an update of the page - but not a proper refresh) starts the timers going again. I'll try to do some further debugging.

Original Comment

Brilliant. I didn't need to add the date prop to useEffect - I don't actually have a useEffect clause where that would be relevant.

However, updating the max prop with a large integer did solve my issue:

Original Code:
<TimeAgo live={true} date={lastUpdated} formatter={timeFormatter} />

Updated Code:
<TimeAgo live={true} date={lastUpdated} formatter={timeFormatter} max={Number.MAX_SAFE_INTEGER} />

The time now updates as expected. Thank you for your help @BrennanWilkins - you've saved me a headache!

@BrennanWilkins
Copy link

Unfortunately I had to download the src files and make the edits to the index.js file. The useEffect in index.js was what I was referring to.

TomBailey167 added a commit to TomBailey167/react-timeago that referenced this issue Apr 30, 2021

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
Fix for issue nmn#154. useEffect dependencies updated to include [date]. This prevents an issue where my nested <TimeAgo /> component doesn't update on its own.
@TomBailey167
Copy link
Contributor

TomBailey167 commented Apr 30, 2021

Thanks @BrennanWilkins - that's sorted the issue now. I don't actually need to update the maxPeriod prop to Number.MAX_SAFE_INTEGER - just adding the date prop to deps works. I've submitted a pull request with the fix.

nmn added a commit that referenced this issue May 14, 2021
@nmn
Copy link
Owner

nmn commented May 16, 2021

Since the pull request was merged a new version has been published to NPM.

@nmn nmn closed this as completed May 16, 2021
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

No branches or pull requests

6 participants