fetch and add new target urls
parent
9fc72a50ae
commit
6d36276c53
|
@ -0,0 +1,63 @@
|
|||
'use strict'
|
||||
|
||||
import Ajax from '../lib/Ajax'
|
||||
|
||||
const ACTIONS = {
|
||||
set_working: 'set_working',
|
||||
add_url: 'add_url',
|
||||
edit_url: 'edit_url',
|
||||
delete_url: 'delete_url',
|
||||
list_url: 'list_url',
|
||||
error: 'error'
|
||||
}
|
||||
|
||||
export default ACTIONS
|
||||
|
||||
export const setWorking = working => ({
|
||||
type: ACTIONS.set_working,
|
||||
data: working
|
||||
})
|
||||
|
||||
export const setUrls = (urls) => ({
|
||||
type: ACTIONS.list_url,
|
||||
data: urls
|
||||
})
|
||||
|
||||
export const addUrl = url => ({
|
||||
type: ACTIONS.add_url,
|
||||
data: url
|
||||
})
|
||||
|
||||
export const fetchUrls = () => async (dispatch, getState) => {
|
||||
dispatch(setWorking(true))
|
||||
try {
|
||||
const { data } = await Ajax.get({
|
||||
url: '/api/targets'
|
||||
})
|
||||
dispatch(setUrls(data))
|
||||
} catch (e) {
|
||||
dispatch({
|
||||
type: ACTIONS.error,
|
||||
data: e
|
||||
})
|
||||
} finally {
|
||||
dispatch(setWorking(false))
|
||||
}
|
||||
}
|
||||
|
||||
export const createNewUrl = () => async (dispatch, getState) => {
|
||||
dispatch(setWorking(true))
|
||||
try {
|
||||
const { data } = await Ajax.post({
|
||||
url: '/api/targets'
|
||||
})
|
||||
dispatch(addUrl(data))
|
||||
} catch (e) {
|
||||
dispatch({
|
||||
type: ACTIONS.error,
|
||||
data: e
|
||||
})
|
||||
} finally {
|
||||
dispatch(setWorking(false))
|
||||
}
|
||||
}
|
|
@ -0,0 +1,24 @@
|
|||
'use strict'
|
||||
|
||||
import Actions from '../actions/targets'
|
||||
|
||||
const reducer = (state = {}, action) => {
|
||||
const { type, data } = action
|
||||
switch (type) {
|
||||
case Actions.set_working:
|
||||
return {
|
||||
working: data
|
||||
}
|
||||
case Actions.list_url:
|
||||
return {
|
||||
urls: data || []
|
||||
}
|
||||
case Actions.add_url:
|
||||
return {
|
||||
urls: state.urls.concat(data)
|
||||
}
|
||||
default: return {}
|
||||
}
|
||||
}
|
||||
|
||||
export default reducer
|
|
@ -4,7 +4,8 @@ import React from 'react'
|
|||
import ReactDOM from 'react-dom'
|
||||
import Progress from './components/Progress'
|
||||
import UriListItem from './containers/UriListItem'
|
||||
|
||||
import reducer from './reducers/targets'
|
||||
import { fetchUrls, createNewUrl } from './actions/targets'
|
||||
import '../styles/targets.scss'
|
||||
|
||||
class App extends React.Component {
|
||||
|
@ -16,6 +17,7 @@ class App extends React.Component {
|
|||
email: '',
|
||||
password: ''
|
||||
},
|
||||
urls: [1, 2],
|
||||
working: false
|
||||
}
|
||||
|
||||
|
@ -34,8 +36,11 @@ class App extends React.Component {
|
|||
})
|
||||
}
|
||||
}
|
||||
componentDidMount () {
|
||||
this.dispatch(fetchUrls())
|
||||
}
|
||||
getRegisteredUris () {
|
||||
return [1, 2, 3].map((item, i) => {
|
||||
return this.state.urls.map((item, i) => {
|
||||
return (<UriListItem key={i} />)
|
||||
})
|
||||
}
|
||||
|
@ -47,14 +52,14 @@ class App extends React.Component {
|
|||
<h1>RoE</h1>
|
||||
</header>
|
||||
</aside>
|
||||
<section className='content flex'>
|
||||
<section className={'content flex' + (this.state.working ? ' working' : '')}>
|
||||
<Progress bound />
|
||||
<header className='flex-container'>
|
||||
<div className='flex'>
|
||||
<h1>Push URIs</h1>
|
||||
<h2>Newly published books will be sent to these addresses.</h2>
|
||||
</div>
|
||||
<button className='btn'>New address</button>
|
||||
<button className='btn' onClick={() => this.dispatch(createNewUrl())}>New address</button>
|
||||
</header>
|
||||
<ul className='list'>
|
||||
{this.getRegisteredUris()}
|
||||
|
|
Loading…
Reference in New Issue