From 5a83610d9f7f20bc4fb2407f119992c620d9b6e3 Mon Sep 17 00:00:00 2001
From: Pedro Nauck <pedronauck@gmail.com>
Date: Mon, 28 May 2018 20:11:19 -0300
Subject: [PATCH] fix(docz): flow props parser integration

---
 packages/docz/src/components/PropsTable.tsx | 37 ++++++++++++++++++---
 1 file changed, 33 insertions(+), 4 deletions(-)

diff --git a/packages/docz/src/components/PropsTable.tsx b/packages/docz/src/components/PropsTable.tsx
index a9f8736eb..34eb4caee 100644
--- a/packages/docz/src/components/PropsTable.tsx
+++ b/packages/docz/src/components/PropsTable.tsx
@@ -6,6 +6,18 @@ export interface EnumValue {
   computed: boolean
 }
 
+export interface FlowTypeElement {
+  name: string
+  value: string
+}
+
+export interface FlowTypeArgs {
+  name: string
+  type: {
+    name: string
+  }
+}
+
 export interface Prop {
   required: boolean
   description?: string
@@ -16,6 +28,18 @@ export interface Prop {
   defaultValue?: {
     value: string
   }
+  flowType?: {
+    elements: FlowTypeElement[]
+    name: string
+    raw: string
+    type?: string
+    signature?: {
+      arguments: FlowTypeArgs[]
+      return: {
+        name: string
+      }
+    }
+  }
 }
 
 export type ComponentWithDocGenInfo = ComponentType & {
@@ -40,12 +64,17 @@ export type TooltipComponent = React.ComponentType<{
 const getValue = (value: string) => value.replace(/\'/g, '')
 
 const getPropType = (prop: Prop, Tooltip?: TooltipComponent) => {
-  const name = prop.type.name
+  const name = prop.flowType ? prop.flowType.name : prop.type.name
+  const value = prop.type && prop.type.value
 
-  if (!Tooltip || !prop.type.value) return name
+  if (!Tooltip) return name
+  if ((!prop.flowType && !value) || (prop.flowType && !prop.flowType.elements))
+    return name
 
-  return (
-    <Tooltip text={prop.type.value.map(val => getValue(val.value)).join(' | ')}>
+  return prop.flowType ? (
+    <Tooltip text={prop.flowType.raw}>{name}</Tooltip>
+  ) : (
+    <Tooltip text={value && value.map(val => getValue(val.value)).join(' | ')}>
       {name}
     </Tooltip>
   )