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

fix(idlelogoutconfirmationmodal): Fixing an issue in the idle timer logic when query parameters are appended to the page #3750

Merged
merged 3 commits into from
Mar 22, 2023

Conversation

blechner
Copy link
Collaborator

@blechner blechner commented Mar 9, 2023

Closes #

Summary

  • Fixing an issue in the idle timeout confirmation dialog where changes in the current url (like appending a query parameter) without reloading the page caused the idle timer to restart and enter an invalid state where the countdown dialog would show up frozen.

Change List (commits, features, bugs, etc)

  • Assembling the originHref parameter to be added to the logout URLs in such a way that the current page's query parameters are not included. An easier solution would be to just remove originHref for good, since MAS is no longer using it, but we cannot assume that other consumers of the component aren't using it, so it is better to keep it in order to not introduce breaking changes.
  • Adding a null check in surveyData to avoid runtime errors if this property becomes null in subsequent component re-renders.

Acceptance Test (how to verify the PR)

  • When using the IdleLogoutConfirmationModal in a MAS application, reduce the idle timeout (to avoid having to wait 30 minutes), them run this in the development console to include an extra query parameter to the page url: window.history.replaceState(undefined, 'XXXX', window.location.href + "?tab=x"). Wait for the idle timeout dialog to pop up and notice that the countdown happens normally, i.e. should keep decreasing by 1s. No frozen countdown number is expected.

Regression Test (how to make sure this PR doesn't break old functionality)

  • Some unit tests were adjusted and all of them are passing.

Things to look for during review

  • Make sure all references to iot or bx class prefix is using the prefix variable
  • (React) All major areas have a data-testid attribute. New test ids should have test written to ensure they are not changed or removed.
  • UI should be checked in RTL mode to ensure the proper handling of layout and text.
  • All strings should be translatable.
  • The code should pass a11y scans (The storybook a11y knob should show no violations). New components should have a11y test written.
  • Unit test should be written and should have a coverage of 90% or higher in all areas.
  • All components should be passing visual regression test. For new styles or components either a visual regression test should be written for all permutations or the base image updated.
  • Changes or new components should either write new or update existing documentation.
  • PR should link and close out an existing issue

Marcelo Blechner added 2 commits March 9, 2023 17:14
…e current url excluding the query parameters to fix an issue where query parameters may be added to the page without a page reload, which would cause the `useEffect` to restart because it has the logout and inactivityLogout URLs as dependencies.
@netlify
Copy link

netlify bot commented Mar 9, 2023

Deploy Preview for carbon-addons-iot-react ready!

Name Link
🔨 Latest commit 9b73ede
🔍 Latest deploy log https://app.netlify.com/sites/carbon-addons-iot-react/deploys/640f529208a30400078d07df
😎 Deploy Preview https://deploy-preview-3750--carbon-addons-iot-react.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@blechner blechner changed the title Idle timeout modal fixes fix(idlelogoutconfirmationmodal): Fixing an issue in the idle timer logic when query parameters are appended to the page Mar 9, 2023
Copy link
Collaborator

@herleraja herleraja left a comment

Choose a reason for hiding this comment

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

LGTM

…e errors if `surveyData` becomes null after in subsequent component re-renders
url.searchParams.append('originHref', window.location.href);
url.searchParams.append(
'originHref',
[window.location.protocol, '//', window.location.host, window.location.pathname].join('')
Copy link
Collaborator

Choose a reason for hiding this comment

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

In the future I would prefer a template literal here.

Suggested change
[window.location.protocol, '//', window.location.host, window.location.pathname].join('')
`${window.location.protocol}//${window.location.host}${window.location.pathname}`

@kodiakhq kodiakhq bot merged commit 5817291 into next Mar 22, 2023
@kodiakhq kodiakhq bot deleted the idle-timeout-modal-fixes branch March 22, 2023 21:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants