From 2950862114ebf4573da534bcef2bc50f7860229b Mon Sep 17 00:00:00 2001 From: Jan Jakes Date: Thu, 9 Mar 2023 15:13:03 +0100 Subject: [PATCH] Add typings for all @wordpress/data store selection variants Both store name and store descriptor typings should work in all cases. [MAILPOET-5102] --- mailpoet/assets/js/src/types/index.ts | 56 ++++++++++++++++++++++----- 1 file changed, 47 insertions(+), 9 deletions(-) diff --git a/mailpoet/assets/js/src/types/index.ts b/mailpoet/assets/js/src/types/index.ts index eb20478056..33c8567409 100644 --- a/mailpoet/assets/js/src/types/index.ts +++ b/mailpoet/assets/js/src/types/index.ts @@ -3,10 +3,9 @@ import { ColorPalette, FontSizePicker } from '@wordpress/components'; import { ConfirmDialog } from '@wordpress/components/build-types/confirm-dialog'; import { ActionCreatorsOf, - AnyConfig, ConfigOf, CurriedSelectorsOf, - MapSelect, + DataRegistry, StoreDescriptor as GenericStoreDescriptor, UseSelectReturn, } from '@wordpress/data/build-types/types'; @@ -75,25 +74,64 @@ declare module '@wordpress/components' { // fix and improve some @wordpress/data types declare module '@wordpress/data' { - export function select>( + // Derive typings for select(), dispatch(), useSelect(), and useDispatch()calls + // by store name. The StoreMap interface can be augmented to add custom stores. + interface StoreMap { + [key: string]: StoreDescriptor; + } + + type TKey = keyof StoreMap; + type TStore = T extends keyof StoreMap ? StoreMap[T] : never; + type TSelectors = CurriedSelectorsOf>; + type TActions = ActionCreatorsOf>>; + type TSelectFunction = ( + store: T, + ) => T extends TKey ? TSelectors : CurriedSelectorsOf; + type TMapSelect = (select: TSelectFunction, registry: DataRegistry) => any; + + // select('store-name') + function select(store: T): TSelectors; + + // fix return type for select(storeDescriptor) + export function select>( store: T, ): CurriedSelectorsOf; + // dispatch('store-name') + function dispatch(store: T): TActions; + + // fix return type for dispatch(storeDescriptor) export function dispatch>( store: T, ): ActionCreatorsOf>; - // in @wordpress/data, the "deps" is not optional (while in reality it is) - export function useSelect>( - mapSelect: T, - deps?: unknown[], - ): UseSelectReturn; - // function "batch" is missing in data registry export function useRegistry(): { batch: (callback: () => void) => void; }; + // useSelect((select) => select('store-name') => ...) + // useSelect((select) => select(storeDescriptor) => ...) + export function useSelect( + mapSelect: T, + deps?: unknown[], + ): ReturnType; + + // useSelect(storeDescriptor) + export function useSelect( + store: T, + deps?: unknown[], + ): UseSelectReturn; + + // useSelect('store-name') + export function useSelect( + store: T, + deps?: unknown[], + ): UseSelectReturn>; + + // useDispatch('store-name') + export function useDispatch(store: T): TActions; + // types for "createRegistrySelector" are not correct export function createRegistrySelector< S extends typeof select,