Add support for rendering nested IndexSignatures

3 files changed, 36 insertions, 18 deletions

diff --git a/packages/react-docs/src/components/interface.tsx b/packages/react-docs/src/components/interface.tsx
index a881c7fec..915b4bbc6 100644
--- a/packages/react-docs/src/components/interface.tsx
+++ b/packages/react-docs/src/components/interface.tsx
@@ -2,7 +2,7 @@ import * as _ from 'lodash';
 import * as React from 'react';
 
 import { DocsInfo } from '../docs_info';
-import { CustomType, TypeDocTypes } from '../types';
+import { CustomType } from '../types';
 
 import { Signature } from './signature';
 import { Type } from './type';
@@ -19,9 +19,7 @@ export const Interface = (props: InterfaceProps) => {
         return (
             <span key={`property-${property.name}-${property.type}-${type.name}`}>
                 {property.name}:{' '}
-                {property.type && property.type.typeDocType !== TypeDocTypes.Reflection ? (
-                    <Type type={property.type} sectionName={props.sectionName} docsInfo={props.docsInfo} />
-                ) : (
+                {property.type && !_.isUndefined(property.type.method) ? (
                     <Signature
                         name={property.type.method.name}
                         returnType={property.type.method.returnType}
@@ -32,6 +30,8 @@ export const Interface = (props: InterfaceProps) => {
                         shouldUseArrowSyntax={true}
                         docsInfo={props.docsInfo}
                     />
+                ) : (
+                    <Type type={property.type} sectionName={props.sectionName} docsInfo={props.docsInfo} />
                 )},
             </span>
         );
diff --git a/packages/react-docs/src/components/signature.tsx b/packages/react-docs/src/components/signature.tsx
index 5f28050d2..d9567c9f6 100644
--- a/packages/react-docs/src/components/signature.tsx
+++ b/packages/react-docs/src/components/signature.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 
 import { DocsInfo } from '../docs_info';
 import { Parameter, Type as TypeDef, TypeDefinitionByName, TypeParameter } from '../types';
-import { constants } from '../utils/constants';
 
 import { Type } from './type';
 
diff --git a/packages/react-docs/src/components/type.tsx b/packages/react-docs/src/components/type.tsx
index 3504be303..ea66c7b1e 100644
--- a/packages/react-docs/src/components/type.tsx
+++ b/packages/react-docs/src/components/type.tsx
@@ -93,19 +93,38 @@ export function Type(props: TypeProps): any {
             break;
 
         case TypeDocTypes.Reflection:
-            typeName = (
-                <Signature
-                    name={type.method.name}
-                    returnType={type.method.returnType}
-                    parameters={type.method.parameters}
-                    typeParameter={type.method.typeParameter}
-                    sectionName={props.sectionName}
-                    shouldHideMethodName={true}
-                    shouldUseArrowSyntax={true}
-                    docsInfo={props.docsInfo}
-                    typeDefinitionByName={props.typeDefinitionByName}
-                />
-            );
+            if (!_.isUndefined(type.method)) {
+                typeName = (
+                    <Signature
+                        name={type.method.name}
+                        returnType={type.method.returnType}
+                        parameters={type.method.parameters}
+                        typeParameter={type.method.typeParameter}
+                        sectionName={props.sectionName}
+                        shouldHideMethodName={true}
+                        shouldUseArrowSyntax={true}
+                        docsInfo={props.docsInfo}
+                        typeDefinitionByName={props.typeDefinitionByName}
+                    />
+                );
+            } else if (!_.isUndefined(type.indexSignature)) {
+                const is = type.indexSignature;
+                const param = (
+                    <span key={`indexSigParams-${is.keyName}-${is.keyType}-${type.name}`}>
+                        {is.keyName}:{' '}
+                        <Type type={is.keyType} sectionName={props.sectionName} docsInfo={props.docsInfo} />
+                    </span>
+                );
+                typeName = (
+                    <span key={`indexSignature-${type.name}-${is.keyType.name}`}>
+                        {'{'}[{param}]: {is.valueName}
+                        {'}'}
+                    </span>
+                );
+            } else {
+                throw new Error(`Unrecognized Reflection type that isn't a Method nor an Index Signature`);
+            }
+
             break;
 
         case TypeDocTypes.TypeParameter: