diff --git a/legacy-js/components/email.js b/legacy-js/components/email.js
index 98be36f..0281eb6 100644
--- a/legacy-js/components/email.js
+++ b/legacy-js/components/email.js
@@ -2,8 +2,8 @@
var React = require('react');
-module.exports = React.createClass({
+module.exports = class extends React.Component {
render() {
return info@koodiklinikka.fi;
}
-});
+};
diff --git a/legacy-js/components/fader.js b/legacy-js/components/fader.js
index 0938ec5..080acf4 100644
--- a/legacy-js/components/fader.js
+++ b/legacy-js/components/fader.js
@@ -6,18 +6,16 @@ function clamp(min, max, value) {
return Math.min(Math.max(value, min), max);
}
-module.exports = React.createClass({
- getDefaultProps() {
- return {
- threshold: 100
- };
- },
- getInitialState() {
- return {
- opacity: 0
- };
- },
- onScroll() {
+module.exports = class extends React.Component {
+ static defaultProps = {
+ threshold: 100
+ };
+
+ state = {
+ opacity: 0
+ };
+
+ onScroll = () => {
var scrollableDistance = document.body.scrollHeight - window.innerHeight,
scrollTop = window.pageYOffset || document.documentElement.scrollTop,
distanceToBottom = scrollableDistance - scrollTop;
@@ -25,14 +23,17 @@ module.exports = React.createClass({
this.setState({
opacity: clamp(0, 1, distanceToBottom / this.props.threshold)
});
- },
+ };
+
componentDidMount() {
window.addEventListener('scroll', this.onScroll);
this.onScroll();
- },
+ }
+
componentWillUnmount() {
window.removeEventListener('scroll', this.onScroll);
- },
+ }
+
render() {
var style = {
opacity: this.state.opacity
@@ -42,4 +43,4 @@ module.exports = React.createClass({
)
}
-});
+};
diff --git a/legacy-js/components/feed.js b/legacy-js/components/feed.js
index d4c0070..d6aa4e7 100644
--- a/legacy-js/components/feed.js
+++ b/legacy-js/components/feed.js
@@ -14,12 +14,11 @@ function throwError(err) {
});
}
-module.exports = React.createClass({
- getInitialState() {
- return {
- messages: []
- };
- },
+module.exports = class extends React.Component {
+ state = {
+ messages: []
+ };
+
componentDidMount() {
request.get(api('feeds'))
@@ -34,7 +33,8 @@ module.exports = React.createClass({
messages: _(messages).sortBy('timestamp').reverse().value().slice(0, 40)
});
}).catch(throwError);
- },
+ }
+
render() {
var messages = this.state.messages.map((message, i) => {
@@ -70,4 +70,4 @@ module.exports = React.createClass({
{messages}
)
}
-});
+};
diff --git a/legacy-js/components/inviteForm.js b/legacy-js/components/inviteForm.js
index ed3a892..218b863 100644
--- a/legacy-js/components/inviteForm.js
+++ b/legacy-js/components/inviteForm.js
@@ -6,16 +6,15 @@ var classSet = require('classnames');
var api = require('../api');
var Loader = require('./loader');
-module.exports = React.createClass({
- getInitialState() {
- return {
- email: '',
- submitted: false,
- sending: false,
- error: null
- };
- },
- onSubmit(e) {
+module.exports = class extends React.Component {
+ state = {
+ email: '',
+ submitted: false,
+ sending: false,
+ error: null
+ };
+
+ onSubmit = (e) => {
e.preventDefault();
this.setState({
@@ -29,14 +28,17 @@ module.exports = React.createClass({
})
.then(this.handleSuccess)
.catch(this.handleError);
- },
- handleSuccess() {
+ };
+
+ handleSuccess = () => {
this.setState({submitted: true, sending: false});
- },
- handleError(err) {
+ };
+
+ handleError = (err) => {
this.setState({error: err, sending: false});
- },
- onChange(e) {
+ };
+
+ onChange = (e) => {
if(e.target.value === this.state.email) {
return;
}
@@ -45,7 +47,8 @@ module.exports = React.createClass({
error: null,
submitted: false
});
- },
+ };
+
render() {
var formClasses = classSet({
'form': true,
@@ -106,4 +109,4 @@ module.exports = React.createClass({
);
}
-});
+};
diff --git a/legacy-js/components/members.js b/legacy-js/components/members.js
index a907016..76abe36 100644
--- a/legacy-js/components/members.js
+++ b/legacy-js/components/members.js
@@ -6,19 +6,19 @@ var _ = require('lodash');
var api = require('../api');
-module.exports = React.createClass({
- getInitialState() {
- return {
- members: []
- };
- },
+module.exports = class extends React.Component {
+ state = {
+ members: []
+ };
+
componentDidMount() {
request.get(api('members')).then(function(res) {
this.setState({
members: _.shuffle(res.data)
});
}.bind(this));
- },
+ }
+
render() {
var members = this.state.members.map(function(member, i) {
@@ -36,4 +36,4 @@ module.exports = React.createClass({
)
}
-});
+};
diff --git a/legacy-js/components/membershipForm.js b/legacy-js/components/membershipForm.js
index 9ca936e..4962048 100644
--- a/legacy-js/components/membershipForm.js
+++ b/legacy-js/components/membershipForm.js
@@ -1,15 +1,15 @@
import React from 'react';
import MembershipInfoForm from './membershipInfoForm';
-module.exports = React.createClass({
- getInitialState() {
- return {
- signupSuccess: false
- };
- },
- handleSignupSuccess() {
+module.exports = class extends React.Component {
+ state = {
+ signupSuccess: false
+ };
+
+ handleSignupSuccess = () => {
this.setState({ signupSuccess: true });
- },
+ };
+
render() {
if (!this.state.signupSuccess) {
return (
@@ -31,4 +31,4 @@ module.exports = React.createClass({
);
}
-});
+};
diff --git a/legacy-js/components/membershipInfoForm.js b/legacy-js/components/membershipInfoForm.js
index 727a30c..365ef80 100644
--- a/legacy-js/components/membershipInfoForm.js
+++ b/legacy-js/components/membershipInfoForm.js
@@ -29,20 +29,19 @@ function getUserInfo(state) {
return _.pick(state, fieldNames);
}
-module.exports = React.createClass({
- getInitialState() {
- return {
- address: "",
- city: "",
- email: "",
- handle: "",
- name: "",
- postcode: "",
- sending: false,
- pristineFields: fieldNames
- };
- },
- onSubmit() {
+module.exports = class extends React.Component {
+ state = {
+ address: "",
+ city: "",
+ email: "",
+ handle: "",
+ name: "",
+ postcode: "",
+ sending: false,
+ pristineFields: fieldNames
+ };
+
+ onSubmit = () => {
this.setState({
sending: true,
error: null
@@ -59,8 +58,9 @@ module.exports = React.createClass({
.catch(err => {
this.setState({ error: err, sending: false });
});
- },
- onChange(e) {
+ };
+
+ onChange = (e) => {
var name = e.target.name;
if (e.target.value === this.state[name]) {
return;
@@ -73,9 +73,9 @@ module.exports = React.createClass({
),
errors: []
});
- },
+ };
- getDataErrors() {
+ getDataErrors = () => {
var foundErrors = [];
fieldNames.forEach(fieldName => {
@@ -89,7 +89,7 @@ module.exports = React.createClass({
}
return foundErrors;
- },
+ };
render() {
const inputErrors = this.getDataErrors();
@@ -190,4 +190,4 @@ module.exports = React.createClass({
);
}
-});
+};