diff --git a/src/components/param-builder/index.js b/src/components/param-builder/index.js
index a0ba73c..0881c50 100644
--- a/src/components/param-builder/index.js
+++ b/src/components/param-builder/index.js
@@ -36,7 +36,7 @@ const ParamBuilder = ( { title, params, values = {}, onChange } ) => {
parameter={ parameter }
id={ `param-${ paramKey }` }
name={ paramKey }
- position="right"
+ position="bottom"
/>
diff --git a/src/components/results/header/index.js b/src/components/results/header/index.js
index ffdc0ae..ecfb54e 100644
--- a/src/components/results/header/index.js
+++ b/src/components/results/header/index.js
@@ -1,9 +1,10 @@
import React from 'react';
import ResultsViewSelector from '../results-view-selector';
+import Refresh from './refresh';
import './style.css';
-const RequestHeader = ( { result: { loading, request: { path, method, apiName, version }, duration, response }, view, onViewChange } ) => {
+const RequestHeader = ( { result: { id, loading, request: { path, method, apiName, version }, duration, response }, view, onViewChange } ) => {
const filename = path
.replace( /^\//, '' )
.replace( /\//g, '-' ) + '.json';
@@ -25,7 +26,10 @@ const RequestHeader = ( { result: { loading, request: { path, method, apiName, v
) }
{ duration && (
- { `${ duration }ms` }
+
+ {`${ duration }ms`}
+
+
) }
{ response && !! response.body && (
diff --git a/src/components/results/header/refresh.js b/src/components/results/header/refresh.js
new file mode 100644
index 0000000..c1b2a47
--- /dev/null
+++ b/src/components/results/header/refresh.js
@@ -0,0 +1,19 @@
+import React from 'react';
+import { connect } from 'react-redux';
+
+import { refresh } from '../../../state/results/actions';
+
+const Refresh = ( { refreshResult } ) => (
+
+ ↺
+ );
+
+const mapDispatchToProps = ( dispatch, { id } ) => {
+ return { refreshResult: () => dispatch( refresh( id ) ) };
+};
+
+export default connect( undefined, mapDispatchToProps )( Refresh );
diff --git a/src/components/results/header/style.css b/src/components/results/header/style.css
index 3a0f4fa..15dad1c 100644
--- a/src/components/results/header/style.css
+++ b/src/components/results/header/style.css
@@ -81,6 +81,20 @@
content: "\1F4CB\FE0E";
}
+.request-header .refresh {
+ padding: 2px 4px 0;
+ font-size: 18px;
+ border-radius: 2px;
+ text-decoration: none;
+ display: inline-block;
+ vertical-align: middle;
+ margin: 2px 0 2px 8px;
+ border: 1px solid #95b7d0;
+ color: #95b7d0;
+ height: 18px;
+ line-height: 12px;
+}
+
.request-header .error {
white-space: nowrap;
font-size: 12px;
diff --git a/src/state/results/actions.js b/src/state/results/actions.js
index 9f45abe..22f9e9a 100644
--- a/src/state/results/actions.js
+++ b/src/state/results/actions.js
@@ -3,6 +3,7 @@ import { getRequestMethod, getCompleteQueryUrl, getBodyParams } from '../request
import { getSelectedApi, getSelectedVersion } from '../ui/selectors';
import { get } from '../../api';
import { getResponseStatus, getResponseError } from '../../lib/api';
+import { getResultById } from './selectors';
window.responses = [];
const recordResponse = response => {
@@ -44,10 +45,10 @@ const receiveResults = ( {
};
};
-const triggerRequest = ( { id, version, apiName, method, path } ) => {
+const triggerRequest = ( { id, request } ) => {
return {
type: REQUEST_TRIGGER,
- payload: { id, version, apiName, method, path },
+ payload: { id, request },
};
};
@@ -60,16 +61,13 @@ export const request = () => ( dispatch, getState ) => {
const api = get( apiName );
const body = getBodyParams( state );
const start = new Date().getTime();
- const request = api.buildRequest( version, method, path, body );
+ const request = { apiName, api, version, method, path, body };
dispatch( triggerRequest( {
id: start,
- version,
- apiName,
- method,
- path,
+ request,
} ) );
- return api.authProvider.request( request )
+ return api.authProvider.request( api.buildRequest( request.version, request.method, request.path, request.body ) )
.then( ( { status, body, error } ) => {
const end = new Date().getTime();
dispatch( receiveResults( {
@@ -85,3 +83,30 @@ export const request = () => ( dispatch, getState ) => {
} ) );
} );
};
+
+export const refresh = id => ( dispatch, getState ) => {
+ const state = getState();
+ const result = getResultById( state, id );
+ const request = result.request;
+ const start = new Date().getTime();
+ dispatch( triggerRequest( {
+ id,
+ request,
+ } ) );
+
+ return request.api.authProvider.request( request.api.buildRequest( request.version, request.method, request.path, request.body ) )
+ .then( ( { status, body, error } ) => {
+ const end = new Date().getTime();
+ dispatch( receiveResults( {
+ id,
+ apiVersion: request.apiVersion,
+ apiName: request.apiName,
+ method: request.method,
+ path: request.path,
+ status: getResponseStatus( status, body, error ),
+ body,
+ error: getResponseError( status, body, error, true ),
+ duration: end - start,
+ } ) );
+ } );
+};
diff --git a/src/state/results/reducer.js b/src/state/results/reducer.js
index 50421d0..9ce7920 100644
--- a/src/state/results/reducer.js
+++ b/src/state/results/reducer.js
@@ -2,10 +2,10 @@ import { createReducer } from '../../lib/redux/create-reducer';
import { REQUEST_RESULTS_RECEIVE, REQUEST_TRIGGER } from '../actions';
const reducer = createReducer( {}, {
- [ REQUEST_TRIGGER ]: ( state, { payload: { id, version, apiName, method, path } } ) => {
+ [ REQUEST_TRIGGER ]: ( state, { payload: { id, request } } ) => {
return ( {
...state,
- [ id ]: { id, loading: true, request: { version, apiName, method, path } },
+ [ id ]: { id, loading: true, request },
} );
},
[ REQUEST_RESULTS_RECEIVE ]: ( state, { payload: { id, status, body, error, duration } } ) => {
diff --git a/src/state/results/selectors.js b/src/state/results/selectors.js
index e618a9c..a6e3181 100644
--- a/src/state/results/selectors.js
+++ b/src/state/results/selectors.js
@@ -9,3 +9,8 @@ export const getResults = state => {
.map( key => results[ key ] )
.sort( ( a, b ) => b.id - a.id );
};
+
+export const getResultById = ( state, id ) => {
+ const results = getResults( state );
+ return results.filter( result => result.id === id )[ 0 ];
+};