diff --git a/caravel/assets/javascripts/SqlLab/index.jsx b/caravel/assets/javascripts/SqlLab/index.jsx index 6c9bd25e8e..a4af9c4136 100644 --- a/caravel/assets/javascripts/SqlLab/index.jsx +++ b/caravel/assets/javascripts/SqlLab/index.jsx @@ -10,21 +10,15 @@ import TabbedSqlEditors from './components/TabbedSqlEditors'; import QueryAutoRefresh from './components/QueryAutoRefresh'; import Alerts from './components/Alerts'; -import { bindActionCreators, compose, createStore } from 'redux'; +import { bindActionCreators, createStore } from 'redux'; import { connect, Provider } from 'react-redux'; import { initialState, sqlLabReducer } from './reducers'; -import persistState from 'redux-localstorage'; +import { enhancer } from '../reduxUtils'; require('./main.css'); -let enhancer = compose(persistState()); -if (process.env.NODE_ENV === 'dev') { - enhancer = compose( - persistState(), window.devToolsExtension && window.devToolsExtension() - ); -} -let store = createStore(sqlLabReducer, initialState, enhancer); +let store = createStore(sqlLabReducer, initialState, enhancer()); // jquery hack to highlight the navbar menu $('a[href="/caravel/sqllab"]').parent().addClass('active'); diff --git a/caravel/assets/javascripts/SqlLab/reducers.js b/caravel/assets/javascripts/SqlLab/reducers.js index 8c0bb5c93a..b7a850c982 100644 --- a/caravel/assets/javascripts/SqlLab/reducers.js +++ b/caravel/assets/javascripts/SqlLab/reducers.js @@ -1,6 +1,8 @@ import shortid from 'shortid'; import * as actions from './actions'; import { now } from '../modules/dates'; +import { addToObject, alterInObject, alterInArr, removeFromArr, getFromArr, addToArr } + from '../reduxUtils.js'; const defaultQueryEditor = { id: shortid.generate(), @@ -23,68 +25,6 @@ export const initialState = { queriesLastUpdate: 0, }; -function addToObject(state, arrKey, obj) { - const newObject = Object.assign({}, state[arrKey]); - const copiedObject = Object.assign({}, obj); - - if (!copiedObject.id) { - copiedObject.id = shortid.generate(); - } - newObject[copiedObject.id] = copiedObject; - return Object.assign({}, state, { [arrKey]: newObject }); -} - -function alterInObject(state, arrKey, obj, alterations) { - const newObject = Object.assign({}, state[arrKey]); - newObject[obj.id] = Object.assign({}, newObject[obj.id], alterations); - return Object.assign({}, state, { [arrKey]: newObject }); -} - -function alterInArr(state, arrKey, obj, alterations) { - // Finds an item in an array in the state and replaces it with a - // new object with an altered property - const idKey = 'id'; - const newArr = []; - state[arrKey].forEach((arrItem) => { - if (obj[idKey] === arrItem[idKey]) { - newArr.push(Object.assign({}, arrItem, alterations)); - } else { - newArr.push(arrItem); - } - }); - return Object.assign({}, state, { [arrKey]: newArr }); -} - -function removeFromArr(state, arrKey, obj, idKey = 'id') { - const newArr = []; - state[arrKey].forEach((arrItem) => { - if (!(obj[idKey] === arrItem[idKey])) { - newArr.push(arrItem); - } - }); - return Object.assign({}, state, { [arrKey]: newArr }); -} - -function getFromArr(arr, id) { - let obj; - arr.forEach((o) => { - if (o.id === id) { - obj = o; - } - }); - return obj; -} - -function addToArr(state, arrKey, obj) { - const newObj = Object.assign({}, obj); - if (!newObj.id) { - newObj.id = shortid.generate(); - } - const newState = {}; - newState[arrKey] = [...state[arrKey], newObj]; - return Object.assign({}, state, newState); -} - export const sqlLabReducer = function (state, action) { const actionHandlers = { [actions.ADD_QUERY_EDITOR]() { diff --git a/caravel/assets/javascripts/reduxUtils.js b/caravel/assets/javascripts/reduxUtils.js new file mode 100644 index 0000000000..e247d0b9e8 --- /dev/null +++ b/caravel/assets/javascripts/reduxUtils.js @@ -0,0 +1,75 @@ +import shortid from 'shortid'; +import { compose } from 'redux'; +import persistState from 'redux-localstorage'; + +export function addToObject(state, arrKey, obj) { + const newObject = Object.assign({}, state[arrKey]); + const copiedObject = Object.assign({}, obj); + + if (!copiedObject.id) { + copiedObject.id = shortid.generate(); + } + newObject[copiedObject.id] = copiedObject; + return Object.assign({}, state, { [arrKey]: newObject }); +} + +export function alterInObject(state, arrKey, obj, alterations) { + const newObject = Object.assign({}, state[arrKey]); + newObject[obj.id] = Object.assign({}, newObject[obj.id], alterations); + return Object.assign({}, state, { [arrKey]: newObject }); +} + +export function alterInArr(state, arrKey, obj, alterations) { + // Finds an item in an array in the state and replaces it with a + // new object with an altered property + const idKey = 'id'; + const newArr = []; + state[arrKey].forEach((arrItem) => { + if (obj[idKey] === arrItem[idKey]) { + newArr.push(Object.assign({}, arrItem, alterations)); + } else { + newArr.push(arrItem); + } + }); + return Object.assign({}, state, { [arrKey]: newArr }); +} + +export function removeFromArr(state, arrKey, obj, idKey = 'id') { + const newArr = []; + state[arrKey].forEach((arrItem) => { + if (!(obj[idKey] === arrItem[idKey])) { + newArr.push(arrItem); + } + }); + return Object.assign({}, state, { [arrKey]: newArr }); +} + +export function getFromArr(arr, id) { + let obj; + arr.forEach((o) => { + if (o.id === id) { + obj = o; + } + }); + return obj; +} + +export function addToArr(state, arrKey, obj) { + const newObj = Object.assign({}, obj); + if (!newObj.id) { + newObj.id = shortid.generate(); + } + const newState = {}; + newState[arrKey] = [...state[arrKey], newObj]; + return Object.assign({}, state, newState); +} + +export function enhancer() { + let enhancerWithPersistState = compose(persistState()); + if (process.env.NODE_ENV === 'dev') { + enhancerWithPersistState = compose( + persistState(), window.devToolsExtension && window.devToolsExtension() + ); + } + return enhancerWithPersistState; +}