Skip to content

Commit c5202c2

Browse files
author
Emmanouil Konstantinidis
committed
Headers & Restoring them
1 parent bbd3cff commit c5202c2

File tree

3 files changed

+116
-37
lines changed

3 files changed

+116
-37
lines changed

‎rest_framework_docs/static/rest_framework_docs/js/components/request.js‎

Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,30 @@
11
var React = require('react');
22

3+
var Header = require('./helpers/header');
4+
var Headers = require('./request/headers');
35
var FieldsData = require('./request/fields-data');
46
var FieldUrl = require('./request/field-url');
5-
var Header = require('./helpers/header');
67
var Methods = require('./request/methods');
78
var RequestUtils = require('../utils/request');
89

910
var Request = React.createClass({
1011
getInitialState: function () {
1112
return {
12-
endpoint: null,
1313
data: {},
14+
endpoint: null,
15+
headers: {},
1416
selectedMethod: null,
1517
};
1618
},
1719

1820
componentWillMount: function() {
1921
var endpoint = this.props.endpoint;
22+
var headers = this.state.headers;
23+
headers['authorization'] = window.token ? window.token : '';
2024

2125
this.setState({
2226
endpoint: endpoint,
27+
headers: headers,
2328
selectedMethod: endpoint['methods'][0]
2429
});
2530
},
@@ -41,6 +46,14 @@ var Request = React.createClass({
4146
});
4247
},
4348

49+
handleHeaderChange: function (value, fieldName) {
50+
var headers = this.state.headers;
51+
headers[fieldName] = value;
52+
this.setState({
53+
headers: headers
54+
});
55+
},
56+
4457
handleDataFieldChange: function (value, fieldName) {
4558
var data = this.state.data;
4659
data[fieldName] = value;
@@ -68,15 +81,7 @@ var Request = React.createClass({
6881
setMethod={this.setSelectedMethod} />
6982

7083
<Header title='Headers' />
71-
<div className="form-group">
72-
<label htmlFor="authorization" className="col-sm-4 control-label">Authorization</label>
73-
<div className="col-sm-8">
74-
<input
75-
type="text"
76-
className="form-control input-sm"
77-
placeholder="Token" />
78-
</div>
79-
</div>
84+
<Headers headers={this.state.headers} handleHeaderChange={this.handleHeaderChange} />
8085

8186
{RequestUtils.shouldAddData(this.state.method) ? null : (
8287
<div>

‎rest_framework_docs/static/rest_framework_docs/js/components/request/headers.js‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
var React = require('react');
2+
3+
var Input = require('../helpers/input');
4+
5+
var Headers = React.createClass({
6+
7+
getInitialState: function() {
8+
return {
9+
authorization: this.props.headers.authorization
10+
};
11+
},
12+
13+
handleChange: function (fieldName, event) {
14+
this.props.handleHeaderChange(event.target.value, fieldName);
15+
},
16+
17+
componentWillReceiveProps: function(nextProps) {
18+
this.setState({
19+
authorization: nextProps.headers.authorization
20+
});
21+
},
22+
23+
render: function () {
24+
return (
25+
<div>
26+
<Input
27+
name='authorization'
28+
value={this.state.authorization}
29+
placeholder='Token 1234567890'
30+
onChange={this.handleChange.bind(this, 'authorization')} />
31+
</div>
32+
);
33+
}
34+
});
35+
36+
module.exports = Headers;

‎rest_framework_docs/static/rest_framework_docs/js/dist.js‎

Lines changed: 64 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -32454,14 +32454,15 @@ var LiveAPIEndpoints = React.createClass({
3245432454

3245532455
module.exports = LiveAPIEndpoints;
3245632456

32457-
},{"../utils/request":174,"./request":167,"./response":171,"react":159,"superagent":160}],167:[function(require,module,exports){
32457+
},{"../utils/request":175,"./request":167,"./response":172,"react":159,"superagent":160}],167:[function(require,module,exports){
3245832458
'use strict';
3245932459

3246032460
var React = require('react');
3246132461

32462+
var Header = require('./helpers/header');
32463+
var Headers = require('./request/headers');
3246232464
var FieldsData = require('./request/fields-data');
3246332465
var FieldUrl = require('./request/field-url');
32464-
var Header = require('./helpers/header');
3246532466
var Methods = require('./request/methods');
3246632467
var RequestUtils = require('../utils/request');
3246732468

@@ -32470,17 +32471,21 @@ var Request = React.createClass({
3247032471

3247132472
getInitialState: function getInitialState() {
3247232473
return {
32473-
endpoint: null,
3247432474
data: {},
32475+
endpoint: null,
32476+
headers: {},
3247532477
selectedMethod: null
3247632478
};
3247732479
},
3247832480

3247932481
componentWillMount: function componentWillMount() {
3248032482
var endpoint = this.props.endpoint;
32483+
var headers = this.state.headers;
32484+
headers['authorization'] = window.token ? window.token : '';
3248132485

3248232486
this.setState({
3248332487
endpoint: endpoint,
32488+
headers: headers,
3248432489
selectedMethod: endpoint['methods'][0]
3248532490
});
3248632491
},
@@ -32502,6 +32507,14 @@ var Request = React.createClass({
3250232507
});
3250332508
},
3250432509

32510+
handleHeaderChange: function handleHeaderChange(value, fieldName) {
32511+
var headers = this.state.headers;
32512+
headers[fieldName] = value;
32513+
this.setState({
32514+
headers: headers
32515+
});
32516+
},
32517+
3250532518
handleDataFieldChange: function handleDataFieldChange(value, fieldName) {
3250632519
var data = this.state.data;
3250732520
data[fieldName] = value;
@@ -32531,23 +32544,7 @@ var Request = React.createClass({
3253132544
selectedMethod: this.state.selectedMethod,
3253232545
setMethod: this.setSelectedMethod }),
3253332546
React.createElement(Header, { title: 'Headers' }),
32534-
React.createElement(
32535-
'div',
32536-
{ className: 'form-group' },
32537-
React.createElement(
32538-
'label',
32539-
{ htmlFor: 'authorization', className: 'col-sm-4 control-label' },
32540-
'Authorization'
32541-
),
32542-
React.createElement(
32543-
'div',
32544-
{ className: 'col-sm-8' },
32545-
React.createElement('input', {
32546-
type: 'text',
32547-
className: 'form-control input-sm',
32548-
placeholder: 'Token' })
32549-
)
32550-
),
32547+
React.createElement(Headers, { headers: this.state.headers, handleHeaderChange: this.handleHeaderChange }),
3255132548
RequestUtils.shouldAddData(this.state.method) ? null : React.createElement(
3255232549
'div',
3255332550
null,
@@ -32563,7 +32560,7 @@ var Request = React.createClass({
3256332560

3256432561
module.exports = Request;
3256532562

32566-
},{"../utils/request":174,"./helpers/header":164,"./request/field-url":168,"./request/fields-data":169,"./request/methods":170,"react":159}],168:[function(require,module,exports){
32563+
},{"../utils/request":175,"./helpers/header":164,"./request/field-url":168,"./request/fields-data":169,"./request/headers":170,"./request/methods":171,"react":159}],168:[function(require,module,exports){
3256732564
'use strict';
3256832565

3256932566
var React = require('react');
@@ -32643,6 +32640,47 @@ module.exports = FieldsData;
3264332640

3264432641
var React = require('react');
3264532642

32643+
var Input = require('../helpers/input');
32644+
32645+
var Headers = React.createClass({
32646+
displayName: 'Headers',
32647+
32648+
getInitialState: function getInitialState() {
32649+
return {
32650+
authorization: this.props.headers.authorization
32651+
};
32652+
},
32653+
32654+
handleChange: function handleChange(fieldName, event) {
32655+
this.props.handleHeaderChange(event.target.value, fieldName);
32656+
},
32657+
32658+
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
32659+
this.setState({
32660+
authorization: nextProps.headers.authorization
32661+
});
32662+
},
32663+
32664+
render: function render() {
32665+
return React.createElement(
32666+
'div',
32667+
null,
32668+
React.createElement(Input, {
32669+
name: 'authorization',
32670+
value: this.state.authorization,
32671+
placeholder: 'Token 1234567890',
32672+
onChange: this.handleChange.bind(this, 'authorization') })
32673+
);
32674+
}
32675+
});
32676+
32677+
module.exports = Headers;
32678+
32679+
},{"../helpers/input":165,"react":159}],171:[function(require,module,exports){
32680+
'use strict';
32681+
32682+
var React = require('react');
32683+
3264632684
var Methods = React.createClass({
3264732685
displayName: 'Methods',
3264832686

@@ -32693,7 +32731,7 @@ var Methods = React.createClass({
3269332731

3269432732
module.exports = Methods;
3269532733

32696-
},{"react":159}],171:[function(require,module,exports){
32734+
},{"react":159}],172:[function(require,module,exports){
3269732735
'use strict';
3269832736

3269932737
var React = require('react');
@@ -32797,7 +32835,7 @@ var Response = React.createClass({
3279732835

3279832836
module.exports = Response;
3279932837

32800-
},{"../utils/jsonpp":173,"react":159}],172:[function(require,module,exports){
32838+
},{"../utils/jsonpp":174,"react":159}],173:[function(require,module,exports){
3280132839
'use strict';
3280232840

3280332841
var $ = window.$ = window.jQuery = require('jquery');
@@ -32833,7 +32871,7 @@ $('#liveAPIModal').on('hidden.bs.modal', function () {
3283332871
ReactDOM.unmountComponentAtNode(document.getElementById('liveAPIEndpoints'));
3283432872
});
3283532873

32836-
},{"./components/liveapi":166,"jquery":2,"react":159,"react-dom":3,"underscore":163}],173:[function(require,module,exports){
32874+
},{"./components/liveapi":166,"jquery":2,"react":159,"react-dom":3,"underscore":163}],174:[function(require,module,exports){
3283732875
'use strict';
3283832876

3283932877
module.exports = {
@@ -32856,7 +32894,7 @@ module.exports = {
3285632894

3285732895
};
3285832896

32859-
},{}],174:[function(require,module,exports){
32897+
},{}],175:[function(require,module,exports){
3286032898
'use strict';
3286132899

3286232900
module.exports = {
@@ -32877,4 +32915,4 @@ module.exports = {
3287732915

3287832916
};
3287932917

32880-
},{}]},{},[172]);
32918+
},{}]},{},[173]);

0 commit comments

Comments
 (0)