View pathless-routes-with-redux-first-router.js
import api from './api'
const routesMap = {
HOME: '/', // path only route
LIST: { // route object (with a path)
path: '/list/:slug',
thunk: async (dispatch, getState) => {
const { slug } = getState().location.payload
const response = await fetch(`/api/items/${slug}`)
const items = await data.json()
View redux-first-router-confirm-leave.js
const history = createHistory({
getUserConfirmation(message, callback) {
confirmationDialog(message, (res) => {
shouldChange = !!res
callback(res)
})
}
})
history.block((location, action) => {
View routesMap-with-arbitrary-key-val.js
const routesMap = {
ADMIN: {
path: '/admin',
role: 'admin'
}
}
View server-render-like-a-pro-12.js
const { ...theUsual, thunk, initialDispatch } = connectRoutes(
history,
routesMap, {
...options,
initialDispatch: isServer ? false : true
}
)
...
View server-render-like-a-pro-11.js
export default async (req, res) => {
const jwToken = req.cookies.jwToken
const preLoadedState = { jwToken }
const history = createHistory({ initialEntries: [req.path] })
const { store, thunk } = configureStore(history, preLoadedState)
...
View server-render-like-a-pro-10.js
// src/options.js
const options = {
onBeforeChange: (dispatch, getState, action) => {
const state = getState()
const user = userFromState(action.type, state)
if (!user) {
const action = redirect({ type: 'LOGIN' })
dispatch(action)
}
View server-render-like-a-pro-9.js
import { myThunkA, myThunkB } from '../src/actions/async'
export default async (req, res) => {
const history = createHistory({ initialEntries: [req.path] })
const { store, thunk } = configureStore(history)
await Promise.all([
store.dispatch(myThunkA),
store.dispatch(myThunkB)
])
View server-render-like-a-pro-8.js
import createHistory from 'history/createMemoryHistory'
import { NOT_FOUND } from 'redux-first-router'
import configureStore from '../src/configureStore'
export default async (req, res) => {
const history = createHistory({ initialEntries: [req.path] })
const { store, thunk } = configureStore(history)
let location = store.getState().location
if (doesRedirect(location, res)) return false
View server-render-like-a-pro-6.js
import { redirect } from 'redux-first-router'
import { isAllowed } from './utils'
const options = {
onBeforeChange: (dispatch, getState, action) => {
const allowed = isAllowed(action.type, getState())
if (!allowed) {
const action = redirect({ type: 'LOGIN' })
dispatch(action)
View server-render-like-a-pro-7.js
export default () => async (req, res, next) => {
const store = await configureStore(req, res)
if (!store) return
const app = <Provider store={store}><App /></Provider>
...