Skip to content

Commit

Permalink
Added spec
Browse files Browse the repository at this point in the history
  • Loading branch information
@vera-liu
vera-liu committed Sep 20, 2016
1 parent a9f6cd1 commit ad318ee
Show file tree
Hide file tree
Showing 12 changed files with 331 additions and 238 deletions.
95 changes: 23 additions & 72 deletions caravel/assets/javascripts/SqlLab/reducers.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import shortid from 'shortid';
import * as actions from './actions';
import { now } from '../modules/dates';
import * as utils from '../../utils/reducerUtils';

const defaultQueryEditor = {
id: shortid.generate(),
Expand All @@ -23,68 +24,16 @@ 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 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]() {
const tabHistory = state.tabHistory.slice();
tabHistory.push(action.queryEditor.id);
const newState = Object.assign({}, state, { tabHistory });
return addToArr(newState, 'queryEditors', action.queryEditor);
return utils.addToArr(newState, 'queryEditors', action.queryEditor);
},
[actions.REMOVE_QUERY_EDITOR]() {
let newState = removeFromArr(state, 'queryEditors', action.queryEditor);
let newState = utils.removeFromArr(state, 'queryEditors', action.queryEditor);
// List of remaining queryEditor ids
const qeIds = newState.queryEditors.map((qe) => qe.id);
let th = state.tabHistory.slice();
Expand All @@ -101,24 +50,25 @@ export const sqlLabReducer = function (state, action) {
return Object.assign({}, initialState);
},
[actions.ADD_TABLE]() {
return addToArr(state, 'tables', action.table);
return utils.addToArr(state, 'tables', action.table);
},
[actions.EXPAND_TABLE]() {
return alterInArr(state, 'tables', action.table, { expanded: true });
return utils.alterInArr(state, 'tables', action.table, { expanded: true });
},
[actions.COLLAPSE_TABLE]() {
return alterInArr(state, 'tables', action.table, { expanded: false });
return utils.alterInArr(state, 'tables', action.table, { expanded: false });
},
[actions.REMOVE_TABLE]() {
return removeFromArr(state, 'tables', action.table);
return utils.removeFromArr(state, 'tables', action.table);
},
[actions.START_QUERY]() {
const newState = addToObject(state, 'queries', action.query);
const newState = utils.addToObject(state, 'queries', action.query);
const sqlEditor = { id: action.query.sqlEditorId };
return alterInArr(newState, 'queryEditors', sqlEditor, { latestQueryId: action.query.id });
return utils.alterInArr(
newState, 'queryEditors', sqlEditor, { latestQueryId: action.query.id });
},
[actions.STOP_QUERY]() {
return alterInObject(state, 'queries', action.query, { state: 'stopped' });
return utils.alterInObject(state, 'queries', action.query, { state: 'stopped' });
},
[actions.QUERY_SUCCESS]() {
const alts = {
Expand All @@ -128,11 +78,11 @@ export const sqlLabReducer = function (state, action) {
progress: 100,
endDttm: now(),
};
return alterInObject(state, 'queries', action.query, alts);
return utils.alterInObject(state, 'queries', action.query, alts);
},
[actions.QUERY_FAILED]() {
const alts = { state: 'failed', errorMessage: action.msg, endDttm: now() };
return alterInObject(state, 'queries', action.query, alts);
return utils.alterInObject(state, 'queries', action.query, alts);
},
[actions.SET_ACTIVE_QUERY_EDITOR]() {
const qeIds = state.queryEditors.map((qe) => qe.id);
Expand All @@ -144,28 +94,29 @@ export const sqlLabReducer = function (state, action) {
return state;
},
[actions.QUERY_EDITOR_SETDB]() {
return alterInArr(state, 'queryEditors', action.queryEditor, { dbId: action.dbId });
return utils.alterInArr(state, 'queryEditors', action.queryEditor, { dbId: action.dbId });
},
[actions.QUERY_EDITOR_SET_SCHEMA]() {
return alterInArr(state, 'queryEditors', action.queryEditor, { schema: action.schema });
return utils.alterInArr(state, 'queryEditors', action.queryEditor, { schema: action.schema });
},
[actions.QUERY_EDITOR_SET_TITLE]() {
return alterInArr(state, 'queryEditors', action.queryEditor, { title: action.title });
return utils.alterInArr(state, 'queryEditors', action.queryEditor, { title: action.title });
},
[actions.QUERY_EDITOR_SET_SQL]() {
return alterInArr(state, 'queryEditors', action.queryEditor, { sql: action.sql });
return utils.alterInArr(state, 'queryEditors', action.queryEditor, { sql: action.sql });
},
[actions.QUERY_EDITOR_SET_AUTORUN]() {
return alterInArr(state, 'queryEditors', action.queryEditor, { autorun: action.autorun });
return utils.alterInArr(
state, 'queryEditors', action.queryEditor, { autorun: action.autorun });
},
[actions.ADD_WORKSPACE_QUERY]() {
return addToArr(state, 'workspaceQueries', action.query);
return utils.addToArr(state, 'workspaceQueries', action.query);
},
[actions.REMOVE_WORKSPACE_QUERY]() {
return removeFromArr(state, 'workspaceQueries', action.query);
return utils.removeFromArr(state, 'workspaceQueries', action.query);
},
[actions.ADD_ALERT]() {
return addToArr(state, 'alerts', action.alert);
return utils.addToArr(state, 'alerts', action.alert);
},
[actions.SET_DATABASES]() {
const databases = {};
Expand All @@ -175,7 +126,7 @@ export const sqlLabReducer = function (state, action) {
return Object.assign({}, state, { databases });
},
[actions.REMOVE_ALERT]() {
return removeFromArr(state, 'alerts', action.alert);
return utils.removeFromArr(state, 'alerts', action.alert);
},
[actions.SET_NETWORK_STATUS]() {
if (state.networkOn !== action.networkOn) {
Expand Down
0 ...l/assets/javascripts/explorev2/actions.js → ...ripts/explorev2/actions/exploreActions.js
View file
File renamed without changes.
17 changes: 8 additions & 9 deletions caravel/assets/javascripts/explorev2/components/ChartContainer.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import React from 'react';
import { Panel } from 'react-bootstrap';

export default class ChartContainer extends React.Component {
render() {
return (
<Panel header="Chart title">
chart goes here
</Panel>
);
}
}
const ChartContainer = function () {
return (
<Panel header="Chart title">
chart goes here
</Panel>
);
};
export default ChartContainer;
17 changes: 8 additions & 9 deletions caravel/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import React from 'react';
import { Panel } from 'react-bootstrap';

export default class ControlPanelsContainer extends React.Component {
render() {
return (
<Panel>
control panels here
</Panel>
);
}
}
const ControlPanelsContainer = function () {
return (
<Panel>
control panels here
</Panel>
);
};
export default ControlPanelsContainer;
38 changes: 19 additions & 19 deletions caravel/assets/javascripts/explorev2/components/ExploreViewContainer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,24 +3,24 @@ import ChartContainer from './ChartContainer';
import ControlPanelsContainer from './ControlPanelsContainer';
import QueryAndSaveButtons from './QueryAndSaveButtons';

export default class ExploreViewContainer extends React.Component {
render() {
return (
<div className="container-fluid">
<div className="row">
<div className="col-sm-3">
<QueryAndSaveButtons
canAdd="True"
onQuery={() => { console.log('clicked query'); }}
/>
<br /><br />
<ControlPanelsContainer />
</div>
<div className="col-sm-9">
<ChartContainer />
</div>
const ExploreViewContainer = function () {
return (
<div className="container-fluid">
<div className="row">
<div className="col-sm-3">
<QueryAndSaveButtons
canAdd="True"
onQuery={() => { console.log('clicked query'); }}
/>
<br /><br />
<ControlPanelsContainer />
</div>
<div className="col-sm-9">
<ChartContainer />
</div>
</div>
);
}
}
</div>
);
};

export default ExploreViewContainer;
4 changes: 3 additions & 1 deletion caravel/assets/javascripts/explorev2/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,13 @@ import ExploreViewContainer from './components/ExploreViewContainer';
import { compose, createStore } from 'redux';
import { Provider } from 'react-redux';

import { initialState } from './stores/store';

const exploreViewContainer = document.getElementById('js-explore-view-container');
const bootstrapData = exploreViewContainer.getAttribute('data-bootstrap');


import { initialState, exploreReducer } from './reducers';
import { exploreReducer } from './reducers/exploreReducer';
import persistState from 'redux-localstorage';

let enhancer = compose(persistState());
Expand Down
Loading

0 comments on commit ad318ee

Please sign in to comment.