-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
Migrate interface enableItems
data to preferences package
#39449
Migrate interface enableItems
data to preferences package
#39449
Conversation
Size Change: -882 B (0%) Total Size: 1.21 MB
ℹ️ View Unchanged
|
c4c4de7
to
2e201bb
Compare
export const disableComplementaryArea = ( scope ) => ( { registry } ) => { | ||
registry | ||
.dispatch( preferencesStore ) | ||
.set( scope, 'complementaryArea', null ); |
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.
Looking at the diff, this might seem like I'm changing the value from undefined
to null
, but the reducer for setSingleEnableItem
was coercing the undefined
into null
, so the new code is equivalent.
It's a shame that null
has to be used because it will be serialized to local storage, but the complementary areas use the difference between null
and undefined
to determine if the sidebar has never been opened and whether it should open by default:
gutenberg/packages/interface/src/components/complementary-area/index.js
Lines 131 to 135 in 79cacc5
useEffect( () => { | |
if ( isActiveByDefault && activeArea === undefined && ! isSmall ) { | |
enableComplementaryArea( scope, identifier ); | |
} | |
}, [ activeArea, isActiveByDefault, scope, identifier, isSmall ] ); |
This should be ready for review now. |
@@ -10,5 +10,5 @@ | |||
*/ | |||
export function get( state, scope, name ) { | |||
const value = state.preferences[ scope ]?.[ name ]; | |||
return value ?? state.defaults[ scope ]?.[ name ]; | |||
return value !== undefined ? value : state.defaults[ scope ]?.[ name ]; |
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.
This is unfortunately needed because of how complementaryAreas
rely on null
and undefined
being distinct values.
@@ -1,7 +1,7 @@ | |||
/** | |||
* External dependencies | |||
*/ | |||
import { merge, isPlainObject } from 'lodash'; | |||
import { merge, isPlainObject, reduce } from 'lodash'; |
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.
wasn't there a push to use native methods when available instead of lodash?
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'll see if I can remove it 👍
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.
Done in 51e05d4 😄
* }, | ||
* } | ||
* ``` | ||
* |
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.
Thanks for the clear documentation 🎉
// merged. | ||
const sourceComplementaryAreas = | ||
sourceEnableItems?.singleEnableItems?.complementaryArea; | ||
const convertedComplementaryAreas = reduce( |
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.
Complementary Area
seems like a strange description, out of interest do you know what is meant by 'Complementary' in this instance?
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.
There are some docs - https://github.com/WordPress/gutenberg/tree/trunk/packages/interface#complementary-areas.
I agree, I don't think it's the best name. I think the problem is that most people (myself included) won't know what it means for it to be complementary. Even after I've read the docs I have a hard time remembering or understanding.
It might be better if it were just called area
or interfaceArea
. Then the action would be showItemInArea
, which is a lot clearer to me.
There are a few public APIs with this naming now so it's a little hard to roll back on.
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.
hmm, yeh, I would need to go back and re-read that description each time as well - but not critical enough to warrant a public API change.
This tested well for me, in both the post editor using the suggested steps, and also in the site editor with the global styles panel setting. I have left a couple of comments, both questions for my own interest mostly, happy to approve if I am mistaken about |
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.
LGTM 🎉
… instead of unsetting the preference
51e05d4
to
f5d48c2
Compare
Part of #31965
What?
Removes the final piece of
persistedState
from the interface package by migrating theenableItems
data to the preferences store.This feature was implemented in an interesting way, using some reducers called
singleEnableItems
(forcomplementaryArea
state) andmultipleEnableItems
(forpinnedItem
state) and it seems like the intention might have been for theinterface
package to be an abstract way of handling the state of different types of UI. In this PR I remove that abstraction and just store the data aspinnedItems
andcomplementaryArea
😄Why?
As outlined in #31965, the goal is to move persisted data out of our various stores to a centralized preferences store.
To explain a bit more about why I removed the
singleEnableItems
andmultipleEnableItems
concepts. I thinkpreferences
is already a generic data store, and so these abstractions no longer seem required. Other interfaces that need to persist state can do so by using the preferences store directly. It also simplifies how these features work.How?
Uses a migration function to migrate the persisted
localStorage
data. The selectors now select from and actions dispatch to the preferences store.The
interface
package no longer has a reducer for its store, which is a bit weird, but the selectors and actions need to be kept around for backwards compatibility.Testing Instructions
I found the easiest way to test it to use my test environment and enable the 'Gutenberg Test Plugin, Plugins API' plugin. Then:
trunk