Skip to content
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.

Sign up for GitHub

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

Deprecations before v4 #715

Closed
wants to merge 5 commits into from
Closed

Deprecations before v4 #715

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
28b66c6
devtools: deprecate passing name directly instead of an object
devanshj Dec 16, 2021
b42b37f
context: rename `useStoreApi` to `useStoreRef`
devanshj Dec 16, 2021
b5be4ac
type deprecations
devanshj Dec 16, 2021
1de740e
console.warn when using `useStoreApi`
devanshj Dec 21, 2021
7e3582b
fix lint
devanshj Dec 22, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 15 additions & 1 deletion src/context.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,10 +95,24 @@ function createContext<
)
}

let didWarnAboutStoreApiDeprecation = false

return {
Provider,
useStore,
useStoreApi,
/**
* @deprecated `useStoreApi` is renamed to `useStoreRef`, `useStoreApi` will be removed in next major
*/
useStoreApi: (...a: Parameters<typeof useStoreApi>) => {
if (!didWarnAboutStoreApiDeprecation) {
console.warn(
'`useStoreApi` is renamed to `useStoreRef`, `useStoreApi` will be removed in next major'
)
didWarnAboutStoreApiDeprecation = true
}
return useStoreApi(...a)
},
useStoreRef: useStoreApi,
}
}

Expand Down
122 changes: 93 additions & 29 deletions src/middleware/devtools.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,37 +41,92 @@ export type StoreApiWithDevtools<T extends State> = StoreApi<T> & {
devtools?: DevtoolsType
}

export const devtools =
<
S extends State,
CustomSetState extends SetState<S>,
CustomGetState extends GetState<S>,
CustomStoreApi extends StoreApi<S>
>(
fn: (set: NamedSet<S>, get: CustomGetState, api: CustomStoreApi) => S,
options?:
| string
| {
name?: string
anonymousActionType?: string
serialize?: {
options:
| boolean
| {
date?: boolean
regex?: boolean
undefined?: boolean
nan?: boolean
infinity?: boolean
error?: boolean
symbol?: boolean
map?: boolean
set?: boolean
}
/**
* @deprecated Passing `name` as directly will be not allowed in next major.
* Pass the `name` in an object `{ name: ... }` instead
*/
export function devtools<
S extends State,
CustomSetState extends SetState<S>,
CustomGetState extends GetState<S>,
CustomStoreApi extends StoreApi<S>
>(
fn: (set: NamedSet<S>, get: CustomGetState, api: CustomStoreApi) => S,
options?: string
): (
set: CustomSetState,
get: CustomGetState,
api: CustomStoreApi &
StoreApiWithDevtools<S> & {
dispatch?: unknown
dispatchFromDevtools?: boolean
}
) => S
export function devtools<
S extends State,
CustomSetState extends SetState<S>,
CustomGetState extends GetState<S>,
CustomStoreApi extends StoreApi<S>
>(
fn: (set: NamedSet<S>, get: CustomGetState, api: CustomStoreApi) => S,
options?: {
name?: string
anonymousActionType?: string
serialize?: {
options:
| boolean
| {
date?: boolean
regex?: boolean
undefined?: boolean
nan?: boolean
infinity?: boolean
error?: boolean
symbol?: boolean
map?: boolean
set?: boolean
}
}
}
): (
set: CustomSetState,
get: CustomGetState,
api: CustomStoreApi &
StoreApiWithDevtools<S> & {
dispatch?: unknown
dispatchFromDevtools?: boolean
}
) => S
export function devtools<
S extends State,
CustomSetState extends SetState<S>,
CustomGetState extends GetState<S>,
CustomStoreApi extends StoreApi<S>
>(
fn: (set: NamedSet<S>, get: CustomGetState, api: CustomStoreApi) => S,
options?:
| string
| {
name?: string
anonymousActionType?: string
serialize?: {
options:
| boolean
| {
date?: boolean
regex?: boolean
undefined?: boolean
nan?: boolean
infinity?: boolean
error?: boolean
symbol?: boolean
map?: boolean
set?: boolean
}
}
) =>
(
}
) {
return (
set: CustomSetState,
get: CustomGetState,
api: CustomStoreApi &
Expand All @@ -80,6 +135,14 @@ export const devtools =
dispatchFromDevtools?: boolean
}
): S => {
let didWarnAboutNameDeprecation = false
if (typeof options === 'string' && !didWarnAboutNameDeprecation) {
console.warn(
'[zustand devtools middleware]: passing `name` as directly will be not allowed in next major' +
'pass the `name` in an object `{ name: ... }` instead'
)
didWarnAboutNameDeprecation = true
}
const devtoolsOptions =
options === undefined
? { name: undefined, anonymousActionType: undefined }
Expand Down Expand Up @@ -262,6 +325,7 @@ export const devtools =

return initialState
}
}

const parseJsonThen = <T>(stringified: string, f: (parsed: T) => void) => {
let parsed: T | undefined
Expand Down
75 changes: 75 additions & 0 deletions src/vanilla.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,18 @@
/**
* @deprecated `State` is renamed to `UnknownState`,
* `State` will be removed in next major
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would wanted to drop State entirely, and not even export UnknownState.
But, this will probably be too big change, so let's keep it.

I would even want to make it unknown. If it were possible, we could consider dropping.

*/
export type State = object

export type UnknownState = object

// types inspired by setState from React, see:
// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/6c49e45842358ba59a508e13130791989911430d/types/react/v16/index.d.ts#L489-L495
/**
* @deprecated Use the builtin `Partial<T>` instead of `PartialState<T>`.
* Additionally turn on `--exactOptionalPropertyTypes` tsc flag.
* `PartialState` will be removed in next major
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, this has been troublesome and happy to drop it.

*/
export type PartialState<
T extends State,
K1 extends keyof T = keyof T,
Expand All @@ -10,10 +22,35 @@ export type PartialState<
> =
| (Pick<T, K1> | Pick<T, K2> | Pick<T, K3> | Pick<T, K4> | T)
| ((state: T) => Pick<T, K1> | Pick<T, K2> | Pick<T, K3> | Pick<T, K4> | T)

/**
* @deprecated Use `(t: T) => U` instead of `StateSelector<T, U>`.
* `StateSelector` will be removed in next major.
*/
export type StateSelector<T extends State, U> = (state: T) => U

/**
* @deprecated Use `(a: T, b: T) => boolean` instead of `EqualityChecker<T>.
* `EqualityChecker` will be removed in next major.
*/
export type EqualityChecker<T> = (state: T, newState: T) => boolean

/**
* @deprecated Use `(state: T, prevState: T) => void` instead of `StateListener<T>`.
* `StateListener` will be removed in next major.
*/
export type StateListener<T> = (state: T, previousState: T) => void
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For StateSelector, EqualityChecker and StateListener, I'm not sure what will happen. I guess many users use them. They might not be necessary nor best named, but not too confusing. So, for now I lean to keep them.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can try there three actually, and see if someone gets confused.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can try there three actually, and see if someone gets confused.

Did you thought about this and decided that if you want to keep them or not?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's keep them.
I saw some tweets and codesandboxes and know people use them.
If we were to remove those, it would be v5 (taking migration period longer like a few months to a year), which will not happen any time soon.


/**
* @deprecated Use `(slice: T, prevSlice: T) => void` instead of `StateSliceListener<T>`.
* `StateSliceListener` will be removed in next major.
*/
export type StateSliceListener<T> = (slice: T, previousSlice: T) => void
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think my plan was to drop this in #604. I don't know why I didn't. Let's drop this at least from vanilla.ts.


/**
* @deprecated Use `Store<T>['subscribe']` instead of `Subscribe<T>`.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't dislike this, but people would get confused. Better to stay. Same for SetState and GetState.

* `Subscribe` will be removed in next major.
*/
export type Subscribe<T extends State> = {
(listener: StateListener<T>): () => void
/**
Expand All @@ -26,6 +63,10 @@ export type Subscribe<T extends State> = {
): () => void
}

/**
* @deprecated Use `Store<T>['setState']` instead of `SetState<T>`
* `SetState` will be removed in next major.
*/
export type SetState<T extends State> = {
<
K1 extends keyof T,
Expand All @@ -37,21 +78,55 @@ export type SetState<T extends State> = {
replace?: boolean
): void
}

/**
* @deprecated Use `() => T` or `Store<T>['getState']` instead of `GetState<T>`
* `GetState` will be removed in next major.
*/
export type GetState<T extends State> = () => T

/**
* @deprecated Use `() => void` or `Store<UnknownState>['destroy']` instead of `Destroy`.
* `Destroy` will be removed in next major.
*/
export type Destroy = () => void
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm fine to drop this. Not many people should be using.


/**
* @deprecated `StoreApi<T>` has been renamed to `Store<T>`
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know you don't like this, but let's keep it.

* `StoreApi` will be removed in next major.
*/
export type StoreApi<T extends State> = {
setState: SetState<T>
getState: GetState<T>
subscribe: Subscribe<T>
destroy: Destroy
}

export type Store<T extends State> = {
setState: SetState<T>
getState: GetState<T>
subscribe: Subscribe<T>
destroy: Destroy
}

/**
* @deprecated `StateCreator` has been renamed to `StoreInitializer`.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's keep this.

* `StateCreator` will be removed in next major.
*/
export type StateCreator<
T extends State,
CustomSetState = SetState<T>,
CustomGetState = GetState<T>,
CustomStoreApi extends StoreApi<T> = StoreApi<T>
> = (set: CustomSetState, get: CustomGetState, api: CustomStoreApi) => T

export type StoreInitializer<
T extends State,
CustomSetState = SetState<T>,
CustomGetState = GetState<T>,
CustomStoreApi extends StoreApi<T> = StoreApi<T>
> = (set: CustomSetState, get: CustomGetState, api: CustomStoreApi) => T

function createStore<
TState extends State,
CustomSetState,
Expand Down