From 0a0d4cea7def227f9864e1f21862468255508876 Mon Sep 17 00:00:00 2001
From: John Kaster <kaster@google.com>
Date: Mon, 17 May 2021 19:38:51 +0000
Subject: [PATCH 1/3] feat: added original spec in APIX

---
 .../components/Collapser/CollapserCard.tsx    |  6 ++-
 .../DocReferences/DocReferences.tsx           | 53 +++++++++---------
 .../components/DocResponses/DocResponses.tsx  | 43 ++++++---------
 .../src/components/DocSDKs/DocSDKs.tsx        | 23 ++++----
 .../src/components/DocSchema/DocSchema.tsx    | 54 +++++++++++++++++++
 .../src/components/DocSchema/index.ts         | 27 ++++++++++
 packages/api-explorer/src/components/index.ts |  1 +
 .../src/scenes/DiffScene/DiffScene.tsx        |  2 +-
 .../src/scenes/MethodScene/MethodScene.tsx    |  4 +-
 .../MethodScene/components/DocOperation.tsx   |  2 +-
 .../src/scenes/TypeScene/TypeScene.tsx        |  2 +
 .../src/components/DocSdkCalls/callUtils.ts   |  4 +-
 12 files changed, 149 insertions(+), 72 deletions(-)
 create mode 100644 packages/api-explorer/src/components/DocSchema/DocSchema.tsx
 create mode 100644 packages/api-explorer/src/components/DocSchema/index.ts

diff --git a/packages/api-explorer/src/components/Collapser/CollapserCard.tsx b/packages/api-explorer/src/components/Collapser/CollapserCard.tsx
index a297ca68a..b0299a217 100644
--- a/packages/api-explorer/src/components/Collapser/CollapserCard.tsx
+++ b/packages/api-explorer/src/components/Collapser/CollapserCard.tsx
@@ -36,6 +36,7 @@ interface CollapserCardProps {
   id?: string
   heading: string
   children: ReactElement
+  defaultOpen?: boolean
 }
 
 /**
@@ -45,8 +46,9 @@ export const CollapserCard: FC<CollapserCardProps> = ({
   id,
   heading,
   children,
+  defaultOpen = true,
 }) => {
-  const { value, toggle } = useToggle(true)
+  const { value, toggle } = useToggle(defaultOpen)
 
   return (
     <Accordion
@@ -54,6 +56,8 @@ export const CollapserCard: FC<CollapserCardProps> = ({
       indicatorPosition="left"
       isOpen={value}
       toggleOpen={toggle}
+      mb="small"
+      mt="small"
     >
       <AccordionDisclosure>
         <ApixHeading as="h2">{heading}</ApixHeading>
diff --git a/packages/api-explorer/src/components/DocReferences/DocReferences.tsx b/packages/api-explorer/src/components/DocReferences/DocReferences.tsx
index edd18d659..4d11f16d2 100644
--- a/packages/api-explorer/src/components/DocReferences/DocReferences.tsx
+++ b/packages/api-explorer/src/components/DocReferences/DocReferences.tsx
@@ -25,7 +25,6 @@
  */
 
 import React, { FC, useContext } from 'react'
-import { Box } from '@looker/components'
 import { ApiModel, IMethod, IType } from '@looker/sdk-codegen'
 
 import { SearchContext } from '../../context'
@@ -62,32 +61,30 @@ export const DocReferences: FC<DocReferencesProps> = ({
     return <></>
 
   return (
-    <Box id="references" mb="xlarge">
-      <CollapserCard heading="References">
-        <>
-          {DocReferenceItems(
-            'Referenced Types:',
-            typesUsed,
-            api,
-            specKey,
-            pattern
-          )}
-          {DocReferenceItems(
-            'Used by types:',
-            typesUsedBy,
-            api,
-            specKey,
-            pattern
-          )}
-          {DocReferenceItems(
-            'Used by methods:',
-            methodsUsedBy,
-            api,
-            specKey,
-            pattern
-          )}
-        </>
-      </CollapserCard>
-    </Box>
+    <CollapserCard heading="References" id="references">
+      <>
+        {DocReferenceItems(
+          'Referenced Types:',
+          typesUsed,
+          api,
+          specKey,
+          pattern
+        )}
+        {DocReferenceItems(
+          'Used by types:',
+          typesUsedBy,
+          api,
+          specKey,
+          pattern
+        )}
+        {DocReferenceItems(
+          'Used by methods:',
+          methodsUsedBy,
+          api,
+          specKey,
+          pattern
+        )}
+      </>
+    </CollapserCard>
   )
 }
diff --git a/packages/api-explorer/src/components/DocResponses/DocResponses.tsx b/packages/api-explorer/src/components/DocResponses/DocResponses.tsx
index d39e0910c..810d32a70 100644
--- a/packages/api-explorer/src/components/DocResponses/DocResponses.tsx
+++ b/packages/api-explorer/src/components/DocResponses/DocResponses.tsx
@@ -25,14 +25,7 @@
  */
 
 import React, { FC } from 'react'
-import {
-  Box,
-  Tab,
-  TabList,
-  TabPanel,
-  TabPanels,
-  useTabs,
-} from '@looker/components'
+import { Tab, TabList, TabPanel, TabPanels, useTabs } from '@looker/components'
 import { IMethodResponse } from '@looker/sdk-codegen'
 
 import { CollapserCard } from '../Collapser'
@@ -54,23 +47,21 @@ export const DocResponses: FC<DocResponsesProps> = ({ responses }) => {
   const responseTree = buildResponseTree(responses)
 
   return (
-    <Box mb="xlarge">
-      <CollapserCard heading="Response Models">
-        <>
-          <TabList {...tabs}>
-            {Object.keys(responseTree).map((statusCode, index) => (
-              <Tab key={index}>{statusCode}</Tab>
-            ))}
-          </TabList>
-          <TabPanels {...tabs} pt="0">
-            {Object.values(responseTree).map((responses, index) => (
-              <TabPanel key={index}>
-                <DocResponseTypes responses={responses} />
-              </TabPanel>
-            ))}
-          </TabPanels>
-        </>
-      </CollapserCard>
-    </Box>
+    <CollapserCard heading="Response Models" id="response models">
+      <>
+        <TabList {...tabs}>
+          {Object.keys(responseTree).map((statusCode, index) => (
+            <Tab key={index}>{statusCode}</Tab>
+          ))}
+        </TabList>
+        <TabPanels {...tabs} pt="0">
+          {Object.values(responseTree).map((responses, index) => (
+            <TabPanel key={index}>
+              <DocResponseTypes responses={responses} />
+            </TabPanel>
+          ))}
+        </TabPanels>
+      </>
+    </CollapserCard>
   )
 }
diff --git a/packages/api-explorer/src/components/DocSDKs/DocSDKs.tsx b/packages/api-explorer/src/components/DocSDKs/DocSDKs.tsx
index 9cbe932b8..e34f02210 100644
--- a/packages/api-explorer/src/components/DocSDKs/DocSDKs.tsx
+++ b/packages/api-explorer/src/components/DocSDKs/DocSDKs.tsx
@@ -35,7 +35,6 @@ import {
   Method,
 } from '@looker/sdk-codegen'
 import { getGenerators } from '@looker/run-it'
-import { Box } from '@looker/components'
 
 import { DocCode } from '../DocCode'
 import { getSelectedSdkLanguage } from '../../state'
@@ -98,17 +97,15 @@ export const DocSDKs: FC<LanguageSDKProps> = ({ api, method, type }) => {
   }, [sdkLanguage, item])
 
   return (
-    <Box mb="xlarge">
-      <CollapserCard heading={header}>
-        {Object.keys(declarations).length > 1 ? (
-          <DocDeclarations declarations={declarations} />
-        ) : (
-          <DocCode
-            language={Object.keys(declarations)[0]}
-            code={Object.values(declarations)[0]}
-          />
-        )}
-      </CollapserCard>
-    </Box>
+    <CollapserCard heading={header} id="sdk declarations">
+      {Object.keys(declarations).length > 1 ? (
+        <DocDeclarations declarations={declarations} />
+      ) : (
+        <DocCode
+          language={Object.keys(declarations)[0]}
+          code={Object.values(declarations)[0]}
+        />
+      )}
+    </CollapserCard>
   )
 }
diff --git a/packages/api-explorer/src/components/DocSchema/DocSchema.tsx b/packages/api-explorer/src/components/DocSchema/DocSchema.tsx
new file mode 100644
index 000000000..5b85723eb
--- /dev/null
+++ b/packages/api-explorer/src/components/DocSchema/DocSchema.tsx
@@ -0,0 +1,54 @@
+/*
+
+ MIT License
+
+ Copyright (c) 2021 Looker Data Sciences, Inc.
+
+ Permission is hereby granted, free of charge, to any person obtaining a copy
+ of this software and associated documentation files (the "Software"), to deal
+ in the Software without restriction, including without limitation the rights
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ copies of the Software, and to permit persons to whom the Software is
+ furnished to do so, subject to the following conditions:
+
+ The above copyright notice and this permission notice shall be included in all
+ copies or substantial portions of the Software.
+
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ SOFTWARE.
+
+ */
+
+import React, { FC } from 'react'
+
+import { CodeDisplay } from '@looker/code-editor'
+import { CollapserCard } from '../Collapser'
+
+interface DocSchemaProps {
+  object: any
+}
+
+/**
+ * It renders links to the given types and/or methods references
+ */
+export const DocSchema: FC<DocSchemaProps> = ({ object }) => {
+  if (!object) return <></>
+  const json = JSON.stringify(object, null, 2)
+
+  return (
+    <CollapserCard
+      heading="Original Schema"
+      defaultOpen={false}
+      id="original schema"
+    >
+      <>
+        <CodeDisplay language="json" code={json} />
+      </>
+    </CollapserCard>
+  )
+}
diff --git a/packages/api-explorer/src/components/DocSchema/index.ts b/packages/api-explorer/src/components/DocSchema/index.ts
new file mode 100644
index 000000000..da951ab76
--- /dev/null
+++ b/packages/api-explorer/src/components/DocSchema/index.ts
@@ -0,0 +1,27 @@
+/*
+
+ MIT License
+
+ Copyright (c) 2021 Looker Data Sciences, Inc.
+
+ Permission is hereby granted, free of charge, to any person obtaining a copy
+ of this software and associated documentation files (the "Software"), to deal
+ in the Software without restriction, including without limitation the rights
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ copies of the Software, and to permit persons to whom the Software is
+ furnished to do so, subject to the following conditions:
+
+ The above copyright notice and this permission notice shall be included in all
+ copies or substantial portions of the Software.
+
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ SOFTWARE.
+
+ */
+
+export { DocSchema } from './DocSchema'
diff --git a/packages/api-explorer/src/components/index.ts b/packages/api-explorer/src/components/index.ts
index 3ac54b2f6..f318d73a1 100644
--- a/packages/api-explorer/src/components/index.ts
+++ b/packages/api-explorer/src/components/index.ts
@@ -41,3 +41,4 @@ export { Header } from './Header'
 export { SideNav } from './SideNav'
 export { ExploreType, ExploreProperty } from './ExploreType'
 export { CollapserCard } from './Collapser'
+export { DocSchema } from './DocSchema'
diff --git a/packages/api-explorer/src/scenes/DiffScene/DiffScene.tsx b/packages/api-explorer/src/scenes/DiffScene/DiffScene.tsx
index 8dbcb7a58..4eb2108d0 100644
--- a/packages/api-explorer/src/scenes/DiffScene/DiffScene.tsx
+++ b/packages/api-explorer/src/scenes/DiffScene/DiffScene.tsx
@@ -165,7 +165,7 @@ export const DiffScene: FC<DiffSceneProps> = ({ specs, toggleNavigation }) => {
   return (
     <ApixSection>
       <Box>
-        <Flex bg="AliceBlue" padding="large" mb="xlarge" alignItems="center">
+        <Flex bg="AliceBlue" padding="large" mb="large" alignItems="center">
           <FlexItem>
             <Label htmlFor="base">Base</Label>
             <Select
diff --git a/packages/api-explorer/src/scenes/MethodScene/MethodScene.tsx b/packages/api-explorer/src/scenes/MethodScene/MethodScene.tsx
index 74b7eeafe..0f74d034f 100644
--- a/packages/api-explorer/src/scenes/MethodScene/MethodScene.tsx
+++ b/packages/api-explorer/src/scenes/MethodScene/MethodScene.tsx
@@ -52,6 +52,7 @@ import {
   DocSource,
   DocStatus,
   DocTitle,
+  DocSchema,
 } from '../../components'
 import { getSelectedSdkLanguage } from '../../state'
 import { DocOperation, DocRequestBody } from './components'
@@ -101,7 +102,7 @@ export const MethodScene: FC<DocMethodProps> = ({ api }) => {
           </Space>
           {runItToggle}
         </Space>
-        <Space mb="xlarge" gap="small">
+        <Space mb="large" gap="small">
           <DocStatus method={method} />
           <DocActivityType method={method} />
           <DocRateLimited method={method} />
@@ -113,6 +114,7 @@ export const MethodScene: FC<DocMethodProps> = ({ api }) => {
         <DocSdkUsage method={method} />
         <DocReferences typesUsed={seeTypes} api={api} specKey={specKey} />
         <DocResponses responses={method.responses} />
+        <DocSchema object={method.schema} />
       </ApixSection>
       {sdk && value && (
         <Aside width="50rem">
diff --git a/packages/api-explorer/src/scenes/MethodScene/components/DocOperation.tsx b/packages/api-explorer/src/scenes/MethodScene/components/DocOperation.tsx
index 57617c4f9..9a875e86a 100644
--- a/packages/api-explorer/src/scenes/MethodScene/components/DocOperation.tsx
+++ b/packages/api-explorer/src/scenes/MethodScene/components/DocOperation.tsx
@@ -35,7 +35,7 @@ interface DocOperationProps {
 }
 
 export const DocOperation: FC<DocOperationProps> = ({ method }) => (
-  <SpaceVertical align="start" mb="xlarge" gap="xsmall">
+  <SpaceVertical align="start" mb="large" gap="xsmall">
     <MethodBadge type={method.httpMethod}>
       <DocPseudo method={method} />
     </MethodBadge>
diff --git a/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx b/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx
index cf4e9811c..ab41bbf5b 100644
--- a/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx
+++ b/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx
@@ -36,6 +36,7 @@ import {
   DocSource,
   DocTitle,
   ExploreType,
+  DocSchema,
 } from '../../components'
 
 interface DocTypeProps {
@@ -69,6 +70,7 @@ export const TypeScene: FC<DocTypeProps> = ({ api }) => {
         specKey={specKey}
       />
       <DocSDKs type={type} api={api} />
+      <DocSchema object={type.schema} />
     </ApixSection>
   )
 }
diff --git a/packages/run-it/src/components/DocSdkCalls/callUtils.ts b/packages/run-it/src/components/DocSdkCalls/callUtils.ts
index b18f9dac2..973f82035 100644
--- a/packages/run-it/src/components/DocSdkCalls/callUtils.ts
+++ b/packages/run-it/src/components/DocSdkCalls/callUtils.ts
@@ -39,7 +39,9 @@ export const getGenerators = (api: ApiModel): KeyedCollection<CodeGen> => {
   codeGenerators
     .filter((x) => x.factory !== undefined)
     .forEach((gen) => {
-      codeGens[gen.language] = gen.factory!(api)
+      const sdkGen = gen.factory!(api)
+      // sdkGen.noComment = true
+      codeGens[gen.language] = sdkGen
     })
   return codeGens
 }

From d40f83f4edf5d1a27c4d65b5ffbb72952da027b3 Mon Sep 17 00:00:00 2001
From: John Kaster <kaster@google.com>
Date: Mon, 17 May 2021 21:38:34 +0000
Subject: [PATCH 2/3] tightened up collapsed section whitespace

- standardized spacing in CollapserCard.tsx
---
 .../components/Collapser/CollapserCard.tsx    | 34 ++++++++++++-------
 .../src/scenes/TypeScene/TypeScene.tsx        |  6 ++--
 2 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/packages/api-explorer/src/components/Collapser/CollapserCard.tsx b/packages/api-explorer/src/components/Collapser/CollapserCard.tsx
index b0299a217..04c5a3af1 100644
--- a/packages/api-explorer/src/components/Collapser/CollapserCard.tsx
+++ b/packages/api-explorer/src/components/Collapser/CollapserCard.tsx
@@ -29,7 +29,11 @@ import {
   Accordion,
   AccordionDisclosure,
   AccordionContent,
+  Divider,
+  Box,
 } from '@looker/components'
+import { ArrowRight } from '@styled-icons/material/ArrowRight'
+import { ArrowDropDown } from '@styled-icons/material/ArrowDropDown'
 import { ApixHeading } from '../common'
 
 interface CollapserCardProps {
@@ -51,18 +55,22 @@ export const CollapserCard: FC<CollapserCardProps> = ({
   const { value, toggle } = useToggle(defaultOpen)
 
   return (
-    <Accordion
-      id={id}
-      indicatorPosition="left"
-      isOpen={value}
-      toggleOpen={toggle}
-      mb="small"
-      mt="small"
-    >
-      <AccordionDisclosure>
-        <ApixHeading as="h2">{heading}</ApixHeading>
-      </AccordionDisclosure>
-      <AccordionContent>{children}</AccordionContent>
-    </Accordion>
+    <>
+      <Divider appearance="light" />
+      <Accordion
+        id={id}
+        indicatorPosition="left"
+        isOpen={value}
+        toggleOpen={toggle}
+        indicatorIcons={{ close: <ArrowRight />, open: <ArrowDropDown /> }}
+      >
+        <AccordionDisclosure>
+          <ApixHeading as="h3">{heading}</ApixHeading>
+        </AccordionDisclosure>
+        <AccordionContent>
+          <Box pb="xlarge">{children}</Box>
+        </AccordionContent>
+      </Accordion>
+    </>
   )
 }
diff --git a/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx b/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx
index ab41bbf5b..4a0828fb1 100644
--- a/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx
+++ b/packages/api-explorer/src/scenes/TypeScene/TypeScene.tsx
@@ -27,7 +27,7 @@
 import React, { FC } from 'react'
 import { typeRefs, methodRefs, ApiModel } from '@looker/sdk-codegen'
 import { useParams } from 'react-router-dom'
-import { Space } from '@looker/components'
+import { Space, Box } from '@looker/components'
 
 import {
   ApixSection,
@@ -61,7 +61,9 @@ export const TypeScene: FC<DocTypeProps> = ({ api }) => {
         <DocTitle>{type.name}</DocTitle>
         <DocSource type={type} />
       </Space>
-      <ExploreType type={type} />
+      <Box pb="xlarge">
+        <ExploreType type={type} />
+      </Box>
       <DocReferences
         typesUsed={typesUsed}
         typesUsedBy={typesUsedBy}

From 816c7e2c048b6ad3f49a4d1456e819e2bd79a5ca Mon Sep 17 00:00:00 2001
From: John Kaster <kaster@google.com>
Date: Mon, 17 May 2021 23:02:14 +0000
Subject: [PATCH 3/3] removed stale comment

---
 packages/run-it/src/components/DocSdkCalls/callUtils.ts | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/packages/run-it/src/components/DocSdkCalls/callUtils.ts b/packages/run-it/src/components/DocSdkCalls/callUtils.ts
index 973f82035..f59adf28f 100644
--- a/packages/run-it/src/components/DocSdkCalls/callUtils.ts
+++ b/packages/run-it/src/components/DocSdkCalls/callUtils.ts
@@ -25,9 +25,9 @@
  */
 import {
   ApiModel,
-  KeyedCollection,
   CodeGen,
   codeGenerators,
+  KeyedCollection,
 } from '@looker/sdk-codegen'
 
 /**
@@ -39,9 +39,7 @@ export const getGenerators = (api: ApiModel): KeyedCollection<CodeGen> => {
   codeGenerators
     .filter((x) => x.factory !== undefined)
     .forEach((gen) => {
-      const sdkGen = gen.factory!(api)
-      // sdkGen.noComment = true
-      codeGens[gen.language] = sdkGen
+      codeGens[gen.language] = gen.factory!(api)
     })
   return codeGens
 }