diff --git a/app/soapbox/containers/soapbox.js b/app/soapbox/containers/soapbox.js index 7f18e8b61..b3b07b9be 100644 --- a/app/soapbox/containers/soapbox.js +++ b/app/soapbox/containers/soapbox.js @@ -27,7 +27,7 @@ import { INTRODUCTION_VERSION } from '../actions/onboarding'; import { preload } from '../actions/preload'; import ErrorBoundary from '../components/error_boundary'; import UI from '../features/ui'; -import configureStore from '../store/configureStore'; +import { store } from '../store'; const validLocale = locale => Object.keys(messages).includes(locale); @@ -39,8 +39,6 @@ const isInstanceLoaded = state => { return v !== '0.0.0' || fetchFailed; }; -export const store = configureStore(); - // Configure global functions for developers createGlobals(store); diff --git a/app/soapbox/hooks/index.ts b/app/soapbox/hooks/index.ts new file mode 100644 index 000000000..88f47b434 --- /dev/null +++ b/app/soapbox/hooks/index.ts @@ -0,0 +1 @@ +export { useAppSelector } from './useAppSelector'; diff --git a/app/soapbox/hooks/useAppSelector.ts b/app/soapbox/hooks/useAppSelector.ts new file mode 100644 index 000000000..576990079 --- /dev/null +++ b/app/soapbox/hooks/useAppSelector.ts @@ -0,0 +1,5 @@ +import { TypedUseSelectorHook, useSelector } from 'react-redux'; + +import { RootState } from 'soapbox/store'; + +export const useAppSelector: TypedUseSelectorHook = useSelector; diff --git a/app/soapbox/store.ts b/app/soapbox/store.ts new file mode 100644 index 000000000..4b34e45e2 --- /dev/null +++ b/app/soapbox/store.ts @@ -0,0 +1,23 @@ +import { composeWithDevTools } from '@redux-devtools/extension'; +import { createStore, applyMiddleware } from 'redux'; +import thunk from 'redux-thunk'; + +import errorsMiddleware from './middleware/errors'; +import soundsMiddleware from './middleware/sounds'; +import appReducer from './reducers'; + +export const store = createStore( + appReducer, + composeWithDevTools( + applyMiddleware( + thunk, + errorsMiddleware(), + soundsMiddleware(), + ), + ), +); + +// Infer the `RootState` and `AppDispatch` types from the store itself +// https://redux.js.org/usage/usage-with-typescript +export type RootState = ReturnType; +export type AppDispatch = typeof store.dispatch; diff --git a/app/soapbox/store/configureStore.ts b/app/soapbox/store/configureStore.ts deleted file mode 100644 index aee34e919..000000000 --- a/app/soapbox/store/configureStore.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { composeWithDevTools } from '@redux-devtools/extension'; -import { createStore, applyMiddleware } from 'redux'; -import thunk from 'redux-thunk'; - -import errorsMiddleware from '../middleware/errors'; -import soundsMiddleware from '../middleware/sounds'; -import appReducer from '../reducers'; - -export default function configureStore() { - return createStore( - appReducer, - composeWithDevTools( - applyMiddleware( - thunk, - errorsMiddleware(), - soundsMiddleware(), - ), - ), - ); -}