Skip to content

Conversation

@ivan-ottinger
Copy link
Contributor

Related issues

Proposed Changes

  • add tooltip with the demo site last update time to the Update demo site button
  • update placement of "offline" tooltips displayed for Update demo site and Delete demo site buttons

Markup on 2025-01-16 at 14:35:07

Testing Instructions

  1. Check out the PR branch and build the app with npm start.
  2. While on an existing Studio site, head over to the Share tab and create a new demo site.
  3. When you hover over the Update demo site button, a tooltip with information when the demo site was updated should show up.
  4. If you click the button and confirm the update, the time displayed in the tooltip should reset.

Pre-merge Checklist

  • Have you checked for TypeScript, React or other console errors?

@ivan-ottinger ivan-ottinger self-assigned this Jan 16, 2025
@ivan-ottinger ivan-ottinger requested a review from a team January 16, 2025 13:50
Copy link
Contributor

@wojtekn wojtekn left a comment

Choose a reason for hiding this comment

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

The code change looks correct. The tooltip works as expected.

We could consider moving the tooltip below the button as now it is displayed over the expiration text and introduces a feeling that it's not a tooltip but an expiration text being replaced. However, we will redesign the list as a part of the project so we can skip it.

Also, I'm wondering if we should use a language similar to the one in the Sync tab, e.g., You pushed this site %s ago. for consistency. However, the tooltip is now consistent with Expires in %s.

@ivan-ottinger
Copy link
Contributor Author

Thanks for the review and feedback, Wojtek!

We could consider moving the tooltip below the button as now it is displayed over the expiration text and introduces a feeling that it's not a tooltip but an expiration text being replaced. However, we will redesign the list as a part of the project so we can skip it.

That's a good point. I have moved the tooltip to the bottom - since I expect this change will be available to users before we launch the redesigned list.

Markup on 2025-01-17 at 09:41:22

Also, I'm wondering if we should use a language similar to the one in the Sync tab, e.g., You pushed this site %s ago. for consistency. However, the tooltip is now consistent with Expires in %s.

I was considering using similar language to the one we already use on the Sync tab, but apart it being more in line with the expiration time message as you mention, I also felt that having the tooltip in the passive form is more concise and easier to read.

@ivan-ottinger ivan-ottinger merged commit 7274053 into trunk Jan 17, 2025
6 checks passed
@ivan-ottinger ivan-ottinger deleted the add/site-snapshot-update-tooltip branch January 17, 2025 09:02
Copy link
Member

@sejas sejas left a comment

Choose a reason for hiding this comment

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

Great work @ivan-ottinger , thanks for adding the tooltip.

I confirm it works as expected and the tooltip appears over the update button.
Screenshot 2025-01-17 at 11 45 53

);
const getLastUpdateTimeText = () => {
if ( ! date ) {
return __( 'Never updated' );
Copy link
Member

Choose a reason for hiding this comment

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

I think this Never updated won’t ever be displayed.
No need to change it, it's just an observation.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Thank you for your review and feedback, Antonio. Yes it should never display. I left it there as a fallback in case the date is not available for some reason. But now thinking about it further, maybe instead we should hide the tooltip in that case completely.

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.

4 participants