added modifyAll prop

Legitcode · Sep 23, 2015 · 567c5ec · 567c5ec
1 parent 841c9ca
commit 567c5ec
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 11 deletions.
diff --git a/README.md b/README.md
@@ -37,7 +37,8 @@ The component expects simple, regular ol' javascript objects inside of an array.
 
 ###Options
 
-**New in 0.2.7** `modify` accepts an object with keys equal to those in your rows object and the values are callbacks that will be called on rendering a row.
+`modify` accepts an object with keys equal to those in your rows object and the values are callbacks that will be called on rendering a row.
+Optionally, use `modifyAll` to change every item.
 
 **Example:**
 
@@ -57,6 +58,13 @@ render() {
     }}/>
   );
 }
+
+//optionally modifyAll rows:
+
+<Table
+rows={rows}
+modifyAll={this.modify}
+/>
 ~~~
 
 `capitalize` Optionally, turn off capitalization of header row. True by default.

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-legit-table",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "description": "the simplest table component out there",
   "main": "lib/table.js",
   "scripts": {
@@ -36,7 +36,7 @@
     "eslint": "^0.24.1",
     "eslint-plugin-react": "^2.7.0",
     "expect": "^1.8.0",
-    "legit-tests": "^0.3.4",
+    "legit-tests": "^0.4.1",
     "mocha": "^2.2.5",
     "mocha-babel": "^3.0.0",
     "react-hot-loader": "^1.3.0",

diff --git a/src/rows.jsx b/src/rows.jsx
@@ -5,7 +5,8 @@ export default class Rows extends React.Component{
 
   static propTypes = {
     rows: React.PropTypes.array,
-    modify: React.PropTypes.object
+    modify: React.PropTypes.object,
+    modifyAll: React.PropTypes.func
   }
 
   rows(){
@@ -17,7 +18,8 @@ export default class Rows extends React.Component{
 
       for(let item in row){
         let value = row[item]
-        if(this.props.modify[item]) value = this.props.modify[item](row[item], row)
+        if(this.props.modifyAll) value = this.props.modifyAll(row[item], row)
+        else if(this.props.modify[item]) value = this.props.modify[item](row[item], row)
 
         rowList.push(<td key={uniqueId(row[item])}>{value}</td>)
       }

diff --git a/src/table.jsx b/src/table.jsx
@@ -23,7 +23,7 @@ export default class Table extends React.Component{
     return (
       <table {...attributes}>
         <Head row={rows[0]} capitalize={capitalize} />
-        <Rows rows={rows} modify={modify || {}}/>
+        <Rows rows={rows} modify={modify || {}} {...this.props}/>
       </table>
     )
   }

diff --git a/tests/table.jsx b/tests/table.jsx
@@ -12,18 +12,18 @@ describe('Table component', () => {
   describe('#render', () => {
     it('should not render the component if the rows are empty', () => {
       Test(<Table rows={[]}/>, {shallow: true})
-      .test(({component}) => {
-        expect(component).to.be.null;
+      .test(({instance}) => {
+        expect(instance).to.be.null;
       })
     });
 
     it('should render the header and rows if the rows are not empty', () => {
       let rows = [{foo: "1"}]
 
       Test(<Table rows={rows}/>, {shallow: true})
-      .test(({component}) => {
-        let head = component.props.children[0],
-          tableRows = component.props.children[1];
+      .test(({instance}) => {
+        let head = instance.props.children[0],
+          tableRows = instance.props.children[1];
 
         expect(head.props).to.not.be.undefined;
         expect(tableRows.props).to.not.be.undefined;
@@ -43,5 +43,36 @@ describe('Table component', () => {
         expect(helpers.elements.td.props.children).to.be.equal('Name: zach')
       })
     })
+
+    it('should correctly modify all rows', () => {
+      let modify = (value) => {
+        return `yo ${value}`
+      }
+
+      Test(<Table rows={[{name: 'zach', job: 'awesome'}]} modifyAll={modify}/>)
+      .find('td')
+      .test(({td}) => {
+        expect(td[0].props.children).to.be.equal('yo zach')
+        expect(td[1].props.children).to.be.equal('yo awesome')
+      })
+    })
+
+    it('should modify all rows and ignore individual modify ', () => {
+      let modify = (value) => {
+        return `yo ${value}`
+      }
+
+      let modifyName = (value) => {
+        return `Name: ${value}`
+      }
+
+      Test(<Table rows={[{name: 'zach', job: 'awesome'}]} modifyAll={modify} modify={{name: modifyName}}/>)
+      .find('td')
+      .test(({td}) => {
+        expect(td[0].props.children).to.be.equal('yo zach')
+        expect(td[1].props.children).to.be.equal('yo awesome')
+      })
+    })
+
   });
 });