start to rewrite draft using preact

web/app/app.js

@@ -1,15 +1,11 @@
+import { h, render } from 'preact';
 import 'babel-polyfill'; // TODO: remove it
 import 'mimic'; // TODO: it's for dev only
 
 import './polyfills'; // TODO: check it
 
-import fetcher from './fetcher';
-import render from './render';
+import Root from './components/root';
 
 require('./main.scss');
 
-// TODO: add preloader
-// TODO: all of these settings must be optional params
-fetcher
-  .get('/find?url=https://radio-t.com/p/2017/12/16/podcast-576/&sort=time&format=tree')
-  .then(render);
+render(<Root />, document.getElementById('remark42'));

web/app/components/root/index.js

@@ -0,0 +1 @@
+export { default } from './root';

web/app/components/root/root.jsx

@@ -0,0 +1,22 @@
+import { Component } from 'preact';
+import fetcher from 'fetcher';
+
+export default class Root extends Component {
+  componentDidMount() {
+    // TODO: add preloader
+    // TODO: all of these settings must be optional params
+    fetcher
+      .get('/find?url=https://radio-t.com/p/2017/12/16/podcast-576/&sort=time&format=tree')
+      .then(this.loadData.bind(this));
+  }
+
+  loadData(data) {
+    this.setState({ data: JSON.stringify(data) })
+  }
+
+  render() {
+    const { data } = this.state;
+
+    return data;
+  }
+}

web/app/fetcher.js

@@ -1,5 +1,6 @@
 import './promises';
 
+// TODO: i think we need to use unfetch here instead of heavy axios
 import axios from 'axios';
 
 import { baseUrl, apiBase, siteId } from './settings';

web/app/promises.js

@@ -4,6 +4,7 @@ import Promise from 'promise-polyfill';
 Promise._unhandledRejectionFn = () => {};
 /* eslint-enable no-underscore-dangle */
 
+// TODO: need to figure out, do we really need finally?
 /* eslint-disable no-extend-native */
 Promise.prototype.finally = function finallyFn(callback) {
   const constructor = this.constructor;