From 0a73344829f92aece893783e2f96d115f23fef03 Mon Sep 17 00:00:00 2001 From: Shivani P Date: Tue, 29 Jun 2021 12:05:55 +0530 Subject: [PATCH] Commit to enable multiple contributors --- src/components/ApiInfo/ApiInfo.tsx | 28 +--------- src/components/Contributor/Contributor.tsx | 52 +++++++++++++++++++ .../Contributor/ContributorGroup.tsx | 50 ++++++++++++++++++ src/components/Operation/Operation.tsx | 27 +--------- src/components/index.ts | 1 + src/services/models/Contributor.ts | 19 +++++++ src/types/open-api.ts | 4 +- 7 files changed, 128 insertions(+), 53 deletions(-) create mode 100644 src/components/Contributor/Contributor.tsx create mode 100644 src/components/Contributor/ContributorGroup.tsx create mode 100644 src/services/models/Contributor.ts diff --git a/src/components/ApiInfo/ApiInfo.tsx b/src/components/ApiInfo/ApiInfo.tsx index 939f8f5f..152361bf 100644 --- a/src/components/ApiInfo/ApiInfo.tsx +++ b/src/components/ApiInfo/ApiInfo.tsx @@ -7,6 +7,7 @@ import { MiddlePanel, Row, Section } from '../../common-elements/'; import { ExternalDocumentation } from '../ExternalDocumentation/ExternalDocumentation'; import { Markdown } from '../Markdown/Markdown'; import { StyledMarkdownBlock } from '../Markdown/styled.elements'; +import { Contributor } from '../Contributor/Contributor' import { ApiHeader, DownloadButton, @@ -70,29 +71,6 @@ export class ApiInfo extends React.Component { const version = (info.version && ({info.version})) || null; - const contributorName = (info['x-contributorDetails'] && info['x-contributorDetails'].name && ( - - Contributed by: {' '} - {info['x-contributorDetails'].name} - - )) || - null; - - const contributorEmail = - (info['x-contributorDetails'] && info['x-contributorDetails'].email && ( - - {info['x-contributorDetails'].email} - - )) || - null; - - const contributorSupportLink = (info['x-contributorDetails'] && info['x-contributorDetails'].supportlink && ( - - Support - - )) || - null; - return (
@@ -122,9 +100,7 @@ export class ApiInfo extends React.Component { )) || null} - - {contributorName} {contributorEmail} {contributorSupportLink} - + diff --git a/src/components/Contributor/Contributor.tsx b/src/components/Contributor/Contributor.tsx new file mode 100644 index 00000000..35d3d7e3 --- /dev/null +++ b/src/components/Contributor/Contributor.tsx @@ -0,0 +1,52 @@ +// import { observer } from 'mobx-react'; +import * as React from 'react'; +import { ContributorGroup } from './ContributorGroup'; +import { mapWithLast } from '../../utils'; +import { ContributorModel } from '../../services/models/Contributor'; + +import { + InfoSpanBox, + InfoSpanBoxWrap, +} from './../ApiInfo/styled.elements'; +function safePush(obj, prop, item) { + if (!obj[prop]) { + obj[prop] = []; + } + obj[prop].push(item); +} +export interface ContributorProps { + contributor: ContributorModel[]; +} + +const CONTRIBUTOR_PLACES = ['contributor']; + +export class Contributor extends React.Component { + orderParams(params: ContributorModel[]): Record { + const res = {}; + params.forEach(param => { + safePush(res, 'contributor', param); + }); + return res; + } + render() { + const { contributor = [] } = this.props; + const paramsMap = this.orderParams(contributor); + const contributorPlaces = contributor.length > 0 ? CONTRIBUTOR_PLACES : []; + + return ( + <> + Contributed by:{' '} + + + {contributorPlaces.map(place => ( + mapWithLast(paramsMap[place], (contributorDetails, isLast) => ( + + )) + ))} + + + + + ); + } +} diff --git a/src/components/Contributor/ContributorGroup.tsx b/src/components/Contributor/ContributorGroup.tsx new file mode 100644 index 00000000..32fd4cd2 --- /dev/null +++ b/src/components/Contributor/ContributorGroup.tsx @@ -0,0 +1,50 @@ +import * as React from 'react'; +import { InfoSpan } from './../ApiInfo/styled.elements'; +import { ContributorModel } from '../../services/models/Contributor'; + +export interface ContributorGroup { + key:string; + place: string; + contributors: ContributorModel[]; + field: any; + isLast: boolean; +} + +export class ContributorGroup extends React.PureComponent { + render() { + const { place, contributors,field,isLast } = this.props; + console.log("isLast isLast",isLast); + + const contributorName = (field && field['name'] && ( + + { field['name']} + + )) || + null; + + const contributorEmail = + ( field && field['email'] && ( + + { field['email']} + + )) || + null; + + const contributorSupportLink = ( field && field['supportlink'] && ( + + Support + + )) || + null; + + if (!contributors || !contributors.length) { + return null; + } + + return ( +
+ {contributorName}{contributorEmail}{contributorSupportLink} +
+ ); + } +} diff --git a/src/components/Operation/Operation.tsx b/src/components/Operation/Operation.tsx index 11b4198b..9f993b59 100644 --- a/src/components/Operation/Operation.tsx +++ b/src/components/Operation/Operation.tsx @@ -17,6 +17,7 @@ import { RequestSamples } from '../RequestSamples/RequestSamples'; import { ResponsesList } from '../Responses/ResponsesList'; import { ResponseSamples } from '../ResponseSamples/ResponseSamples'; import { SecurityRequirements } from '../SecurityRequirement/SecurityRequirement'; +import { Contributor } from '../Contributor/Contributor' import { InfoSpan, InfoSpanBox, @@ -44,28 +45,6 @@ export class Operation extends React.Component { const { name: summary, description, deprecated, externalDocs, isWebhook, contributorDetails} = operation; const hasDescription = !!(description || externalDocs); - const contributorName = (contributorDetails && contributorDetails['name'] && ( - - Contributed by:{' '} - { contributorDetails['name']} - - )) || - null; - - const contributorEmail = - ( contributorDetails && contributorDetails['email'] && ( - - { contributorDetails['email']} - - )) || - null; - - const contributorSupportLink = ( contributorDetails && contributorDetails['supportlink'] && ( - - Support - - )) || - null; return ( {(options) => ( @@ -76,9 +55,7 @@ export class Operation extends React.Component { {summary} {deprecated && Deprecated } {isWebhook && Webhook } - - {contributorName}{contributorEmail}{contributorSupportLink} - + {options.pathInMiddlePanel && !isWebhook && ( )} diff --git a/src/components/index.ts b/src/components/index.ts index 68e25659..fa2981d1 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -3,6 +3,7 @@ export * from './Redoc/Redoc'; export * from './ApiInfo/ApiInfo'; export * from './ApiLogo/ApiLogo'; export * from './ContentItems/ContentItems'; +export * from './Contributor/Contributor'; export { ApiContentWrap, BackgroundStub, RedocWrap } from './Redoc/styled.elements'; export * from './Schema/'; export * from './SearchBox/SearchBox'; diff --git a/src/services/models/Contributor.ts b/src/services/models/Contributor.ts new file mode 100644 index 00000000..b70fc688 --- /dev/null +++ b/src/services/models/Contributor.ts @@ -0,0 +1,19 @@ +import { observable,} from 'mobx'; +import { OpenAPIInfo } from '../../types' + +export class ContributorModel { + @observable + // contributor:[ + info: OpenAPIInfo; + name: string; + email: string; + supportlink: string; + in: string ='contributor'; + //] + + constructor( ) { + console.log(this.info); + } + + +} diff --git a/src/types/open-api.ts b/src/types/open-api.ts index 24c6f3fa..e13a6d24 100644 --- a/src/types/open-api.ts +++ b/src/types/open-api.ts @@ -22,7 +22,7 @@ export interface OpenAPIInfo { termsOfService?: string; contact?: OpenAPIContact; license?: OpenAPILicense; - 'x-contributorDetails'?: OpenAPIContributorDetail; + 'x-contributorDetails'?: OpenAPIContributorDetail[]; } export interface OpenAPIServer { @@ -48,7 +48,7 @@ export type Referenced = OpenAPIRef | T; export interface OpenAPIPath { summary?: string; - 'x-contributorDetails'?: OpenAPIContributorDetail; + 'x-contributorDetails'?: OpenAPIContributorDetail[]; description?: string; get?: OpenAPIOperation; put?: OpenAPIOperation;