Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-08-09 06:34:53 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: integrate request and response viewer

Browse Source 
integrate request and response viewer and clean the code
This commit is contained in:
Arian Rahimi 2020-02-10 10:53:17 +03:30
parent ae93d7ddbb
commit 973c393f14
2 changed files with 24 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/Console/ConsoleViewer.tsx
View File

@ -100,7 +100,6 @@ export class ConsoleViewer extends React.Component<ConsoleViewerProps, ConsoleVi
}
if (url.split(queryParamPrefix).length > 1) {
console.error('** we have missing query params ** ', url);
throw Error(`** we have missing query params ** ${url}`);
}
@ -127,37 +126,19 @@ export class ConsoleViewer extends React.Component<ConsoleViewerProps, ConsoleVi
body: (body) ? JSON.stringify(body) : undefined,
});
const result = await fetch(request);
const response = await fetch(request);
const content = await response.json();
const { ok, status, statusText, redirected } = response;
return {
content,
ok,
status,
statusText,
redirected,
headers: response.headers,
url: response.url,
};
const contentType = result.headers.get('content-type');
if (contentType && contentType.indexOf('application/json') !== -1) {
const resp = await result.json();
return { json: resp, statusCode: result.status, _fetchRes: result };
} else if (result.status === 200 && contentType && contentType.indexOf('text/plain') !== -1) {
const resp = await result.text();
return { resp, _fetchRes: result };
} else {
if (result && result.type && result.type === 'opaqueredirect') {
return {
json: {
endpoint,
error_code: 'RECEIVED_LOGIN_REDIRECT',
details: 'Your session expired. Please refresh the page.',
severity: 'error',
},
};
}
return {
json: {
endpoint,
error_code: 'INVALID_SERVER_RESPONSE',
details: 'Either server not authenticated or error on server',
severity: 'error',
},
};
}
} catch (error) {
console.error(error);
}

19
src/components/ConsoleResponse/Response.tsx
View File

@ -25,22 +25,27 @@ export class ConsoleResponse extends React.PureComponent<ConsoleResponseProps, C
};
render() {
const { response: { headers, type, status, statusText, content } } = this.props;
const collapse = this.state.collapse;
return(
<>
<RightPanelHeader> status: </RightPanelHeader>
<StatusWrapper className={'status-' + this.props.response.type}> {this.props.response.status} {this.props.response.statusText}</StatusWrapper>
<StatusWrapper className={'status-' + type}> {status} {statusText}</StatusWrapper>
<RightPanelHeader> Response Payload </RightPanelHeader>
<JsonWrapper>
<JsonViewer data={this.props.response.content!} />
<JsonViewer data={content!} />
</JsonWrapper>
<RightPanelHeader> Response Headers</RightPanelHeader>
<HeaderWrapper>
<SourceCodeWrapper className={'collapse-' + this.state.collapse}>
<SourceCodeWithCopy lang="json" source={JSON.stringify(this.props.response.headers, null, 2)}/>
<SourceCodeWrapper className={'collapse-' + collapse}>
<SourceCodeWithCopy lang="json" source={JSON.stringify(headers, null, 2)}/>
</SourceCodeWrapper>
<ShowMore onClick={this.changeCollapse}>
<u>+ show undocumented response headers</u>
</ShowMore>
{
collapse &&
<ShowMore onClick={this.changeCollapse}>
<u>+ show undocumented response headers</u>
</ShowMore>
}
</HeaderWrapper>
</>
);