From 99a795d495d666ba3da85d7d2df6a1a7f332d1d9 Mon Sep 17 00:00:00 2001 From: Luca Forstner Date: Thu, 28 Dec 2023 12:11:57 +0100 Subject: [PATCH] Update redux integration docs for newer Redux `configureStore` API (#8774) --- .../platforms/configuration/integrations/redux.mdx | 2 +- .../configuration/redux-init/javascript.mdx | 13 ++++++++++--- .../configuration/redux-init/react-native.mdx | 13 ++++++++++--- .../javascript/guides/react/features/redux.mdx | 4 +--- 4 files changed, 22 insertions(+), 10 deletions(-) diff --git a/src/includes/platforms/configuration/integrations/redux.mdx b/src/includes/platforms/configuration/integrations/redux.mdx index f04ba24ea75e6..3166ae15eba07 100644 --- a/src/includes/platforms/configuration/integrations/redux.mdx +++ b/src/includes/platforms/configuration/integrations/redux.mdx @@ -1,6 +1,6 @@ -If you have other enhancers or middleware such as `thunk`: +If you are using the deprecated `createStore` API and have other enhancers or middleware such as `thunk`: ```javascript const store = createStore( diff --git a/src/platform-includes/configuration/redux-init/javascript.mdx b/src/platform-includes/configuration/redux-init/javascript.mdx index b6a31fab03a1d..e68ba0b06faba 100644 --- a/src/platform-includes/configuration/redux-init/javascript.mdx +++ b/src/platform-includes/configuration/redux-init/javascript.mdx @@ -1,5 +1,5 @@ ```javascript -import { createStore, compose } from "redux"; +import { configureStore, createStore, compose } from "redux"; import * as Sentry from "@sentry/react"; // ... @@ -8,7 +8,14 @@ const sentryReduxEnhancer = Sentry.createReduxEnhancer({ // Optionally pass options listed below }); -const store = createStore(rootReducer, sentryReduxEnhancer); +// If you are using the `configureStore` API, pass the enhancer as follows: +const store = configureStore({ + reducer, + enhancers: (getDefaultEnhancers) => { + return getDefaultEnhancers().concat(sentryReduxEnhancer); + }, +}); -// ... +// If you are using the deprecated `createStore` API, pass the enhancer as follows: +const store = createStore(reducer, sentryReduxEnhancer); ``` diff --git a/src/platform-includes/configuration/redux-init/react-native.mdx b/src/platform-includes/configuration/redux-init/react-native.mdx index 8bcc44df6f612..51edd171b7fc3 100644 --- a/src/platform-includes/configuration/redux-init/react-native.mdx +++ b/src/platform-includes/configuration/redux-init/react-native.mdx @@ -1,5 +1,5 @@ ```javascript -import { createStore, compose } from "redux"; +import { configureStore, createStore, compose } from "redux"; import * as Sentry from "@sentry/react-native"; // ... @@ -8,7 +8,14 @@ const sentryReduxEnhancer = Sentry.createReduxEnhancer({ // Optionally pass options listed below }); -const store = createStore(rootReducer, sentryReduxEnhancer); +// If you are using the `configureStore` API, pass the enhancer as follows: +const store = configureStore({ + reducer, + enhancers: (getDefaultEnhancers) => { + return getDefaultEnhancers().concat(sentryReduxEnhancer); + }, +}); -// ... +// If you are using the deprecated `createStore` API, pass the enhancer as follows: +const store = createStore(reducer, sentryReduxEnhancer); ``` diff --git a/src/platforms/javascript/guides/react/features/redux.mdx b/src/platforms/javascript/guides/react/features/redux.mdx index d61fdb0ad1581..68865211bccfe 100644 --- a/src/platforms/javascript/guides/react/features/redux.mdx +++ b/src/platforms/javascript/guides/react/features/redux.mdx @@ -6,9 +6,7 @@ redirect_from: - /platforms/javascript/guides/react/configuration/integrations/redux/ --- -_(Available in version 5.20.0 and above)_ - -Redux support is included in the `@sentry/react` package since version `5.20.0`. To apply Sentry to Redux, use `Sentry.createReduxEnhancer` at the same place that you initialize your Redux store. +To capture Redux state data, use `Sentry.createReduxEnhancer` in the same place that you initialize your Redux store.