-
Notifications
You must be signed in to change notification settings - Fork 4.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Move Entities Saved States from Modal to Sidebar (#21522)
* moved to sidebar, functional in post editor / hidden in site * copied over some styles, working in site editor now * added close button * added icons and styles * added selection feature * refactored store goo * refactored z-index * refactored entities saved states * refactored scss * added test for actions * added tests for reducer * added selector test * fixing lint * fixing more lint * cleanup bad auto-pretty * last of cleanup? * renamed select entity button * added actions/reducers/tests to edit-post * added store things to edit-site * restructured to run on isOpen/closePanel props * removed from editor package store * created Actions component for post editor layout * added save panel hidden button to post editor * added hidden button to site editor * added styles and class names * fixed z-index name issue * restored z-indexes to previous values, no need with non-overlapping panels * refactor ActionsPanel, always mount entitites" * removed unnecessary vars and imports * make save component always mounted in edit site" * added some comments * fixed closePanel for selecting entity in small width * removed entities actions/reducers from edit-site editor * passed localstate down through props in edit-site * removed entities goo from edit-site store * added parentBlockId as dep to callback in entitiy selection * converted entities to local state in edit-post layout * set up edit-post save panel on local state props * removed entities goo from edit-post store * fixed z-index naming convention * refactored actions panel * fixed comment misspellings * refactored entitiesSavedStates icon enum * removed unnecessary comments * added comment to redundant looking useCallback * updated description titles in test to no longer say 'modal' * added tests for panels/a11y buttons rendering * minor name and descriptor changes * added waitForSelector to failing post-visibility test * changed waitFor to wait for button to be clickable * changed 'Select entity' button to 'Select' * Update packages/base-styles/_z-index.scss Co-Authored-By: Enrique Piqueras <[email protected]> * applying some suggestions * Update packages/edit-post/src/components/layout/actions-panel.js Co-Authored-By: Enrique Piqueras <[email protected]> * added comment to setting callback * updated callback goo * fixed useCallback for dismissing panel * updates prop name from closePanel to close * updated how we clear the callback * simplified logic on callback setting and open/close * minor comment nit Co-authored-by: Enrique Piqueras <[email protected]>
- Loading branch information
1 parent
e110119
commit 4830c2c
Showing
16 changed files
with
541 additions
and
135 deletions.
There are no files selected for viewing
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
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
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
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
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
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,98 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { EntitiesSavedStates, PostPublishPanel } from '@wordpress/editor'; | ||
| import { useSelect, useDispatch } from '@wordpress/data'; | ||
| import { Button } from '@wordpress/components'; | ||
| import { __ } from '@wordpress/i18n'; | ||
| import { useCallback } from '@wordpress/element'; | ||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import PluginPostPublishPanel from '../sidebar/plugin-post-publish-panel'; | ||
| import PluginPrePublishPanel from '../sidebar/plugin-pre-publish-panel'; | ||
|
|
||
| export default function ActionsPanel( { | ||
| setEntitiesSavedStatesCallback, | ||
| closeEntitiesSavedStates, | ||
| isEntitiesSavedStatesOpen, | ||
| } ) { | ||
| const { closePublishSidebar, togglePublishSidebar } = useDispatch( | ||
| 'core/edit-post' | ||
| ); | ||
| const { | ||
| publishSidebarOpened, | ||
| hasActiveMetaboxes, | ||
| isSavingMetaBoxes, | ||
| hasNonPostEntityChanges, | ||
| } = useSelect( ( select ) => { | ||
| return { | ||
| publishSidebarOpened: select( | ||
| 'core/edit-post' | ||
| ).isPublishSidebarOpened(), | ||
| hasActiveMetaboxes: select( 'core/edit-post' ).hasMetaBoxes(), | ||
| isSavingMetaBoxes: select( 'core/edit-post' ).isSavingMetaBoxes(), | ||
| hasNonPostEntityChanges: select( | ||
| 'core/editor' | ||
| ).hasNonPostEntityChanges(), | ||
| }; | ||
| }, [] ); | ||
|
|
||
| const openEntitiesSavedStates = useCallback( | ||
| () => setEntitiesSavedStatesCallback( true ), | ||
| [] | ||
| ); | ||
|
|
||
| // It is ok for these components to be unmounted when not in visual use. | ||
| // We don't want more than one present at a time, decide which to render. | ||
| let unmountableContent; | ||
| if ( publishSidebarOpened ) { | ||
| unmountableContent = ( | ||
| <PostPublishPanel | ||
| onClose={ closePublishSidebar } | ||
| forceIsDirty={ hasActiveMetaboxes } | ||
| forceIsSaving={ isSavingMetaBoxes } | ||
| PrePublishExtension={ PluginPrePublishPanel.Slot } | ||
| PostPublishExtension={ PluginPostPublishPanel.Slot } | ||
| /> | ||
| ); | ||
| } else if ( hasNonPostEntityChanges ) { | ||
| unmountableContent = ( | ||
| <div className="edit-post-layout__toggle-entities-saved-states-panel"> | ||
| <Button | ||
| isSecondary | ||
| className="edit-post-layout__toggle-entities-saved-states-panel-button" | ||
| onClick={ openEntitiesSavedStates } | ||
| aria-expanded={ false } | ||
| > | ||
| { __( 'Open save panel' ) } | ||
| </Button> | ||
| </div> | ||
| ); | ||
| } else { | ||
| unmountableContent = ( | ||
| <div className="edit-post-layout__toggle-publish-panel"> | ||
| <Button | ||
| isSecondary | ||
| className="edit-post-layout__toggle-publish-panel-button" | ||
| onClick={ togglePublishSidebar } | ||
| aria-expanded={ false } | ||
| > | ||
| { __( 'Open publish panel' ) } | ||
| </Button> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| // Since EntitiesSavedStates controls its own panel, we can keep it | ||
| // always mounted to retain its own component state (such as checkboxes). | ||
| return ( | ||
| <> | ||
| <EntitiesSavedStates | ||
| isOpen={ isEntitiesSavedStatesOpen } | ||
| close={ closeEntitiesSavedStates } | ||
| /> | ||
| { ! isEntitiesSavedStatesOpen && unmountableContent } | ||
| </> | ||
| ); | ||
| } |
Oops, something went wrong.