From 40b8cd9853dd87deb90afdda0f5af78faa414f2b Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Wed, 27 Jun 2018 14:33:34 +0300 Subject: fetch -> axios --- vnext/src/api/index.js | 63 +++++++++++++++++++++++++++++++++++++ vnext/src/components/Chat.js | 24 +++++--------- vnext/src/components/Contacts.js | 9 +++--- vnext/src/components/Feeds.js | 15 ++++----- vnext/src/components/LoginButton.js | 16 +++------- vnext/src/components/Thread.js | 26 +++++---------- vnext/src/index.js | 34 +++++--------------- 7 files changed, 101 insertions(+), 86 deletions(-) create mode 100644 vnext/src/api/index.js (limited to 'vnext/src') 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 () @@ -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 { ) } - 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 + }) } } -- cgit v1.2.3