From ee8bd4fe17b8904757f397bf9c8367b411c46b76 Mon Sep 17 00:00:00 2001 From: Harjeet Singh Date: Wed, 27 Jun 2018 12:10:01 -0700 Subject: [PATCH] added more to options to enable/disable console. Also introduced some constants to make it more configurable --- demo/playground/hmr-playground.tsx | 15 +++------------ src/common-elements/buttons.ts | 6 ++++++ src/common-elements/index.ts | 1 + src/common-elements/panels.ts | 4 ++++ src/components/Console/ConsoleEditor.tsx | 24 ------------------------ src/components/Console/index.ts | 2 ++ src/components/Operation/Operation.tsx | 18 ++++++++++-------- src/components/SideMenu/SideMenu.tsx | 18 +++++++++--------- src/components/index.ts | 2 +- src/services/RedocNormalizedOptions.ts | 10 ++++++++++ src/services/SearchStore.ts | 2 +- 11 files changed, 47 insertions(+), 55 deletions(-) create mode 100644 src/components/Console/index.ts diff --git a/demo/playground/hmr-playground.tsx b/demo/playground/hmr-playground.tsx index 40398cde..786b8ab3 100644 --- a/demo/playground/hmr-playground.tsx +++ b/demo/playground/hmr-playground.tsx @@ -22,26 +22,17 @@ const big = window.location.search.indexOf('big') > -1; const swagger = window.location.search.indexOf('swagger') > -1; // compatibility mode ? let specUrl = swagger ? 'swagger.yaml' : big ? 'big-openapi.json' : 'openapi.yaml'; -specUrl = 'intent.json'; +// specUrl = 'intent.json'; // specUrl = 'swagger.yaml'; -// specUrl = 'petstore.json'; +specUrl = 'petstore.json'; let store; -const options: RedocRawOptions = { nativeScrollbars: false }; +const options: RedocRawOptions = { nativeScrollbars: false, enableConsole: true, providedByName: 'Intent ApiDocs by Nutanix', providedByUri: 'http://www.nutanix.com' }; async function init() { const spec = await loadAndBundleSpec(specUrl); store = new AppStore(spec, specUrl, options); - /* - const ajv = new Ajv({ allErrors: true, unknownFormats: ['int32', 'UUID', 'int64'] }); - ajv.addSchema(spec, 'specs.json') - - const ajvError = require('ajv-errors')(ajv); - - window.ajv = ajv; - window.ajvError = ajvError; - */ renderRoot({ store }); } diff --git a/src/common-elements/buttons.ts b/src/common-elements/buttons.ts index c6a7650a..14be3ba8 100644 --- a/src/common-elements/buttons.ts +++ b/src/common-elements/buttons.ts @@ -13,3 +13,9 @@ export const Button = styled.button` export const SendButton = Button.extend` background: #B0045E; `; + +export const ConsoleButton = Button.extend` + background: #e2e2e2; + color: black; + float: right; +`; \ No newline at end of file diff --git a/src/common-elements/index.ts b/src/common-elements/index.ts index cd940d34..3ff7e1cc 100644 --- a/src/common-elements/index.ts +++ b/src/common-elements/index.ts @@ -11,3 +11,4 @@ export * from './samples'; export * from './perfect-scrollbar'; export * from './toggle'; export * from './input'; +export * from './buttons'; diff --git a/src/common-elements/panels.ts b/src/common-elements/panels.ts index 02783d2a..05f8fe89 100644 --- a/src/common-elements/panels.ts +++ b/src/common-elements/panels.ts @@ -49,3 +49,7 @@ export const FlexLayout = styled.div` export const ConsoleActionsRow = FlexLayout.extend` padding: 5px 0px; `; + +export const FlexLayoutReverse = FlexLayout.extend` + flex-direction: row-reverse; +`; \ No newline at end of file diff --git a/src/components/Console/ConsoleEditor.tsx b/src/components/Console/ConsoleEditor.tsx index fb801eb2..e9175569 100644 --- a/src/components/Console/ConsoleEditor.tsx +++ b/src/components/Console/ConsoleEditor.tsx @@ -25,21 +25,6 @@ export class ConsoleEditor extends React.Component { editor: any; - /* - get aceEditor(): AceEditor { - return this._aceEditor; - } - - set aceEditor(aceEditor: AceEditor) { - if (aceEditor) { - this.aceEditor = this.aceEditor - } - else { - console.log("Error: Undefined ace editor!"); - } - } - */ - render() { const { mediaTypes } = this.props; @@ -56,15 +41,6 @@ export class ConsoleEditor extends React.Component { } } - /* - let body = {}; - if(mimeContent.mediaTypes && mimeContent.mediaTypes.length>0){ - body = mimeContent.mediaTypes[0]; - if(body.examples && body.examples.default) { - - } - } - */ return (
{ }; } - onTry = e => { + onConsoleClick = () => { this.setState({ - executeMode: e.target.checked, + executeMode: !this.state.executeMode }); - console.log(e.target.checked + ' ' + this.props.operation); - }; - + } /* activate = (item: IMenuItem) => { this.props.menu.activateAndScroll(item, true); @@ -77,6 +75,7 @@ export class Operation extends React.Component { const { name: summary, description, deprecated } = operation; const { executeMode } = this.state; + const consoleButtonLabel = (executeMode) ? 'Hide Console' : 'Show Console'; return ( {options => ( @@ -86,8 +85,11 @@ export class Operation extends React.Component { {summary} {deprecated && Deprecated } - - Try it out! + {options.enableConsole && + + {consoleButtonLabel} + + } {options.pathInMiddlePanel && } {description !== undefined && } diff --git a/src/components/SideMenu/SideMenu.tsx b/src/components/SideMenu/SideMenu.tsx index 9aab7310..d2c8f3bc 100644 --- a/src/components/SideMenu/SideMenu.tsx +++ b/src/components/SideMenu/SideMenu.tsx @@ -28,15 +28,15 @@ export class SideMenu extends React.Component<{ menu: MenuStore }> { root={true} /> ) : ( - - - - - Documentation Powered by ReDoc - - - - ) + + + + + {options.providedByName} + + + + ) } ); diff --git a/src/components/index.ts b/src/components/index.ts index 09dac433..e8cac5e2 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -16,4 +16,4 @@ export * from './StoreProvider'; export * from './OptionsProvider'; export * from './SideMenu/'; export * from './StickySidebar/StickyResponsiveSidebar'; -export * from './SearchBox/SearchBox'; +export * from './SearchBox/SearchBox'; \ No newline at end of file diff --git a/src/services/RedocNormalizedOptions.ts b/src/services/RedocNormalizedOptions.ts index f1a7373c..b1b427ff 100644 --- a/src/services/RedocNormalizedOptions.ts +++ b/src/services/RedocNormalizedOptions.ts @@ -6,6 +6,7 @@ export interface RedocRawOptions { theme?: ThemeInterface; scrollYOffset?: number | string | (() => number); hideHostname?: boolean | string; + enableConsole?: boolean; expandResponses?: string | 'all'; requiredPropsFirst?: boolean | string; noAutoAuth?: boolean | string; @@ -15,6 +16,9 @@ export interface RedocRawOptions { hideLoading?: boolean | string; hideDownloadButton?: boolean | string; + providedByName?: string; + providedByUri?: string; + unstable_ignoreMimeParameters?: boolean; } @@ -93,6 +97,9 @@ export class RedocNormalizedOptions { pathInMiddlePanel: boolean; untrustedSpec: boolean; hideDownloadButton: boolean; + enableConsole: boolean; + providedByName: string; + providedByUri: string; /* tslint:disable-next-line */ unstable_ignoreMimeParameters: boolean; @@ -108,6 +115,9 @@ export class RedocNormalizedOptions { this.pathInMiddlePanel = argValueToBoolean(raw.pathInMiddlePanel); this.untrustedSpec = argValueToBoolean(raw.untrustedSpec); this.hideDownloadButton = argValueToBoolean(raw.hideDownloadButton); + this.enableConsole = argValueToBoolean(raw.enableConsole); + this.providedByName = raw.providedByName || 'Documentation Powered by ReDoc'; + this.providedByUri = raw.providedByUri || 'https://github.com/Rebilly/ReDoc'; this.unstable_ignoreMimeParameters = argValueToBoolean(raw.unstable_ignoreMimeParameters); } diff --git a/src/services/SearchStore.ts b/src/services/SearchStore.ts index ed8a616d..e856580d 100644 --- a/src/services/SearchStore.ts +++ b/src/services/SearchStore.ts @@ -9,7 +9,7 @@ let worker: new () => Worker; if (IS_BROWSER) { try { // tslint:disable-next-line - worker = require('workerize-loader?inline&fallback=false!./SearchWorker.worker'); + worker = require('workerize-loader?fallback=false!./SearchWorker.worker'); } catch (e) { worker = require('./SearchWorker.worker').default; }