From ec3b260056051139d50cb929cf9fcdd63b66bd1c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jaros=C5=82aw=20Rzesz=C3=B3tko?= Date: Fri, 10 Aug 2018 16:01:35 +0200 Subject: [PATCH 1/3] Show title and description on schemas, fix #598. --- src/common-elements/fields-layout.ts | 7 - src/components/Fields/Field.tsx | 1 - src/components/Schema/ObjectSchema.tsx | 88 ++++++--- src/components/Schema/Schema.tsx | 1 - .../DiscriminatorDropdown.test.tsx.snap | 187 ++++++++++-------- 5 files changed, 156 insertions(+), 128 deletions(-) diff --git a/src/common-elements/fields-layout.ts b/src/common-elements/fields-layout.ts index baffbeab12..a3be79367c 100644 --- a/src/common-elements/fields-layout.ts +++ b/src/common-elements/fields-layout.ts @@ -3,13 +3,6 @@ import styled, { extensionsHook, withProps } from '../styled-components'; import { deprecatedCss } from './mixins'; -export const PropertiesTableCaption = styled.caption` - text-align: right; - font-size: 0.9em; - font-weight: normal; - color: ${props => props.theme.colors.text.secondary}; -`; - export const PropertyCell = styled.td` border-left: 1px solid ${props => props.theme.schema.linesColor}; box-sizing: border-box; diff --git a/src/components/Fields/Field.tsx b/src/components/Fields/Field.tsx index dae79e9650..308a256995 100644 --- a/src/components/Fields/Field.tsx +++ b/src/components/Fields/Field.tsx @@ -74,7 +74,6 @@ export class Field extends React.Component { schema={field.schema} skipReadOnly={this.props.skipReadOnly} skipWriteOnly={this.props.skipWriteOnly} - showTitle={this.props.showTitle} /> diff --git a/src/components/Schema/ObjectSchema.tsx b/src/components/Schema/ObjectSchema.tsx index f8db14013a..95888af0bc 100644 --- a/src/components/Schema/ObjectSchema.tsx +++ b/src/components/Schema/ObjectSchema.tsx @@ -1,10 +1,15 @@ import { observer } from 'mobx-react'; import * as React from 'react'; +import styled from '../../styled-components'; + import { SchemaModel } from '../../services/models'; -import { PropertiesTable, PropertiesTableCaption } from '../../common-elements/fields-layout'; +import { PropertiesTable } from '../../common-elements/fields-layout'; +import { H3 } from '../../common-elements/headers'; + import { Field } from '../Fields/Field'; +import { Markdown } from '../Markdown/Markdown'; import { DiscriminatorDropdown } from './DiscriminatorDropdown'; import { SchemaProps } from './Schema'; @@ -17,6 +22,18 @@ export interface ObjectSchemaProps extends SchemaProps { }; } +export const ObjectSchemaDetails = styled.div` + margin: 0 0 0.5em 0; +`; + +export const ObjectSchemaTitle = styled(H3)` + margin: 0.5em 0 0 0; +`; + +export const ObjectSchemaDescription = styled.div` + margin: 0.5em 0 0 0; +`; + @observer export class ObjectSchema extends React.Component { get parentSchema() { @@ -26,7 +43,6 @@ export class ObjectSchema extends React.Component { render() { const { schema: { fields = [] }, - showTitle, discriminator, } = this.props; @@ -42,36 +58,44 @@ export class ObjectSchema extends React.Component { : fields; return ( - - {showTitle && {this.props.schema.title}} - - {mapWithLast(filteredFields, (field, isLast) => { - return ( - ( - - ))) || - undefined - } - className={field.expanded ? 'expanded' : undefined} - showExamples={false} - skipReadOnly={this.props.skipReadOnly} - skipWriteOnly={this.props.skipWriteOnly} - showTitle={this.props.showTitle} - /> - ); - })} - - +
+ + {this.props.schema.title} + + + + + + + + + {mapWithLast(filteredFields, (field, isLast) => { + return ( + ( + + ))) || + undefined + } + className={field.expanded ? 'expanded' : undefined} + showExamples={false} + skipReadOnly={this.props.skipReadOnly} + skipWriteOnly={this.props.skipWriteOnly} + /> + ); + })} + + +
); } } diff --git a/src/components/Schema/Schema.tsx b/src/components/Schema/Schema.tsx index d875071029..f71da3cb6d 100644 --- a/src/components/Schema/Schema.tsx +++ b/src/components/Schema/Schema.tsx @@ -11,7 +11,6 @@ import { ObjectSchema } from './ObjectSchema'; import { OneOfSchema } from './OneOfSchema'; export interface SchemaOptions { - showTitle?: boolean; skipReadOnly?: boolean; skipWriteOnly?: boolean; } diff --git a/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap b/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap index ab1a367c03..94131030c0 100644 --- a/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap +++ b/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap @@ -1,105 +1,118 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Components SchemaView discriminator should correctly render discriminator dropdown 1`] = ` - - - + + + Dog + + + + + + + + >>", - "pattern": undefined, - "pointer": "#/components/schemas/Dog/properties/packSize", - "rawSchema": Object { + "expanded": false, + "in": undefined, + "kind": "field", + "name": "packSize", + "required": false, + "schema": SchemaModel { + "activeOneOf": 0, + "constraints": Array [], "default": undefined, + "deprecated": false, + "description": "", + "displayFormat": undefined, + "displayType": "number", + "enum": Array [], + "example": undefined, + "format": undefined, + "isCircular": undefined, + "isPrimitive": true, + "nullable": false, + "options": "<<>>", + "pattern": undefined, + "pointer": "#/components/schemas/Dog/properties/packSize", + "rawSchema": Object { + "default": undefined, + "type": "number", + }, + "readOnly": false, + "schema": Object { + "default": undefined, + "type": "number", + }, + "title": "", "type": "number", + "typePrefix": "", + "writeOnly": false, }, - "readOnly": false, - "schema": Object { - "default": undefined, - "type": "number", - }, - "title": "", - "type": "number", - "typePrefix": "", - "writeOnly": false, - }, + } } - } - isLast={false} - key="packSize" - showExamples={false} - /> - + >>", - "pattern": undefined, - "pointer": "#/components/schemas/Dog/properties/type", - "rawSchema": Object { - "default": undefined, - "type": "string", - }, - "readOnly": false, - "schema": Object { + "expanded": false, + "in": undefined, + "kind": "field", + "name": "type", + "required": true, + "schema": SchemaModel { + "activeOneOf": 0, + "constraints": Array [], "default": undefined, + "deprecated": false, + "description": "", + "displayFormat": undefined, + "displayType": "string", + "enum": Array [], + "example": undefined, + "format": undefined, + "isCircular": undefined, + "isPrimitive": true, + "nullable": false, + "options": "<<>>", + "pattern": undefined, + "pointer": "#/components/schemas/Dog/properties/type", + "rawSchema": Object { + "default": undefined, + "type": "string", + }, + "readOnly": false, + "schema": Object { + "default": undefined, + "type": "string", + }, + "title": "", "type": "string", + "typePrefix": "", + "writeOnly": false, }, - "title": "", - "type": "string", - "typePrefix": "", - "writeOnly": false, - }, + } } - } - isLast={true} - key="type" - renderDiscriminatorSwitch={[Function]} - showExamples={false} - /> - - + isLast={true} + key="type" + renderDiscriminatorSwitch={[Function]} + showExamples={false} + /> + + + `; From 67be0580ca1b2b45a2b33dfd39ba94196d0f8367 Mon Sep 17 00:00:00 2001 From: Steven Nguyen Date: Mon, 9 Sep 2019 11:27:03 -0700 Subject: [PATCH 2/3] Update schema render to optionally render title and description --- src/components/Fields/Field.tsx | 2 +- src/components/Schema/ObjectSchema.tsx | 13 ++++++++----- src/components/Schema/Schema.tsx | 10 +++++----- .../SchemaDefinition/SchemaDefinition.tsx | 11 ++++++++++- 4 files changed, 24 insertions(+), 12 deletions(-) diff --git a/src/components/Fields/Field.tsx b/src/components/Fields/Field.tsx index ef969b2d6b..d16f5182ca 100644 --- a/src/components/Fields/Field.tsx +++ b/src/components/Fields/Field.tsx @@ -73,7 +73,7 @@ export class Field extends React.Component { schema={field.schema} skipReadOnly={this.props.skipReadOnly} skipWriteOnly={this.props.skipWriteOnly} - showTitle={this.props.showTitle} + skipObjectTitle={this.props.skipObjectTitle} /> diff --git a/src/components/Schema/ObjectSchema.tsx b/src/components/Schema/ObjectSchema.tsx index c99819265a..ed9efe065b 100644 --- a/src/components/Schema/ObjectSchema.tsx +++ b/src/components/Schema/ObjectSchema.tsx @@ -60,11 +60,14 @@ export class ObjectSchema extends React.Component { return (
- {this.props.schema.title} - - - - + {!this.props.skipObjectTitle && ( + {this.props.schema.title} + )} + {!this.props.skipObjectDescription && ( + + + + )} diff --git a/src/components/Schema/Schema.tsx b/src/components/Schema/Schema.tsx index 3e169975fc..0560292111 100644 --- a/src/components/Schema/Schema.tsx +++ b/src/components/Schema/Schema.tsx @@ -15,6 +15,8 @@ import { l } from '../../services/Labels'; export interface SchemaOptions { skipReadOnly?: boolean; skipWriteOnly?: boolean; + skipObjectTitle?: boolean; + skipObjectDescription?: boolean; } export interface SchemaProps extends SchemaOptions { @@ -43,9 +45,7 @@ export class Schema extends React.Component> { if (discriminatorProp !== undefined) { if (!oneOf || !oneOf.length) { throw new Error( - `Looks like you are using discriminator wrong: you don't have any definition inherited from the ${ - schema.title - }`, + `Looks like you are using discriminator wrong: you don't have any definition inherited from the ${schema.title}`, ); } return ( @@ -65,9 +65,9 @@ export class Schema extends React.Component> { switch (type) { case 'object': - return ; + return ; case 'array': - return ; + return ; } // TODO: maybe adjust FieldDetails to accept schema diff --git a/src/components/SchemaDefinition/SchemaDefinition.tsx b/src/components/SchemaDefinition/SchemaDefinition.tsx index 9515cf9987..ac2a644bc7 100644 --- a/src/components/SchemaDefinition/SchemaDefinition.tsx +++ b/src/components/SchemaDefinition/SchemaDefinition.tsx @@ -14,6 +14,8 @@ export interface ObjectDescriptionProps { exampleRef?: string; showReadOnly?: boolean; showWriteOnly?: boolean; + showObjectTitle?: boolean; + showObjectDescription?: boolean; parser: OpenAPIParser; options: RedocNormalizedOptions; } @@ -53,7 +55,12 @@ export class SchemaDefinition extends React.PureComponent @@ -61,6 +68,8 @@ export class SchemaDefinition extends React.PureComponent From bc3651a82e3cb5bd87e3ba2538482ec8f9abeb72 Mon Sep 17 00:00:00 2001 From: Steven Nguyen Date: Mon, 9 Sep 2019 15:47:24 -0700 Subject: [PATCH 3/3] Restore DiscriminatorDropdown test snapshot --- .../DiscriminatorDropdown.test.tsx.snap | 89 ++++++------------- 1 file changed, 29 insertions(+), 60 deletions(-) diff --git a/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap b/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap index 192bdfe7e9..745c4cad4c 100644 --- a/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap +++ b/src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap @@ -21,6 +21,9 @@ exports[`Components SchemaView discriminator should correctly render discriminat "default": undefined, "deprecated": false, "description": "", + "displayFormat": undefined, + "displayType": "number", + "enum": Array [], "example": undefined, "externalDocs": undefined, "format": undefined, @@ -32,34 +35,18 @@ exports[`Components SchemaView discriminator should correctly render discriminat "pointer": "#/components/schemas/Dog/properties/packSize", "rawSchema": Object { "default": undefined, - "deprecated": false, - "description": "", - "displayFormat": undefined, - "displayType": "number", - "enum": Array [], - "example": undefined, - "format": undefined, - "isCircular": undefined, - "isPrimitive": true, - "nullable": false, - "options": "<<>>", - "pattern": undefined, - "pointer": "#/components/schemas/Dog/properties/packSize", - "rawSchema": Object { - "default": undefined, - "type": "number", - }, - "readOnly": false, - "schema": Object { - "default": undefined, - "type": "number", - }, - "title": "", "type": "number", - "typePrefix": "", - "writeOnly": false, }, - } + "readOnly": false, + "schema": Object { + "default": undefined, + "type": "number", + }, + "title": "", + "type": "number", + "typePrefix": "", + "writeOnly": false, + }, } } isLast={false} @@ -84,6 +71,9 @@ exports[`Components SchemaView discriminator should correctly render discriminat "default": undefined, "deprecated": false, "description": "", + "displayFormat": undefined, + "displayType": "string", + "enum": Array [], "example": undefined, "externalDocs": undefined, "format": undefined, @@ -100,41 +90,20 @@ exports[`Components SchemaView discriminator should correctly render discriminat "readOnly": false, "schema": Object { "default": undefined, - "deprecated": false, - "description": "", - "displayFormat": undefined, - "displayType": "string", - "enum": Array [], - "example": undefined, - "format": undefined, - "isCircular": undefined, - "isPrimitive": true, - "nullable": false, - "options": "<<>>", - "pattern": undefined, - "pointer": "#/components/schemas/Dog/properties/type", - "rawSchema": Object { - "default": undefined, - "type": "string", - }, - "readOnly": false, - "schema": Object { - "default": undefined, - "type": "string", - }, - "title": "", "type": "string", - "typePrefix": "", - "writeOnly": false, }, - } + "title": "", + "type": "string", + "typePrefix": "", + "writeOnly": false, + }, } - isLast={true} - key="type" - renderDiscriminatorSwitch={[Function]} - showExamples={false} - /> - - -
+ } + isLast={true} + key="type" + renderDiscriminatorSwitch={[Function]} + showExamples={false} + /> + + `;