From 684564459e4d03578943fd7f5ad883deededc5e6 Mon Sep 17 00:00:00 2001 From: Hopding Date: Fri, 17 Mar 2017 09:42:30 -0500 Subject: [PATCH 1/6] Fixed bootstrap column width --- src/containers/AppBody.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/containers/AppBody.jsx b/src/containers/AppBody.jsx index 50fd687..1a446c8 100644 --- a/src/containers/AppBody.jsx +++ b/src/containers/AppBody.jsx @@ -36,7 +36,7 @@ export class AppBody extends React.Component {
-
+
Date: Fri, 17 Mar 2017 10:04:29 -0500 Subject: [PATCH 2/6] Fixed rendering of filters on snippet loading --- src/components/RuleLabel.jsx | 8 ++------ src/components/RulesSelector.jsx | 3 ++- 2 files changed, 4 insertions(+), 7 deletions(-) diff --git a/src/components/RuleLabel.jsx b/src/components/RuleLabel.jsx index 9c7c5c9..f5cca1f 100644 --- a/src/components/RuleLabel.jsx +++ b/src/components/RuleLabel.jsx @@ -22,21 +22,16 @@ const styles = { class RuleLabel extends React.Component { constructor(props) { super(props); - this.state = { - isActive: false, - } } render() { - const { color, rule, count, onClick } = this.props; - const { isActive } = this.state; + const { color, rule, count, onClick, isActive } = this.props; const backgroundColor = isActive ? color : 'transparent'; const borderColor = isActive ? 'transparent' : '#e6e6e6' // light grey return (
{ - this.setState({ isActive: !isActive }); onClick(); }} > @@ -53,5 +48,6 @@ RuleLabel.propTypes = { color: PropTypes.string.isRequired, rule: PropTypes.string.isRequired, count: PropTypes.string.isRequired, + isActive: PropTypes.bool.isRequired, onClick: PropTypes.func.isRequired, } \ No newline at end of file diff --git a/src/components/RulesSelector.jsx b/src/components/RulesSelector.jsx index 0d4dd49..94c01b6 100644 --- a/src/components/RulesSelector.jsx +++ b/src/components/RulesSelector.jsx @@ -17,14 +17,15 @@ const makeListItems = (filters, onRuleSelected) => { color, count, prettyTokenName, + selected, } = filters[filterName]; return ( { onRuleSelected(filterName) }} /> ); From 1eb336dad037891d0bcd8034e15f0ab9b104451d Mon Sep 17 00:00:00 2001 From: Hopding Date: Fri, 17 Mar 2017 10:06:44 -0500 Subject: [PATCH 3/6] Made a functional component --- src/components/RuleLabel.jsx | 35 +++++++++++++++-------------------- 1 file changed, 15 insertions(+), 20 deletions(-) diff --git a/src/components/RuleLabel.jsx b/src/components/RuleLabel.jsx index f5cca1f..924f7b3 100644 --- a/src/components/RuleLabel.jsx +++ b/src/components/RuleLabel.jsx @@ -19,27 +19,22 @@ const styles = { }, } -class RuleLabel extends React.Component { - constructor(props) { - super(props); - } +const RuleLabel = () => { + const { color, rule, count, onClick, isActive } = this.props; + const backgroundColor = isActive ? color : 'transparent'; + const borderColor = isActive ? 'transparent' : '#e6e6e6' // light grey - render() { - const { color, rule, count, onClick, isActive } = this.props; - const backgroundColor = isActive ? color : 'transparent'; - const borderColor = isActive ? 'transparent' : '#e6e6e6' // light grey - return ( -
{ - onClick(); - }} - > - {rule} - {`(${count})`} -
- ); - } + return ( +
{ + onClick(); + }} + > + {rule} + {`(${count})`} +
+ ); } export default RuleLabel From 95789cdbbb36afe5a642822fb9f353fb24661b20 Mon Sep 17 00:00:00 2001 From: Hopding Date: Fri, 17 Mar 2017 10:08:07 -0500 Subject: [PATCH 4/6] Fixed typo in error snackbar --- src/containers/SnippetArea.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/containers/SnippetArea.jsx b/src/containers/SnippetArea.jsx index 40f7341..9e9982a 100644 --- a/src/containers/SnippetArea.jsx +++ b/src/containers/SnippetArea.jsx @@ -89,7 +89,7 @@ export class SnippetArea extends React.Component { const { snippetTitle, appState } = this.props; if (!snippetTitle) { this.setState({ titleErrorText: 'This field is required' }); - this.showSnackbar('Please the title field before saving.'); + this.showSnackbar('Please populate the title field before saving.'); return; } this.setState({ titleErrorText: '' }); @@ -120,7 +120,7 @@ export class SnippetArea extends React.Component { const { snippetTitle, appState } = this.props; if (!snippetTitle) { this.setState({ titleErrorText: 'This field is required' }); - this.showSnackbar('Please the title field before saving.'); + this.showSnackbar('Please populate the title field before saving.'); return; } this.setState({ titleErrorText: '' }); From c1babf568305d1361468432d5e1ba2d57f10a200 Mon Sep 17 00:00:00 2001 From: Hopding Date: Fri, 17 Mar 2017 10:57:01 -0500 Subject: [PATCH 5/6] WIP, snippets do not currently save --- __tests__/components/RuleLabel.test.jsx | 10 +++++++--- .../__snapshots__/RulesSelector.test.jsx.snap | 2 ++ server/server.js | 1 + src/components/RuleLabel.jsx | 7 ++----- src/components/RulesSelector.jsx | 2 +- 5 files changed, 13 insertions(+), 9 deletions(-) diff --git a/__tests__/components/RuleLabel.test.jsx b/__tests__/components/RuleLabel.test.jsx index c68f4c1..1956db6 100644 --- a/__tests__/components/RuleLabel.test.jsx +++ b/__tests__/components/RuleLabel.test.jsx @@ -15,6 +15,7 @@ describe('', () => { color="" rule="" count="" + isActive={false} onClick={jest.fn()} /> ); @@ -28,6 +29,7 @@ describe('', () => { color="" rule={rule} count={count} + isActive={false} onClick={jest.fn()} /> ); @@ -35,20 +37,21 @@ describe('', () => { expect(wrapper.childAt(0).node).toBe(rule); expect(wrapper.childAt(1).childAt(0).node).toBe(`(${count})`); }); - it('toggles color when clicked', () => { + it('toggles color when isActive prop changes', () => { const color = '#000000'; const wrapper = shallowWithContext( ); expect(wrapper.props().style.backgroundColor).toBe('transparent'); - wrapper.simulate('click'); + wrapper.setProps({ isActive: true }); expect(wrapper.props().style.backgroundColor).toBe(color); - wrapper.simulate('click'); + wrapper.setProps({ isActive: false }); expect(wrapper.props().style.backgroundColor).toBe('transparent'); }); it('invokes the onClick callback prop', () => { @@ -58,6 +61,7 @@ describe('', () => { color={''} rule={''} count={''} + isActive={false} onClick={onClick} /> ); diff --git a/__tests__/components/__snapshots__/RulesSelector.test.jsx.snap b/__tests__/components/__snapshots__/RulesSelector.test.jsx.snap index 5a5906f..697ce3b 100644 --- a/__tests__/components/__snapshots__/RulesSelector.test.jsx.snap +++ b/__tests__/components/__snapshots__/RulesSelector.test.jsx.snap @@ -13,10 +13,12 @@ exports[` matches snapshot 1`] = `
diff --git a/server/server.js b/server/server.js index a056aef..ac01fae 100644 --- a/server/server.js +++ b/server/server.js @@ -29,6 +29,7 @@ const ASTTemplate = { type: _.isString, begin: _.isNumber, end: _.isNumber, + tags: _.isArray, children: _.isArray }; diff --git a/src/components/RuleLabel.jsx b/src/components/RuleLabel.jsx index 924f7b3..f1fb31b 100644 --- a/src/components/RuleLabel.jsx +++ b/src/components/RuleLabel.jsx @@ -19,17 +19,14 @@ const styles = { }, } -const RuleLabel = () => { - const { color, rule, count, onClick, isActive } = this.props; +const RuleLabel = ({ color, rule, count, onClick, isActive }) => { const backgroundColor = isActive ? color : 'transparent'; const borderColor = isActive ? 'transparent' : '#e6e6e6' // light grey return (
{ - onClick(); - }} + onClick={onClick} > {rule} {`(${count})`} diff --git a/src/components/RulesSelector.jsx b/src/components/RulesSelector.jsx index 94c01b6..bbe3dd5 100644 --- a/src/components/RulesSelector.jsx +++ b/src/components/RulesSelector.jsx @@ -26,7 +26,7 @@ const makeListItems = (filters, onRuleSelected) => { count={count} color={color} isActive={selected} - onClick={() => { onRuleSelected(filterName) }} + onClick={() => onRuleSelected(filterName)} /> ); }); From 1ad38217f146752ed558512de84e60f3e2a0edb8 Mon Sep 17 00:00:00 2001 From: JMH Date: Fri, 17 Mar 2017 11:10:16 -0500 Subject: [PATCH 6/6] Fix state objects not being validated by using _.similar instead of _.congruent --- server/server.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/server/server.js b/server/server.js index ac01fae..7b6b950 100644 --- a/server/server.js +++ b/server/server.js @@ -35,7 +35,7 @@ const ASTTemplate = { const validateAST = function(AST) { if (_.isString(AST)) { return true; } - return _.congruent(ASTTemplate, AST) && (AST.children && AST.children.every(validateAST)) + return _.similar(ASTTemplate, AST) && (AST.children && AST.children.every(validateAST)) } const requestTemplate = { @@ -57,7 +57,7 @@ app.use(express.static(path.resolve(__dirname, "..", 'build'))); function saveToRedis(id, req, res) { var json = JSON.parse(req.body.json); - if (_.isObject(json) && _.congruent(requestTemplate, json)) { + if (_.isObject(json) && _.similar(requestTemplate, json)) { redis.set(id, JSON.stringify(json)); res.json({id: id}); } else {