fix(ColumnView): setState error

dispose wasn't being called due to componentWillUnmount typo
Climb-social · Mar 17, 2016 · f289c06 · f289c06
1 parent 62c55a9
commit f289c06
Show file tree

Hide file tree

Showing 8 changed files with 55 additions and 27 deletions.
diff --git a/example/index.html b/example/index.html
@@ -5,8 +5,4 @@
 <link href="https://npmcdn.com/[email protected]/css/basscss.min.css" rel="stylesheet">
 <body>
 <div id="container"></div>
-<script src="build/main.js"></script>
-<div class="Climb"
-     data-collection-id="56b4b06908216f0cac62a86b"
-     data-limit="3"
-     data-view="regularSQUAREview"></div>
+<script src="build/main.js"></script>
diff --git a/example/index.js b/example/index.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { ListView, ColumnView, RegularSquareView, ClimbView, StackedCard } from 'react-climb-social';
+import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
 
 import 'react-climb-social/styles/main.css';
 import './style.css';
@@ -13,25 +14,50 @@ const App = () => {
         React Climb Social
       </h1>
 
-      <ClimbView collectionId='56b4b06908216f0cac62a86b' Card={ StackedCard } />
+      <Tabs>
 
+        <TabList>
+          <Tab>Default</Tab>
+          <Tab>RegularSquareView</Tab>
+          <Tab>Custom formatting</Tab>
+          <Tab>ColumnView</Tab>
+          <Tab>HTML</Tab>
+        </TabList>
 
-       <ClimbView collectionId='56b4b06908216f0cac62a86b'
-                 View={ RegularSquareView } />
+        <TabPanel>
+          <ClimbView collectionId='56b4b06908216f0cac62a86b' Card={ StackedCard } />
+        </TabPanel>
 
-      <div className='sm-col sm-col-6 md-col-4 lg-col-3 px2'>
-        <h2>List View</h2>
+        <TabPanel>
+          <ClimbView collectionId='56b4b06908216f0cac62a86b'
+                     View={ RegularSquareView } />
+        </TabPanel>
 
-        <ClimbView collectionId='56b4b06908216f0cac62a86b'
-                   View={ ListView } />
+        <TabPanel>
+          <h2>List View</h2>
 
-      </div>
+          <ClimbView collectionId='56b4b06908216f0cac62a86b'
+                     View={ ListView } />
+
+
+        </TabPanel>
+
+        <TabPanel>
+          <h2>Column View</h2>
+          <ClimbView collectionId='56b4b06908216f0cac62a86b'
+                     View={ ColumnView } />
+
+        </TabPanel>
+
+        <TabPanel>
+          <div className="Climb"
+               data-collection-id="56b4b06908216f0cac62a86b"
+               data-limit="3"
+               data-view="columnView"></div>
+        </TabPanel>
+
+      </Tabs>
 
-      <div className='sm-col sm-col-6 md-col-8 lg-col-9 px2'>
-        <h2>Column View</h2>
-        <ClimbView collectionId='56b4b06908216f0cac62a86b'
-                   View={ ColumnView } />
-      </div>
 
     </div>
   );

diff --git a/example/webpack.config.js b/example/webpack.config.js
@@ -30,9 +30,7 @@ module.exports = {
         loaders: ['style-loader', 'css-loader']
       }
     ],
-    noParse: [
-      path.join(__dirname, '../node_modules/bricks.js/dist/bricks.min.js')
-    ]
+    noParse: [/bricks.js/]
   },
 
   resolve: {

diff --git a/package.json b/package.json
@@ -69,6 +69,7 @@
     "react-addons-test-utils": "^0.14.7",
     "react-dom": "^0.14.0",
     "react-hot-loader": "^1.2.3",
+    "react-tabs": "^0.5.3",
     "style-loader": "^0.13.0",
     "tape": "^4.4.0",
     "webpack": "^1.8.11",

diff --git a/src/styles/main.css b/src/styles/main.css
@@ -16,6 +16,11 @@
     background-size: cover;
 }
 
+.Climb--ColumnView {
+  margin-left: auto;
+  margin-right: auto;
+}
+
 .Climb--ColumnView .Climb__Card {
     width: 275px;
 }

diff --git a/src/views/ClimbView/ClimbView.js b/src/views/ClimbView/ClimbView.js
@@ -27,7 +27,7 @@ class ClimbView extends React.Component {
       });
   }
 
-  componentWillUnMount() {
+  componentWillUnmount() {
     this.subscription.dispose();
   }
 

diff --git a/src/views/ColumnView/ColumnView.js b/src/views/ColumnView/ColumnView.js
@@ -30,7 +30,7 @@ class ColumnView extends React.Component {
       });
   }
 
-  componentWillUnMount() {
+  componentWillUnmount() {
     this.subscription.dispose();
   }
 

diff --git a/webpack.config.js b/webpack.config.js
@@ -12,12 +12,14 @@ module.exports = {
       { test: /\.js$/, loader: 'eslint', exclude: /node_modules/ }
     ],
     loaders: [
-      { test: /\.js$/, loader: 'babel', exclude: /node_modules/ },
+      {
+        test: /\.js$/,
+        loader: 'babel',
+        exclude: /node_modules/
+      },
       { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader', 'postcss-loader'), exclude: /node_modules/ }
     ],
-    noParse: [
-      path.join(__dirname, './node_modules/bricks.js/dist/bricks.min.js')
-    ]
+    noParse: [/bricks.js/]
   },
   postcss: function (webpack) {
     return [
-Original file line number
+Diff line change
@@ Expand Up / @@ -27,7 +27,7 @@ class ClimbView extends React.Component { @@
           });
       }
-      componentWillUnMount() {
+      componentWillUnmount() {
         this.subscription.dispose();
       }
@@ Expand Down @@