Skip to content

Commit

Permalink
redux persist config
Browse files Browse the repository at this point in the history
  • Loading branch information
dayhaysoos committed Mar 6, 2021
1 parent 49aeb07 commit fcea46a
Show file tree
Hide file tree
Showing 3 changed files with 41 additions and 30 deletions.
28 changes: 26 additions & 2 deletions use-shopping-cart/core/store.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,17 @@ import { configureStore } from '@reduxjs/toolkit'
import { reducer, actions, cartInitialState } from './slice'
import { isClient } from '../utilities/SSR'
import { handleStripe } from './stripe-middleware'
import {
persistStore,
persistReducer,
FLUSH,
REHYDRATE,
PAUSE,
PERSIST,
PURGE,
REGISTER
} from 'redux-persist'
import storage from 'redux-persist/lib/storage'

export const formatCurrencyString = ({
value,
Expand Down Expand Up @@ -29,11 +40,24 @@ export const formatCurrencyString = ({
}

export { reducer, actions }

export function createShoppingCartStore(options) {
const persistConfig = {
key: 'root',
version: 1,
storage
}

const persistedReducer = persistReducer(persistConfig, reducer)

return configureStore({
reducer,
reducer: persistedReducer,
preloadedState: { ...cartInitialState, ...options },
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware().concat(handleStripe)
getDefaultMiddleware({
serializableCheck: {
ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER]
}
}).concat(handleStripe)
})
}
16 changes: 14 additions & 2 deletions use-shopping-cart/react/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,11 @@ import { actions, cartInitialState } from '../core/slice'
import { createShoppingCartStore } from '../core/store'
import { createDispatchHook, createSelectorHook, Provider } from 'react-redux'
import { bindActionCreators } from '@reduxjs/toolkit'
import { checkoutHandler, filterCart } from '../utilities/old-utils'
import { filterCart } from '../utilities/old-utils'
//TODO figure out how to apply formatCurrencyString
import { formatCurrencyString } from '../core/store'
import { PersistGate } from 'redux-persist/integration/react'
import { persistStore } from 'redux-persist'

export { actions, filterCart, formatCurrencyString }
export const CartContext = React.createContext(cartInitialState)
Expand All @@ -14,10 +16,20 @@ export const useDispatch = createDispatchHook(CartContext)

export function CartProvider({ children, ...props }) {
const store = React.useMemo(() => createShoppingCartStore(props), [props])
const persistor = persistStore(store)

return (
<Provider context={CartContext} store={store}>
{children}
<PersistGate
persistor={persistor}
children={(bootstrapped) => {
if (!bootstrapped) {
return <h1>Loading . . . </h1>
}

return children
}}
/>
</Provider>
)
}
Expand Down
27 changes: 1 addition & 26 deletions use-shopping-cart/utilities/old-utils.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,32 +5,7 @@ import {
} from '../core/store'

describe('getCheckoutData', () => {
const cart = {
cartDetails: {
sku1: { quantity: 1, price: 100 },
sku2: { quantity: 2, price: 150 },
sku3: { quantity: 3, price: 50 }
},
totalPrice: 550, // 100 * 1 + 150 * 2 + 50 * 3
cartCount: 6,
successUrl: 'https://example.com/sucess',
cancelUrl: 'https://example.com/'
}

it('stripe()', () => {
expect(getCheckoutData.stripe(cart)).toEqual({
billingAddressCollection: 'auto',
successUrl: cart.successUrl,
cancelUrl: cart.cancelUrl,
mode: 'payment',
lineItems: [
{ quantity: 1, price: 'sku1' },
{ quantity: 2, price: 'sku2' },
{ quantity: 3, price: 'sku3' }
],
submitType: 'auto'
})
})
it.todo('Write tests for getCheckoutData')
})

describe('formatCurrencyString()', () => {
Expand Down

0 comments on commit fcea46a

Please sign in to comment.