Skip to content

[WS-2012] Initial Implementation of Live Page Refresh button (Frontend only)#13679

Merged
shayneahchoon merged 59 commits intolatestfrom
WS-2012-live-page-refresh-spike
Mar 11, 2026
Merged

[WS-2012] Initial Implementation of Live Page Refresh button (Frontend only)#13679
shayneahchoon merged 59 commits intolatestfrom
WS-2012-live-page-refresh-spike

Conversation

@hotinglok
Copy link
Copy Markdown
Contributor

@hotinglok hotinglok commented Feb 5, 2026

Resolves JIRA: WS-2012
WS-2153

Summary

Pre-production ready front-end for the Live Post Refresh button:

Screenshot 2026-03-05 at 11 02 37 Screenshot 2026-03-05 at 11 02 29

Code changes

  • Adds a refined polling hook to manage update state throughout the LivePage component.
  • Refines the Live Post Refresh button inline with the expected UX.
  • Completes the A11Y Swarm for the button and its associated live region.

Testing

  1. List the steps required to test this PR.

Useful Links

@shayneahchoon shayneahchoon self-assigned this Feb 25, 2026
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/styles.ts Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.tsx Outdated

useEffect(() => {
const timerId = setInterval(() => {
if (enableFeature === false) return;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added this line here so that we can merge in the PR as it is technically production ready.

Comment on lines +53 to +55
setTimeout(() => {
setShowButton(false);
}, TEN_SECONDS);
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should this timeout be cleaned up on unmount?

Comment thread src/app/hooks/useLivePagePolling/index.ts Outdated
@amoore108
Copy link
Copy Markdown
Contributor

amoore108 commented Mar 5, 2026

Just wondering if there was any thoughts towards using useReducer for this instead of a custom hook? Seems like it could fit the use case fairly well given its event driven nature.

Would potentially help in the future to combine it with Context to allow passing state around more easily, as I can imagine things like the 'key points' and 'header' will want to be dynamically updated as well.

This could be a something more for down the line though, just a thought.

@shayneahchoon
Copy link
Copy Markdown
Contributor

Just wondering if there was any thoughts towards using useReducer for this instead of a custom hook? Seems like it could fit the use case fairly well given its event driven nature.

Would potentially help in the future to combine it with Context to allow passing state around more easily, as I can imagine things like the 'key points' and 'header' will want to be dynamically updated as well.

This could be a something more for down the line though, just a thought.

Just took at a look at reducers, I'm not too sure if it's the best fit for the functionality we're looking for. I'm happy to hop on a call and discuss this one further?

@amoore108
Copy link
Copy Markdown
Contributor

Just took at a look at reducers, I'm not too sure if it's the best fit for the functionality we're looking for. I'm happy to hop on a call and discuss this one further?

Totally cool if it you think it won't be the best fit for it. You're much closer to the code/implementation for this, so it was just a thought that crossed my mind. Happy to take a steer away from the idea :)

Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/index.test.tsx Outdated
Comment thread ws-nextjs-app/pages/[service]/live/[id]/LatestPostButton/styles.ts
Copy link
Copy Markdown
Contributor

@Isabella-Mitchell Isabella-Mitchell left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Heya, looks good. I was unable to test this locally. Are there steps to get this to work locally?

@shayneahchoon
Copy link
Copy Markdown
Contributor

Heya, looks good. I was unable to test this locally. Are there steps to get this to work locally?

I've permanently disabled it for the time being on the Live page as this work mainly focused on the visuals of the button. However, there is a model in storybook if you'd like to take a look.

@shayneahchoon shayneahchoon merged commit 8308dac into latest Mar 11, 2026
13 checks passed
@amoore108 amoore108 deleted the WS-2012-live-page-refresh-spike branch April 14, 2026 15:54
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.

6 participants