use preact

src/settings/components/index.jsx

@@ -1,10 +1,9 @@
 import './site.scss';
-import React from 'react';
-import PropTypes from 'prop-types';
+import { h, Component } from 'preact';
 import * as settingActions from 'settings/actions/setting';
 import * as validator from 'shared/validators/setting';
 
-class SettingsComponent extends React.Component {
+class SettingsComponent extends Component {
   constructor(props, context) {
     super(props, context);
 
@@ -84,8 +83,4 @@ class SettingsComponent extends React.Component {
   }
 }
 
-SettingsComponent.contextTypes = {
-  store: PropTypes.any,
-};
-
 export default SettingsComponent;

src/settings/index.jsx

@@ -1,5 +1,4 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
+import { h, render } from 'preact';
 import SettingsComponent from './components';
 import reducer from 'settings/reducers/setting';
 import Provider from 'shared/store/provider';
@@ -9,7 +8,7 @@ const store = createStore(reducer);
 
 document.addEventListener('DOMContentLoaded', () => {
   let wrapper = document.getElementById('vimvixen-settings');
-  ReactDOM.render(
+  render(
     <Provider store={store}>
       <SettingsComponent />
     </Provider>,

src/shared/store/provider.jsx

@@ -1,18 +1,15 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import { h, Component } from 'preact';
 
-class Provider extends React.PureComponent {
+class Provider extends Component {
   getChildContext() {
     return { store: this.props.store };
   }
 
   render() {
-    return React.Children.only(this.props.children);
+    return <div>
+      { this.props.children }
+    </div>;
   }
 }
 
-Provider.childContextTypes = {
-  store: PropTypes.any,
-};
-
 export default Provider;