Font Library: move font uploads to a new tab #54655
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Size Change: +122 B (0%) Total Size: 1.62 MB
ℹ️ View Unchanged
|
madhusudhand
force-pushed
the
font-lib/move-font-uploads
branch
from
54a3271
to
ca0ea91
Compare
madhusudhand
requested review from
matiasbenedetto,
jasmussen and
ironprogrammer
madhusudhand
added
the
[Type] Bug
|
This feels clearer to me, given that if you do not permit access to Google though the "Install Fonts" tab, then we'll want to have a top level alternative, which is upload. I will note that it would be okay to still have the whole modal be a dropzone, and invoke uploading regardless of which tab you are on. That's not a requirement, this is fine too, just noting. I got a curious error, though. I was uploading this font, and got a green error message simply stating, "There was an error installing the fonts". Screenshot and gif: 
Note that the font uploaded successfully, as far as I can tell. Was the notice, given it was green for success, meant to actually say something like "Upload successful"? If yes, then we we should ideally avoid such a notice entirely, and instead immediately upon succesfull upload, redirect to the font page itself, with the boxes checked. I.e. this page: 
Nice work, this should be able to land in short order! |
|
Flaky tests detected in d94b1f4. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/6322031380
|
madhusudhand
force-pushed
the
font-lib/move-font-uploads
branch
from
a843eec
to
67c9f07
Compare
|
@jasmussen Thanks for the feedback.
Reverted the dropzone to previous state (whole modal being a dropzone). However, it is not yet supported in any tab page yet due the tab panel structure. I can create a followup ticket to add this behaviour.
Yes, It is a success message after successful upload. The message was wrong. Please suggest if we should use different approach in the interim.
With the current state of API, we do not have information about the exact error. I have created this followup issue to address it and removed the generic error for now. |
|
Sounds good.
If we cannot yet redirect on successful upload, you should at least get the success notice in the interim. But I hope we can build this in short order, it would be good to have for the feature. |
Introduced the success notice. I have created #54779 to address this in future once the Tabs v2 gets merged. 
|
madhusudhand
added
the
Backport to Gutenberg RC
mikachan
added
the
[Feature] Typography
|
Thanks for the PR, @madhusudhand! Note that in my testing, I didn't see any error messages, only the success message. Test ReportEnvironment
Actual Results
Additional Information
Supplemental Artifacts[Click to Expand] Figure 1: New Uploads dropzone location.
[Click to Expand] Figure 2: Mixed valid/invalid filetypes register as successful.
[Click to Expand] Figure 3: Success message remains following invalid upload attempt.
|
There was a problem hiding this comment.
This is looking nice, @madhusudhand! One suggestion for the hint text here:
packages/edit-site/src/components/global-styles/font-library-modal/local-fonts.js
Outdated
Show resolved
Hide resolved
|
@ironprogrammer Thanks for the detailed feedback.
We do not have specific information as to why a font upload failed from API where an upload could fail for multiple reasons. All the error messaging is to be handled in this followup issue by returning proper error codes from the API.
For now you would see only a success message because the error notice was removed. It is possible that we will have successful uploads and errors by choosing mix of files. I have put the details on errors in this comment. Please share your thoughts.
It is fixed now.
It is updated as per the suggestion. |
madhusudhand
force-pushed
the
font-lib/move-font-uploads
branch
from
064c5fc
to
d94b1f4
Compare
|
As this PR hasn't been approved or merged yet and the latest version of Gutenberg is due to be released today, I'm going to remove the I'm going to add the |
mikachan
added
Backport to WP 6.7 Beta/RC
matiasbenedetto
approved these changes
Sep 28, 2023
mikachan
pushed a commit
that referenced
this pull request
Sep 29, 2023
* move font uploads to a new tab in the modal * fix invalid success message and revert the dropzone to modal * add success notice for font uploads * make supported file formats message dynamic based on allowed extensions * update hint text and clear successful message with a fresh upload
|
I just cherry-picked this PR to the commits-for-6.4-beta2 branch to get it included in the next release: 75cb40f |
mikachan
removed
the
Backport to WP 6.7 Beta/RC
fluiddot
pushed a commit
that referenced
this pull request
Oct 2, 2023
* Fix the install of system fonts from a font collection (#54713) * Fix set upload dir test (#54762) * Site Editor: Prevent unintended actions on the classic theme (#54422) * Add action and selector to track access to Patterns page * Add a URL parameter to check if the Patterns page was accessed directly * Revert lib changes * Fix critical error in the Post Editor * Explicitly add `! isBlockBasedTheme` with `isTemplatePartsMode` * Fix critical error in the Post Editor * Patterns: Fix back navigation after pattern creation (#54852) * Patterns: Fix category control width in site editor (#54853) * Patterns: Allow non-user patterns under Standard filter (#54756) * Performance Tests: Separate page setup from test (#53808) # Conflicts: # test/performance/specs/post-editor.spec.js * Performance Tests: Support legacy selector for expanded elements (#54690) * Paragraph: Make 'aria-label' consistent with other blocks (#54687) * Paragraph: Make 'aria-label' consistent with other blocks * Update tests * Try using BC labels in performance tests * Move lightbox render function to filter (#54670) * syntax refactor repace strpos with str_contains (#54832) * Font Library: avoid deprected error in test (#54802) * fix deprecated call * removing unwanted line * Fix the ShortcutProvider usage (#54851) Co-authored-by: Marin Atanasov <[email protected]> * Image: Ensure `false` values are preserved in memory when defined in `theme.json` (#54639) * Modify conditional when parsing config * Only drop the value if it's undefined. --------- Co-authored-by: Michal Czaplinski <[email protected]> * Use "Not synced" in place of "Standard" nomenclature for patterns (#54839) * Standard -> Not synced * Fix broken test --------- Co-authored-by: Glen Davies <[email protected]> * Format Library: Try to fix highlight popover jumping (#54736) * Move mime-type collection generation to a function that can be tested… (#54844) * Move mime-type collection generation to a function that can be tested. Refactored to use that function. * linting changes * Add unit tests to mime type getter * Fixed linting errors * test the entire output array and replace assertTrue by assertEquals * fixing docs --------- Co-authored-by: Matias Benedetto <[email protected]> * Ensure lightbox toggle is shown if block-level setting exists (#54878) * Block Editor: Update strings in blocks 'RenameModal' component (#54887) * Footnotes: Add aria-label to return links (#54843) * Add aria-label to footnotes front-end links. * Add visual output. Fix PHPCS errors. * Remove visual changes, fix in follow-up. * Font Library: Changed the OTF mime type expected value to be what PHP returns (#54886) * Changed the OTF mime type expected value to be what PHP returns * add unit test for otf file installation --------- Co-authored-by: madhusudhand <[email protected]> * Image: Fix layout shift when lightbox is opened and closed (#53026) * Replace overflow: hidden with JavaScript callback to prevent scrolling * Disable scroll callback on mobile; add comments; fix scrim styles The page jumps around when trying to override the scroll behavior on mobile, so I disabled it altogether. I've also added comments to clarify this and other decisions made around the scroll handling. While testing, I realized that the scrim was completely opaque during the zoom animation, which does not match the design, so I added a new animation specifically for the scrim to fix that. * Add handling for horizontally oriented pages * Move close button so that it's further from scrollbar on desktop * Fix call to handleScroll() and add touch callback to new render method * Improve lightbox experience on mobile To ensure pinch to zoom works as expected when the lightbox is open on mobile, I added logic to disable the scroll override when touch is detected. Without this, the scroll override kicks in whenever one tries to pinch to zoom, and it breaks the experience. I also revised the styles for the scrim to make it opaque, as having content visible outside of the lightbox is distracting when pinching to zoom on a mobile device, and I think having a consistent lightbox across devices will make for the best user experience. * Fix spacing * Add touch directives to block supports * Fix spacing in block supports * Rename attribute for clarity * Update comment * Update comments * Fix spacing --------- Co-authored-by: Ricardo Artemio Morales <[email protected]> * Font Library: move font uploads to a new tab (#54655) * move font uploads to a new tab in the modal * fix invalid success message and revert the dropzone to modal * add success notice for font uploads * make supported file formats message dynamic based on allowed extensions * update hint text and clear successful message with a fresh upload * Block custom CSS: Fix incorrect CSS when multiple root selectors (#53602) * Block custom CSS: Fix incorrect CSS when multiple root selectors * Fix PHP lint error * Use `scope_selector` and `append_to_selector` method and update unit test * Use `scopeSelector` and `appendToSelector` function and update JS unit test * Update packages/block-editor/src/components/global-styles/test/use-global-styles-output.js Co-authored-by: Aaron Robertshaw <[email protected]> * Update packages/block-editor/src/components/global-styles/test/use-global-styles-output.js Co-authored-by: Aaron Robertshaw <[email protected]> * Update packages/block-editor/src/components/global-styles/test/use-global-styles-output.js Co-authored-by: Aaron Robertshaw <[email protected]> * Update packages/block-editor/src/components/global-styles/test/use-global-styles-output.js Co-authored-by: Aaron Robertshaw <[email protected]> * Update packages/block-editor/src/components/global-styles/utils.js Co-authored-by: Aaron Robertshaw <[email protected]> * re-trigger CI --------- Co-authored-by: Aaron Robertshaw <[email protected]> * Add new e2e test for creating a pattern (#54855) * Use list role instead of listbox for patterns (#54884) * Popover: Fix the styles for components that use emotion within popovers (#54912) # Conflicts: # packages/components/CHANGELOG.md * Footnotes: use core’s meta revisioning if available (#52988) # Conflicts: # packages/block-library/src/footnotes/index.php * Remove base url from link control search results (#54553) * Expose baseURL setting on Post and Site Editors via block settings * Strip baseURL from rendered search results * Only fetch baseURL once in top level component * Simplify implementation to utilise URL parse functions * Improve comment wording to avoid referencing undefined var * Remove superfluous conditional * Decode URL prior to operations * Refactor for readability * Fix where url is not defined * Revert change to filter util * Ensure that filterURLForDisplay always receives a string as an arg * Make e2e test locator less strict * Prefer pipe * Force remove trailing slash * [Site Editor]: Update copy of using the default template in a page (#54728) * Remove overflow: hidden from the entity title h1 in the site editor sidebar (#54769) * Site Editor: Avoid same key warnings in template parts area listings (#54863) * TemplateAreas use template part clientId as key * HomeTemplateDetails use template part clientId as key * Cleanup useSelect hook * Fix ToolSelector popover variant (#54840) * Font Library: refactor endpoint permissions (#54829) * break the checking of user permission and file write permissions * return error 500 if the request to the install fonts endpoint needs write permissions and wordpress doens't have write permission on the server * do not ask file write permission on uninstall endpoint * Standardize the output of install and uninstall fonts endpoints Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Jeff Ong <[email protected]> * Handle standardized output from install and uninstall endpoints in the frontend Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Jeff Ong <[email protected]> * Update the install and unintall fonts endpoints unit tests for the new standardized output format Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Jeff Ong <[email protected]> * fix the refersh call for the library Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Jeff Ong <[email protected]> --------- Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Jeff Ong <[email protected]> * Don’t use TypeScript files in scripts package (#54856) * Fix Search Block not updating in Nav block (#54823) * Avoid setState in render * Attempt at test coverage * Improve tests and make them work * Remove word-wrap property (#54866) --------- Co-authored-by: Matias Benedetto <[email protected]> Co-authored-by: Aki Hamano <[email protected]> Co-authored-by: Aaron Robertshaw <[email protected]> Co-authored-by: Bart Kalisz <[email protected]> Co-authored-by: George Mamadashvili <[email protected]> Co-authored-by: Artemio Morales <[email protected]> Co-authored-by: Riad Benguella <[email protected]> Co-authored-by: Marin Atanasov <[email protected]> Co-authored-by: Michal Czaplinski <[email protected]> Co-authored-by: Rich Tabor <[email protected]> Co-authored-by: Glen Davies <[email protected]> Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Alex Stine <[email protected]> Co-authored-by: madhusudhand <[email protected]> Co-authored-by: Carlos Bravo <[email protected]> Co-authored-by: Ricardo Artemio Morales <[email protected]> Co-authored-by: Kai Hao <[email protected]> Co-authored-by: Adam Silverstein <[email protected]> Co-authored-by: Dave Smith <[email protected]> Co-authored-by: Nik Tsekouras <[email protected]> Co-authored-by: Ramon <[email protected]> Co-authored-by: Jason Crist <[email protected]> Co-authored-by: Jeff Ong <[email protected]> Co-authored-by: Pascal Birchler <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
As suggested by the design, this change moves the font uploads section to a new tab and provides appropriate error messages when upload fails.
It also removes the use of snackbar.
Testing Instructions
Screenshots or screencast
Related issues:
Fixes: #54504