-
Notifications
You must be signed in to change notification settings - Fork 3.9k
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
feat: added automatic hiding functionality for the survey report banner when clicking on the dismiss button #34914
feat: added automatic hiding functionality for the survey report banner when clicking on the dismiss button #34914
Conversation
Thanks for the pull request, @Asespinel! Please note that it may take us up to several weeks or months to complete a review and merge your PR. Feel free to add as much of the following information to the ticket as you can:
All technical communication about the code itself will be done via the GitHub pull request interface. As a reminder, our process documentation is here. Please let us know once your PR is ready for our review and all tests are green. |
var bannerDismissalTime = localStorage.getItem('bannerDismissalTime_' + userId); | ||
var bannerExpirationTime = localStorage.getItem('bannerExpirationTime_' + userId); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What would happen if we access from incognito mode?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If we access from incognito, the localstorage woulb be empty. But as long as the incognito tab remains open the local storage for that tab should not be erased. Is there a lot of users that navigate using incognito? DO you think it might be a problem?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I understand. From my side I think there is no problem with it working that way.
// Store the dismissal time in milliseconds | ||
var dismissalTime = new Date().getTime(); | ||
// Calculate the expiration time (1 month in milliseconds) | ||
var expirationTime = dismissalTime + (30 * 24 * 60 * 60 * 1000); // 30 days |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would it be useful to be able to configure a customized number of days/months?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Initially we thought it could be a set amount for everybody. I don't think it would be that useful but I'm open to suggestions.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If we are going to leave a default time, I believe that one month is adequate and reasonable. But maybe providing the possibility that this time is customizable at the platform level using a setting is also good. Either option would be fine for me.
@@ -4,8 +4,26 @@ $(document).ready(function(){ | |||
// If you want to do something after the slide-up, do it here. | |||
// For example, you can hide the entire div: | |||
// $(this).hide(); | |||
var userId = document.getElementById('userIdSurvey').value; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could we use let
instead of var
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sure I'll change it right away
// Calculate the expiration time (1 month in milliseconds) | ||
var expirationTime = dismissalTime + (30 * 24 * 60 * 60 * 1000); // 30 days | ||
// Store the dismissal time in the browser's local storage | ||
localStorage.setItem('bannerDismissalTime_' + userId, dismissalTime); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is it necessary to store this variable?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes since, it would be different from user to user and it would serve as comparation with the other bannerExpirationTime variable
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I also used the varaible as a flag to check for the first case where a survey report hasn't been sent and the button hasn't been pressed
var currentTime = new Date().getTime(); | ||
if (bannerDismissalTime && bannerExpirationTime && currentTime < bannerExpirationTime) { | ||
// Banner was dismissed and it's still within the expiration period, so hide it | ||
$('#originalContent').hide(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I tested the functionality and although it does hide the survey when I press the Dismiss button, every time I reload the page it shows and hides it quickly (milliseconds). Is it possible that the survey is never shown?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To do that we would have to add the display: none property on the banner and toggle it with javascript as well when the document loads. It would have the same effect when the banner should appear.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Perfect, it would be nice if it could be done.
f33600c
to
b46e8ff
Compare
@mariajgrimaldi When you have the time could you review this PR? |
Hi @Asespinel, I have check the code and I think it's okay, but I think we could re factorize it and make it clean with some auxiliary functions. Remind that if you need to set a lot of "code comments" could be a signal of your code it is not clear enough. We could use some auxiliary functions to get the user id, the current time, set the localstorage, and validate if we should show or hide the banner. |
Thanks for the suggested changes @Alec4r. I think this PR is ready to be reviewed. Can you check it when you have the chance @felipemontoya @mariajgrimaldi @ormsbee ? |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Please squash your commits, and make the commit message better describe why this change was made. I'll merge and do the redwood backport.
@@ -15,6 +15,7 @@ <h1 style="margin: 0; color: #FFFF; font-weight: 600;">Join the Open edX Data Sh | |||
<button id="dismissButton" type="button" style="background-color:var(--close-button-bg); color: var(--button-fg); border: none; border-radius: 4px; padding: 10px 20px; margin-right: 10px; cursor: pointer;">Dismiss</button> | |||
<form id='survey_report_form' method="POST" action="/survey_report/generate_report" style="margin: 0; padding: 0;"> | |||
{% csrf_token %} | |||
<input type="hidden" id="userIdSurvey" value="{{ user.id }}"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
everything else being the same, could we change this to use the anonymous ID?
You could easily use
return anonymous_id_for_user(user, None) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@felipemontoya: Unless you have a strong objection here, I'm inclined to merge this as-is, so that we can still try to squeeze this into Redwood. Is that okay with you?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I didn't want to leave the sequential ID stored there, but this only happens for a very small subset of users. We can go ahead and merge
I was going to review this but you folks have it covered. Thanks! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I belive we can merge this as is so that is makes it into redwood
@Asespinel 🎉 Your pull request was merged! Please take a moment to answer a two question survey so we can improve your experience in the future. |
…smiss button (openedx#34914) This hides the survey report banner from the Django Admin for a particular user for one month after they click on the "dismiss" button. This is done completely on the client side using localStorage, so the same user could see the banner again if they're logging in with a different browser.
2U Release Notice: This PR has been deployed to the edX staging environment in preparation for a release to production. |
…smiss button (#34914) This hides the survey report banner from the Django Admin for a particular user for one month after they click on the "dismiss" button. This is done completely on the client side using localStorage, so the same user could see the banner again if they're logging in with a different browser.
2U Release Notice: This PR has been deployed to the edX production environment. |
1 similar comment
2U Release Notice: This PR has been deployed to the edX production environment. |
Description
This PR adds a basic functionality to automatically hide the survey report banner when the dismiss button is clicked for one month depending on the user that clicked on the button. This could be changed in the future if requested. We use the localStorage to check when the Dismiss button was clicked so we can hide the banner from the admin site.
Testing instructions