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

Block Theme Preview: Display loading state when activating #55658

Conversation

arthur791004
Copy link
Contributor

What?

We want to display the loading state when people are previewing the theme and activating it.

Why?

Resolved #55273

How?

Use startResolution & finishResolution to record we're activating the theme. I'm not sure whether it's a good idea but it's simple enough and provides a better experience. Additionally, we can keep using the same way when we have the rest API to activate the theme.

Testing Instructions

  1. Go to Appearance > Themes
  2. Hover on a block theme
  3. Click the ”Live Preview“ button
  4. Click the “Activate” button in the Editor
  5. Verify the button displays the loading state correctly

Testing Instructions for Keyboard

Screenshots or screencast

btp-activate-1.mov
btp-activate-2.mov

Copy link
Contributor

@okmttdhr okmttdhr left a comment

Choose a reason for hiding this comment

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

This change looks good to me 👍

@scruffian Could you leave a comment, if any? Otherwise, I'll just merge it 🙂

Comment on lines +36 to 41
startResolution( 'activateTheme' );
await window.fetch( activationURL );
finishResolution( 'activateTheme' );
const { wp_theme_preview: themePreview, ...params } =
location.params;
history.replace( params );
Copy link
Contributor

Choose a reason for hiding this comment

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

Outside the scope of this PR, but it's worth noting that history.replace (which removes ?wp_theme_preview=) is executed regardless of the HTTP status returned by window.fetch, including a 500 error 😇 CC: @scruffian

@okmttdhr okmttdhr added the [Type] Enhancement A suggestion for improvement. label Nov 1, 2023
Copy link
Contributor

@scruffian scruffian left a comment

Choose a reason for hiding this comment

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

This change looks good, although I've not tested. Happy for you to merge if you're also happy with it :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Block Theme Previews: Activate button has no loading state
3 participants