@wordpress/preferences 4.33.1 → 4.34.0

package/src/store/{actions.js → actions.ts}

@@ -1,3 +1,12 @@
+/**
+ * Internal dependencies
+ */
+import type {
+	ActionObject,
+	StoreState,
+	WPPreferencesPersistenceLayer,
+} from './types';
+
 /**
  * Returns an action object used in signalling that a preference should be
  * toggled.
@@ -5,13 +14,19 @@
  * @param {string} scope The preference scope (e.g. core/edit-post).
  * @param {string} name  The preference name.
  */
-export function toggle( scope, name ) {
+export function toggle( scope: string, name: string ) {
+	// @ts-expect-error We cannot properly type this until we have a fully-typed datastore
 	return function ( { select, dispatch } ) {
 		const currentValue = select.get( scope, name );
 		dispatch.set( scope, name, ! currentValue );
 	};
 }
 
+type SetAction = ActionObject<
+	'SET_PREFERENCE_VALUE',
+	{ scope: string; name: string; value: any }
+>;
+
 /**
  * Returns an action object used in signalling that a preference should be set
  * to a value
@@ -20,9 +35,9 @@ export function toggle( scope, name ) {
  * @param {string} name  The preference name.
  * @param {*}      value The value to set.
  *
- * @return {Object} Action object.
+ * @return {SetAction} Action object.
  */
-export function set( scope, name, value ) {
+export function set( scope: string, name: string, value: any ): SetAction {
 	return {
 		type: 'SET_PREFERENCE_VALUE',
 		scope,
@@ -31,16 +46,25 @@ export function set( scope, name, value ) {
 	};
 }
 
+type ScopedDefaults = StoreState[ 'defaults' ][ string ];
+type SetDefaultsAction = ActionObject<
+	'SET_PREFERENCE_DEFAULTS',
+	{ scope: string; defaults: ScopedDefaults }
+>;
+
 /**
  * Returns an action object used in signalling that preference defaults should
  * be set.
  *
- * @param {string}            scope    The preference scope (e.g. core/edit-post).
- * @param {Object<string, *>} defaults A key/value map of preference names to values.
+ * @param scope    The preference scope (e.g. core/edit-post).
+ * @param defaults A key/value map of preference names to values.
  *
- * @return {Object} Action object.
+ * @return Action object.
  */
-export function setDefaults( scope, defaults ) {
+export function setDefaults(
+	scope: string,
+	defaults: ScopedDefaults
+): SetDefaultsAction {
 	return {
 		type: 'SET_PREFERENCE_DEFAULTS',
 		scope,
@@ -48,14 +72,13 @@ export function setDefaults( scope, defaults ) {
 	};
 }
 
-/** @typedef {() => Promise<Object>} WPPreferencesPersistenceLayerGet */
-/** @typedef {(Object) => void} WPPreferencesPersistenceLayerSet */
-/**
- * @typedef WPPreferencesPersistenceLayer
- *
- * @property {WPPreferencesPersistenceLayerGet} get An async function that gets data from the persistence layer.
- * @property {WPPreferencesPersistenceLayerSet} set A function that sets data in the persistence layer.
- */
+type SetPersistenceLayerAction< D extends Object > = ActionObject<
+	'SET_PERSISTENCE_LAYER',
+	{
+		persistenceLayer: WPPreferencesPersistenceLayer< D >;
+		persistedData: D;
+	}
+>;
 
 /**
  * Sets the persistence layer.
@@ -68,11 +91,13 @@ export function setDefaults( scope, defaults ) {
  * application's lifecycle, before any other actions have been dispatched to
  * the preferences store.
  *
- * @param {WPPreferencesPersistenceLayer} persistenceLayer The persistence layer.
+ * @param persistenceLayer The persistence layer.
  *
- * @return {Object} Action object.
+ * @return Action object.
  */
-export async function setPersistenceLayer( persistenceLayer ) {
+export async function setPersistenceLayer< D extends Object >(
+	persistenceLayer: WPPreferencesPersistenceLayer< D >
+): Promise< SetPersistenceLayerAction< D > > {
 	const persistedData = await persistenceLayer.get();
 	return {
 		type: 'SET_PERSISTENCE_LAYER',
@@ -80,3 +105,8 @@ export async function setPersistenceLayer( persistenceLayer ) {
 		persistedData,
 	};
 }
+
+export type AvailableActions =
+	| SetAction
+	| SetDefaultsAction
+	| SetPersistenceLayerAction< any >;

package/src/store/{constants.js → constants.ts}

@@ -1,6 +1,4 @@
 /**
  * The identifier for the data store.
- *
- * @type {string}
  */
 export const STORE_NAME = 'core/preferences';

package/src/store/{index.js → index.ts}

@@ -10,15 +10,18 @@ import reducer from './reducer';
 import * as actions from './actions';
 import * as selectors from './selectors';
 import { STORE_NAME } from './constants';
+import type { StoreState } from './types';
 
 /**
  * Store definition for the preferences namespace.
  *
  * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore
- *
- * @type {Object}
  */
-export const store = createReduxStore( STORE_NAME, {
+export const store = createReduxStore<
+	StoreState,
+	typeof actions,
+	typeof selectors
+>( STORE_NAME, {
 	reducer,
 	actions,
 	selectors,

package/src/store/{reducer.js → reducer.ts}

@@ -2,6 +2,11 @@
  * WordPress dependencies
  */
 import { combineReducers } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+import type { StoreState, WPPreferencesPersistenceLayer } from './types';
+import type { AvailableActions } from './actions';
 
 /**
  * Reducer returning the defaults for user preferences.
@@ -9,12 +14,15 @@ import { combineReducers } from '@wordpress/data';
  * This is kept intentionally separate from the preferences
  * themselves so that defaults are not persisted.
  *
- * @param {Object} state  Current state.
- * @param {Object} action Dispatched action.
+ * @param state  Current state.
+ * @param action Dispatched action.
  *
- * @return {Object} Updated state.
+ * @return Updated state.
  */
-export function defaults( state = {}, action ) {
+export function defaults(
+	state: StoreState[ 'defaults' ] = {},
+	action: AvailableActions
+): StoreState[ 'defaults' ] {
 	if ( action.type === 'SET_PREFERENCE_DEFAULTS' ) {
 		const { scope, defaults: values } = action;
 		return {
@@ -29,21 +37,26 @@ export function defaults( state = {}, action ) {
 	return state;
 }
 
+type PreferencesReducer = (
+	state: StoreState[ 'preferences' ],
+	action: AvailableActions
+) => StoreState[ 'preferences' ];
+
 /**
  * Higher order reducer that does the following:
  * - Merges any data from the persistence layer into the state when the
  *   `SET_PERSISTENCE_LAYER` action is received.
  * - Passes any preferences changes to the persistence layer.
  *
- * @param {Function} reducer The preferences reducer.
+ * @param reducer The preferences reducer.
  *
- * @return {Function} The enhanced reducer.
+ * @return The enhanced reducer.
  */
-function withPersistenceLayer( reducer ) {
-	let persistenceLayer;
+function withPersistenceLayer( reducer: PreferencesReducer ) {
+	let persistenceLayer: WPPreferencesPersistenceLayer< any >;
 
-	return ( state, action ) => {
-		// Setup the persistence layer, and return the persisted data
+	return ( state: StoreState[ 'preferences' ], action: AvailableActions ) => {
+		// Set up the persistence layer, and return the persisted data
 		// as the state.
 		if ( action.type === 'SET_PERSISTENCE_LAYER' ) {
 			const { persistenceLayer: persistence, persistedData } = action;

package/src/store/selectors.ts

@@ -0,0 +1,67 @@
+/**
+ * WordPress dependencies
+ */
+import deprecated from '@wordpress/deprecated';
+/**
+ * Internal dependencies
+ */
+import type { StoreState } from './types';
+
+const withDeprecatedKeys =
+	(
+		originalGet: ( state: StoreState, scope: string, name: string ) => any
+	) =>
+	( state: StoreState, scope: string, name: string ) => {
+		const settingsToMoveToCore = [
+			'allowRightClickOverrides',
+			'distractionFree',
+			'editorMode',
+			'fixedToolbar',
+			'focusMode',
+			'hiddenBlockTypes',
+			'inactivePanels',
+			'keepCaretInsideBlock',
+			'mostUsedBlocks',
+			'openPanels',
+			'showBlockBreadcrumbs',
+			'showIconLabels',
+			'showListViewByDefault',
+			'isPublishSidebarEnabled',
+			'isComplementaryAreaVisible',
+			'pinnedItems',
+		];
+
+		if (
+			settingsToMoveToCore.includes( name ) &&
+			[ 'core/edit-post', 'core/edit-site' ].includes( scope )
+		) {
+			deprecated(
+				`wp.data.select( 'core/preferences' ).get( '${ scope }', '${ name }' )`,
+				{
+					since: '6.5',
+					alternative: `wp.data.select( 'core/preferences' ).get( 'core', '${ name }' )`,
+				}
+			);
+
+			return originalGet( state, 'core', name );
+		}
+
+		return originalGet( state, scope, name );
+	};
+
+/**
+ * Returns a boolean indicating whether a prefer is active for a particular
+ * scope.
+ *
+ * @param {StoreState} state The store state.
+ * @param {string}     scope The scope of the feature (e.g. core/edit-post).
+ * @param {string}     name  The name of the feature.
+ *
+ * @return {*} Is the feature enabled?
+ */
+export const get = withDeprecatedKeys(
+	( state: StoreState, scope: string, name: string ) => {
+		const value = state.preferences[ scope ]?.[ name ];
+		return value !== undefined ? value : state.defaults[ scope ]?.[ name ];
+	}
+);

package/src/store/types.ts

@@ -0,0 +1,29 @@
+export type StoreState = {
+	preferences: { [ k in string ]: { [ p in string ]: any } };
+	defaults: { [ k in string ]: { [ p in string ]: any } };
+};
+
+export type OmitFirstArg< F > = F extends (
+	x: any,
+	...args: infer P
+) => infer R
+	? ( ...args: P ) => R
+	: never;
+
+export interface WPPreferencesPersistenceLayer< D extends Object > {
+	/**
+	 * An async function that gets data from the persistence layer.
+	 */
+	get: () => Promise< D >;
+	/**
+	 * A function that sets data in the persistence layer.
+	 */
+	set: ( value: D ) => void;
+}
+
+export type ActionObject<
+	T extends string,
+	D extends Record< Exclude< string, 'type' >, any > = {},
+> = {
+	type: T;
+} & D;

package/tsconfig.json

@@ -0,0 +1,16 @@
+{
+	"$schema": "https://json.schemastore.org/tsconfig.json",
+	"extends": "../../tsconfig.base.json",
+	"references": [
+		{ "path": "../a11y" },
+		{ "path": "../components" },
+		{ "path": "../compose" },
+		{ "path": "../data" },
+		{ "path": "../deprecated" },
+		{ "path": "../element" },
+		{ "path": "../i18n" },
+		{ "path": "../icons" },
+		{ "path": "../private-apis" }
+	],
+	"include": [ "src/**/*" ]
+}