fetch -> axios

7 files changed, 101 insertions, 86 deletions

diff --git a/vnext/src/api/index.js b/vnext/src/api/index.js
new file mode 100644
index 00000000..130a5dc2
--- /dev/null
+++ b/vnext/src/api/index.js
@@ -0,0 +1,63 @@
+import axios from 'axios';
+
+const client = axios.create({
+    baseURL: 'https://api.juick.com/'
+});
+client.interceptors.request.use(config => {
+    if (localStorage.visitor) {
+        config.params = Object.assign(config.params || {}, {
+            hash: JSON.parse(localStorage.visitor).hash
+        });
+    }
+    return config;
+})
+
+export function auth(username, password) {
+    return new Promise((resolve, reject) => {
+        client.get('/me', {
+            headers: {
+                'Authorization': 'Basic ' + window.btoa(unescape(encodeURIComponent(username + ":" + password)))
+            }
+        }).then(response => {
+            localStorage.visitor = JSON.stringify(response.data);
+            resolve(response.data)
+        }).catch(reason => {
+            localStorage.clear()
+            reject(reason)
+        })
+    });
+}
+
+export function getChats() {
+    return client.get('/groups_pms')
+}
+
+export function getChat(userName) {
+    return client.get('/pm', {
+        params: {
+            'uname': userName
+        }
+    })
+}
+
+export function pm(userName, body) {
+    let form = new FormData();
+    form.set('uname', userName);
+    form.set('body', body);
+    return client.post('/pm', form)
+}
+
+export function getMessages(path, params) {
+    return client.get(path, {
+        params: params
+    })
+}
+
+export function comment(mid, rid, body, attach) {
+    let form = new FormData();
+    form.append('mid', mid);
+    form.append('rid', rid);
+    form.append('body', body);
+    form.append('attach', attach);
+    return client.post('/comment', form)
+}
\ No newline at end of file
diff --git a/vnext/src/components/Chat.js b/vnext/src/components/Chat.js
index 8f3a26c0..c7a5c3ff 100644
--- a/vnext/src/components/Chat.js
+++ b/vnext/src/components/Chat.js
@@ -4,6 +4,8 @@ import moment from 'moment';
 import PM from './PM';
 import MessageInput from './MessageInput';
 
+import { getChat, pm } from '../api';
+
 export default class Chat extends React.Component {
     constructor(props) {
         super(props);
@@ -22,30 +24,20 @@ export default class Chat extends React.Component {
             chats: []
         });
         if (hash && uname) {
-            fetch(`https://api.juick.com/pm?uname=${uname}&hash=${hash}`)
-                .then(response => response.json())
-                .then(jsonResponse => {
+            getChat(uname)
+                .then(response => {
                     this.setState({
-                        chats: jsonResponse
+                        chats: response.data
                     });
                 });
         }
     }
 
     onSend = (template) => {
-        const url = `https://api.juick.com/pm?hash=${this.props.visitor.hash}`;
-        let form = new FormData();
-        form.append('body', template.body);
-        form.append('uname', template.to.uname);
-        fetch(url, {
-            method: 'POST',
-            body: form
-        }).then(response => {
-            return response.json()
-        }).then(res => {
+        pm(template.to.uname, template.body)
+        .then(res => {
             this.loadChat(this.props.match.params.user);
-        })
-            .catch(console.log)
+        }).catch(console.log)
     }
 
     render() {
diff --git a/vnext/src/components/Contacts.js b/vnext/src/components/Contacts.js
index 300e60eb..aea537d4 100644
--- a/vnext/src/components/Contacts.js
+++ b/vnext/src/components/Contacts.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Link } from 'react-router-dom';
+import { getChats } from '../api';
 
 
 import Contact from './Contact.js';
@@ -16,12 +16,11 @@ export default class Contacts extends React.Component {
     }
 
     refreshChats() {
-        fetch(`https://api.juick.com/groups_pms?hash=${this.props.visitor.hash}`)
-            .then(response => response.json())
-            .then(jsonResponse => {
+        getChats()
+            .then(response => {
                 this.setState({
                     isLoading: false,
-                    pms: jsonResponse.pms
+                    pms: response.data.pms
                 });
             });
     }
diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js
index 5e9c14d0..0a27ed3d 100644
--- a/vnext/src/components/Feeds.js
+++ b/vnext/src/components/Feeds.js
@@ -7,6 +7,8 @@ import moment from 'moment';
 import Message from './Message';
 import Spinner from './Spinner';
 
+import  { getMessages } from '../api';
+
 export function Discover(props) {
   const query = {
     baseUrl: "https://api.juick.com/messages",
@@ -38,7 +40,7 @@ export function Blog(props) {
 export function Tag(props) {
   const { tag } = props.match.params;
   const query = {
-    baseUrl: `https://api.juick.com/messages`,
+    baseUrl: '/messages',
     search: {
       tag: tag
     },
@@ -49,7 +51,7 @@ export function Tag(props) {
 
 export function Home(props) {
   const query = {
-    baseUrl: `https://api.juick.com/home`,
+    baseUrl: '/home',
     pageParam: 'before_mid'
   };
   return (<Feed authRequired="true" query={query} {...props} />)
@@ -81,17 +83,12 @@ class Feed extends React.Component {
     if (hash) {
       params.hash = hash;
     }
-    if (Object.keys(params).length > 0) {
-      url = `${url}?${qs.stringify(params)}`;
-    }
     if (!params.hash && this.props.authRequired) {
       this.props.history.push('/')
     }
-    fetch(url)
+    getMessages(url, params)
       .then(response => {
-        return response.json()
-      })
-      .then(data => {
+        const { data } = response;
         const { pageParam } = this.props.query;
         const lastMessage = data.slice(-1)[0] || {};
         const pageValue = pageParam === 'before_mid' ? lastMessage.mid : moment.utc(lastMessage.updated).valueOf();
diff --git a/vnext/src/components/LoginButton.js b/vnext/src/components/LoginButton.js
index fb3c087e..fbce6982 100644
--- a/vnext/src/components/LoginButton.js
+++ b/vnext/src/components/LoginButton.js
@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
 import Icon from './Icon';
 import Modal from './Modal';
 
+import { auth } from '../api';
+
 export default class LoginButton extends React.Component {
   constructor(props) {
     super(props);
@@ -30,18 +32,10 @@ export default class LoginButton extends React.Component {
   }
   login = (event) => {
     event.preventDefault();
-    let headers = new Headers();
-    headers.append('Authorization', 'Basic ' + window.btoa(unescape(encodeURIComponent(this.state.username + ":" + this.state.password))));
-    fetch('https://api.juick.com/auth', {
-      method: 'GET',
-      credentials: 'omit',
-      headers: headers
-    }).then(response => {
-      return response.text()
-    })
-      .then(data => {
+    auth(this.state.username, this.state.password)
+      .then(response => {
         this.toggleModal();
-        this.props.onAuth(data);
+        this.props.onAuth(response);
       }
       ).catch(ex => {
         console.log(ex);
diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js
index 17c5b55c..b1e1abb3 100644
--- a/vnext/src/components/Thread.js
+++ b/vnext/src/components/Thread.js
@@ -12,6 +12,8 @@ import Button from './Button';
 
 import { format } from '../utils/embed';
 
+import { getMessages, comment } from '../api';
+
 export default class Thread extends React.Component {
   constructor(props) {
     super(props);
@@ -36,16 +38,12 @@ export default class Thread extends React.Component {
     if (this.props.visitor && this.props.visitor.hash) {
       params.hash = this.props.visitor.hash
     };
-    const url = `https://api.juick.com/thread?${qs.stringify(params)}`;
-    fetch(url)
+    getMessages('/thread', params)
       .then(response => {
-        return response.json()
-      })
-      .then(data => {
-        let msg = data.shift();
+        let msg = response.data.shift();
         this.setState({
           msg: msg,
-          replies: data,
+          replies: response.data,
           active: 0
         })
       }
@@ -62,18 +60,8 @@ export default class Thread extends React.Component {
     })
   }
   postComment = (template) => {
-    const url = `https://api.juick.com/comment?hash=${this.props.visitor.hash}`;
-    let form = new FormData();
-    form.append('mid', template.mid);
-    form.append('rid', template.rid);
-    form.append('body', template.body);
-    form.append('attach', template.attach);
-    fetch(url, {
-      method: 'POST',
-      body: form
-    }).then(response => {
-      return response.json()
-    }).then(res => {
+    const { mid, rid, body, attach } = template;
+    comment(mid, rid, body, attach).then(res => {
       this.loadReplies()
     })
       .catch(console.log)
diff --git a/vnext/src/index.js b/vnext/src/index.js
index aeb5357f..9527178e 100644
--- a/vnext/src/index.js
+++ b/vnext/src/index.js
@@ -20,19 +20,16 @@ class App extends React.Component {
     super(props);
     let params = qs.parse(window.location.search)
     if (params.hash) {
-      window.localStorage.hash = params.hash
       window.history.replaceState({}, document.title, `${window.location.protocol}//${window.location.host}${window.location.pathname}`)
     }
     this.state = {
-      visitor: {
-        uid: Number(window.localStorage.uid) || 0,
-        hash: window.localStorage.hash || params.hash || ''
+      visitor: localStorage.visitor ? JSON.parse(localStorage.visitor) : {
+        uid: 0,
+        hash: params.hash || ''
       }
     };
   }
-  componentDidMount() {
-    this.auth(this.state.visitor.hash)
-  }
+
   render() {
     const user = this.state.visitor;
     return (
@@ -156,25 +153,10 @@ class App extends React.Component {
       </Router>
     )
   }
-  auth = (data) => {
-    if (data) {
-      window.localStorage.hash = data;
-      fetch(`https://api.juick.com/users?hash=${data}`)
-        .then(response => {
-          return response.json()
-        })
-        .then(users => {
-          let visitor = users[0];
-          visitor.hash = data;
-          window.localStorage.uid = visitor.uid;
-          this.setState({
-            visitor: visitor
-          })
-        }).catch(reason => {
-          window.localStorage.clear()
-          window.location.reload()
-        })
-    }
+  auth = (visitor) => {
+    this.setState({
+      visitor: visitor
+    })
   }
 }