@looker/api-explorer 0.9.21 → 0.9.26

package/src/components/SideNav/SideNav.spec.tsx

@@ -24,13 +24,13 @@
 
  */
 import React from 'react'
-import { CriteriaToSet } from '@looker/sdk-codegen'
+import { criteriaToSet } from '@looker/sdk-codegen'
 import userEvent from '@testing-library/user-event'
-import { act, screen, waitFor } from '@testing-library/react'
+import { screen, waitFor } from '@testing-library/react'
 
 import { getLoadedSpecs, specState } from '../../test-data'
-import { renderWithRouter, renderWithSearchAndRouter } from '../../test-utils'
-import { defaultSearchState } from '../../reducers'
+import { renderWithRouterAndReduxProvider } from '../../test-utils'
+import { defaultSettingsState } from '../../state'
 import { SideNav } from './SideNav'
 import { countMethods, countTypes } from './searchUtils'
 
@@ -55,7 +55,7 @@ describe('SideNav', () => {
   })
 
   test('it renders search, methods tab and types tab', () => {
-    renderWithRouter(
+    renderWithRouterAndReduxProvider(
       <SideNav
         specs={specs}
         spec={specState.spec}
@@ -78,7 +78,7 @@ describe('SideNav', () => {
   })
 
   test('Methods tab is the default active tab', () => {
-    renderWithRouter(
+    renderWithRouterAndReduxProvider(
       <SideNav
         specs={specs}
         spec={specState.spec}
@@ -97,7 +97,7 @@ describe('SideNav', () => {
   })
 
   test('url determines active tab', () => {
-    renderWithRouter(
+    renderWithRouterAndReduxProvider(
       <SideNav
         specs={specs}
         spec={specState.spec}
@@ -115,7 +115,7 @@ describe('Search', () => {
   const specDispatch = jest.fn()
 
   test('it filters methods and types on input', async () => {
-    renderWithSearchAndRouter(
+    renderWithRouterAndReduxProvider(
       <SideNav
         specs={specs}
         spec={specState.spec}
@@ -125,28 +125,23 @@ describe('Search', () => {
     const searchPattern = 'embedsso'
     const input = screen.getByLabelText('Search')
     jest.spyOn(specState.spec.api!, 'search')
-    await act(async () => {
-      /** Pasting to avoid triggering search multiple times */
-      await userEvent.paste(input, searchPattern)
-      await waitFor(() => {
-        expect(specState.spec.api!.search).toHaveBeenCalledWith(
-          searchPattern,
-          CriteriaToSet(defaultSearchState.criteria)
+    /** Pasting to avoid triggering search multiple times */
+    await userEvent.paste(input, searchPattern)
+    await waitFor(() => {
+      expect(specState.spec.api!.search).toHaveBeenCalledWith(
+        searchPattern,
+        criteriaToSet(defaultSettingsState.searchCriteria)
+      )
+      const methods = screen.getByRole('tab', { name: 'Methods (1)' })
+      userEvent.click(methods)
+      expect(
+        screen.getByText(
+          specState.spec.api!.tags.Auth.create_sso_embed_url.summary
         )
-        const methods = screen.getByRole('tab', { name: 'Methods (1)' })
-        const types = screen.getByRole('tab', { name: 'Types (1)' })
-        userEvent.click(methods)
-        expect(
-          screen.getByText(
-            specState.spec.api!.tags.Auth.create_sso_embed_url.summary
-          )
-        ).toBeInTheDocument()
-
-        userEvent.click(types)
-        expect(
-          screen.getByText(specState.spec.api!.types.EmbedSsoParams.name)
-        ).toBeInTheDocument()
-      })
+      ).toBeInTheDocument()
+      const types = screen.getByRole('tab', { name: 'Types (1)' })
+      userEvent.click(types)
+      expect(screen.getByText('EmbedSso')).toBeInTheDocument()
     })
   })
 })

package/src/components/SideNav/SideNav.tsx

@@ -25,7 +25,7 @@
  */
 
 import type { FC, Dispatch } from 'react'
-import React, { useContext, useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useHistory, useLocation } from 'react-router-dom'
 import {
   TabList,
@@ -40,19 +40,29 @@ import type {
   SpecList,
   ISearchResult,
   ApiModel,
+  TagList,
+  TypeTagList,
 } from '@looker/sdk-codegen'
-import { CriteriaToSet, tagTypes } from '@looker/sdk-codegen'
+import { criteriaToSet, tagTypes } from '@looker/sdk-codegen'
+import { useSelector } from 'react-redux'
 
-import { SearchContext } from '../../context'
 import type { SpecAction } from '../../reducers'
-import { setPattern } from '../../reducers'
 import { useWindowSize } from '../../utils'
 import { HEADER_REM } from '../Header'
+import { selectSearchCriteria, useSettingActions } from '../../state'
 import { SideNavMethodTags } from './SideNavMethodTags'
 import { SideNavTypeTags } from './SideNavTypeTags'
 import { useDebounce, countMethods, countTypes } from './searchUtils'
 import { SearchMessage } from './SearchMessage'
 
+interface SideNavState {
+  tags: TagList
+  typeTags: TypeTagList
+  methodCount: number
+  typeCount: number
+  searchResults?: ISearchResult
+}
+
 interface SideNavProps {
   headless?: boolean
   /** Specs to choose from */
@@ -66,7 +76,6 @@ interface SideNavProps {
 export const SideNav: FC<SideNavProps> = ({ headless = false, spec }) => {
   const history = useHistory()
   const location = useLocation()
-  const api = spec.api || ({} as ApiModel)
   const specKey = spec.key
   const tabNames = ['methods', 'types']
   const pathParts = location.pathname.split('/')
@@ -90,16 +99,19 @@ export const SideNav: FC<SideNavProps> = ({ headless = false, spec }) => {
     }
   }
   const tabs = useTabs({ defaultIndex, onChange: onTabChange })
-  const { searchSettings, setSearchSettings } = useContext(SearchContext)
-  const [pattern, setSearchPattern] = useState(searchSettings.pattern)
+  const searchCriteria = useSelector(selectSearchCriteria)
+  const { setSearchPatternAction } = useSettingActions()
+
+  const [pattern, setSearchPattern] = useState('')
   const debouncedPattern = useDebounce(pattern, 250)
-  const [searchResults, setSearchResults] = useState<ISearchResult>()
-  const searchCriteria = CriteriaToSet(searchSettings.criteria)
-  const [tags, setTags] = useState(api.tags || {})
-  const [typeTags, setTypeTags] = useState(api.typeTags || {})
-  const [types, setTypes] = useState(api.types || {})
-  const [methodCount, setMethodCount] = useState(countMethods(tags))
-  const [typeCount, setTypeCount] = useState(countTypes(types))
+  const [sideNavState, setSideNavState] = useState<SideNavState>(() => ({
+    tags: spec?.api?.tags || {},
+    typeTags: spec?.api?.typeTags || {},
+    methodCount: countMethods(spec?.api?.tags || {}),
+    typeCount: countTypes(spec?.api?.types || {}),
+    searchResults: undefined,
+  }))
+  const { tags, typeTags, methodCount, typeCount, searchResults } = sideNavState
 
   const handleInputChange = (value: string) => {
     setSearchPattern(value)
@@ -110,8 +122,10 @@ export const SideNav: FC<SideNavProps> = ({ headless = false, spec }) => {
     let newTags
     let newTypes
     let newTypeTags
+    const api = spec.api || ({} as ApiModel)
+
     if (debouncedPattern && api.search) {
-      results = api.search(pattern, searchCriteria)
+      results = api.search(pattern, criteriaToSet(searchCriteria))
       newTags = results.tags
       newTypes = results.types
       newTypeTags = tagTypes(api, results.types)
@@ -121,14 +135,22 @@ export const SideNav: FC<SideNavProps> = ({ headless = false, spec }) => {
       newTypeTags = api.typeTags || {}
     }
 
-    setTags(newTags)
-    setTypes(newTypes)
-    setTypeTags(newTypeTags)
-    setMethodCount(countMethods(newTags))
-    setTypeCount(countTypes(newTypes))
-    setSearchResults(results)
-    setSearchSettings(setPattern(debouncedPattern!))
-  }, [debouncedPattern, specKey, spec])
+    setSideNavState({
+      tags: newTags,
+      typeTags: newTypeTags,
+      typeCount: countTypes(newTypes),
+      methodCount: countMethods(newTags),
+      searchResults: results,
+    })
+    setSearchPatternAction({ searchPattern: debouncedPattern })
+  }, [
+    debouncedPattern,
+    specKey,
+    spec,
+    setSearchPatternAction,
+    pattern,
+    searchCriteria,
+  ])
 
   useEffect(() => {
     const { selectedIndex, onSelectTab } = tabs
@@ -153,7 +175,6 @@ export const SideNav: FC<SideNavProps> = ({ headless = false, spec }) => {
         placeholder="Search"
         value={pattern}
         isClearable
-        changeOnSelect
       />
       <SearchMessage search={searchResults} />
       <TabList {...tabs} distribute>

package/src/components/SideNav/SideNavMethodTags.spec.tsx

@@ -29,13 +29,15 @@ import { screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 
 import { api } from '../../test-data'
-import { renderWithSearchAndRouter } from '../../test-utils'
+import { renderWithRouterAndReduxProvider } from '../../test-utils'
 import { SideNavMethodTags } from './SideNavMethodTags'
 
 describe('SideNavTags', () => {
   const tags = pick(api.tags, ['ApiAuth', 'Dashboard'])
   test('it renders a provided tag and its methods', () => {
-    renderWithSearchAndRouter(<SideNavMethodTags tags={tags} specKey={'3.1'} />)
+    renderWithRouterAndReduxProvider(
+      <SideNavMethodTags tags={tags} specKey={'3.1'} />
+    )
     const tag = screen.getByText('Dashboard')
     const tagContent = 'Create Dashboard'
     expect(screen.queryByText(tagContent)).not.toBeInTheDocument()
@@ -46,7 +48,9 @@ describe('SideNavTags', () => {
   })
 
   test('tags are rendered initially collapsed and expand when clicked', () => {
-    renderWithSearchAndRouter(<SideNavMethodTags tags={tags} specKey={'3.1'} />)
+    renderWithRouterAndReduxProvider(
+      <SideNavMethodTags tags={tags} specKey={'3.1'} />
+    )
 
     const allTags = screen.getAllByText(/ApiAuth|Dashboard/)
     expect(allTags).toHaveLength(2)
@@ -58,10 +62,8 @@ describe('SideNavTags', () => {
   })
 
   test('tag is expanded if specified in route', () => {
-    renderWithSearchAndRouter(
+    renderWithRouterAndReduxProvider(
       <SideNavMethodTags tags={tags} specKey={'3.1'} />,
-      undefined,
-      undefined,
       ['/3.1/methods/Dashboard']
     )
 

package/src/components/SideNav/SideNavMethods.spec.tsx

@@ -29,7 +29,10 @@ import userEvent from '@testing-library/user-event'
 import { screen } from '@testing-library/react'
 
 import { api } from '../../test-data'
-import { renderWithSearchAndRouter } from '../../test-utils'
+import {
+  createTestStore,
+  renderWithRouterAndReduxProvider,
+} from '../../test-utils'
 import { SideNavMethods } from './SideNavMethods'
 
 describe('SideNavMethods', () => {
@@ -37,7 +40,7 @@ describe('SideNavMethods', () => {
   const methods = api.tags[tag]
 
   test('it renders provided methods', () => {
-    renderWithSearchAndRouter(
+    renderWithRouterAndReduxProvider(
       <SideNavMethods methods={methods} tag={tag} specKey={'3.1'} />
     )
     userEvent.click(screen.getByText(tag))
@@ -50,14 +53,15 @@ describe('SideNavMethods', () => {
   })
 
   test('it highlights text matching search pattern in both tag and methods', () => {
-    const highlightPattern = 'dash'
-    renderWithSearchAndRouter(
+    const store = createTestStore({ settings: { searchPattern: 'dash' } })
+    renderWithRouterAndReduxProvider(
       <SideNavMethods
         methods={pick(methods, 'create_dashboard')}
         tag={tag}
         specKey={'3.1'}
       />,
-      highlightPattern
+      undefined,
+      store
     )
     userEvent.click(screen.getByText('Dash'))
     const matches = screen.getAllByText(/dash/i)

package/src/components/SideNav/SideNavMethods.tsx

@@ -24,14 +24,16 @@
 
  */
 
-import React, { useContext, useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import styled from 'styled-components'
 import { Accordion2, Heading } from '@looker/components'
 import type { MethodList } from '@looker/sdk-codegen'
+import { useSelector } from 'react-redux'
 import { useHistory, useRouteMatch } from 'react-router-dom'
+
 import { Link } from '../Link'
 import { buildMethodPath, highlightHTML } from '../../utils'
-import { SearchContext } from '../../context'
+import { selectSearchPattern } from '../../state'
 
 interface MethodsProps {
   methods: MethodList
@@ -43,9 +45,7 @@ interface MethodsProps {
 
 export const SideNavMethods = styled(
   ({ className, methods, tag, specKey, defaultOpen = false }: MethodsProps) => {
-    const {
-      searchSettings: { pattern },
-    } = useContext(SearchContext)
+    const searchPattern = useSelector(selectSearchPattern)
     const match = useRouteMatch<{ methodTag: string }>(
       `/:specKey/methods/:methodTag/:methodName?`
     )
@@ -63,7 +63,7 @@ export const SideNavMethods = styled(
         ? defaultOpen || match.params.methodTag === tag
         : defaultOpen
       setIsOpen(status)
-    }, [defaultOpen, match])
+    }, [defaultOpen, match, tag])
 
     /* TODO: Fix highlighting. It is applied but it is somehow being overridden */
     return (
@@ -73,7 +73,7 @@ export const SideNavMethods = styled(
         className={className}
         label={
           <Heading as="h4" fontSize="small" py="xsmall">
-            {highlightHTML(pattern, tag)}
+            {highlightHTML(searchPattern, tag)}
           </Heading>
         }
       >
@@ -81,7 +81,7 @@ export const SideNavMethods = styled(
           {Object.values(methods).map((method) => (
             <li key={method.name}>
               <Link to={`${buildMethodPath(specKey, tag, method.name)}`}>
-                {highlightHTML(pattern, method.summary)}
+                {highlightHTML(searchPattern, method.summary)}
               </Link>
             </li>
           ))}

package/src/components/SideNav/SideNavTypeTags.spec.tsx

@@ -30,13 +30,15 @@ import { screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 
 import { api } from '../../test-data'
-import { renderWithSearchAndRouter } from '../../test-utils'
+import { renderWithRouterAndReduxProvider } from '../../test-utils'
 import { SideNavTypeTags } from './SideNavTypeTags'
 
 describe('SideNavTypeTags', () => {
   const tags = pick(api.typeTags, ['ApiAuth', 'Dashboard'])
   test('it renders a provided tag and its methods', () => {
-    renderWithSearchAndRouter(<SideNavTypeTags tags={tags} specKey={'3.1'} />)
+    renderWithRouterAndReduxProvider(
+      <SideNavTypeTags tags={tags} specKey={'3.1'} />
+    )
     const tag = screen.getByText('Dashboard')
     const tagContent = 'CreateDashboardFilter'
     expect(screen.queryByText(tagContent)).not.toBeInTheDocument()
@@ -47,7 +49,9 @@ describe('SideNavTypeTags', () => {
   })
 
   test('tags are rendered initially collapsed and expand when clicked', () => {
-    renderWithSearchAndRouter(<SideNavTypeTags tags={tags} specKey={'3.1'} />)
+    renderWithRouterAndReduxProvider(
+      <SideNavTypeTags tags={tags} specKey={'3.1'} />
+    )
 
     const allTags = screen.getAllByText(/ApiAuth|Dashboard/)
     expect(allTags).toHaveLength(2)
@@ -60,10 +64,8 @@ describe('SideNavTypeTags', () => {
 
   test('tag is expanded if specified in route', () => {
     const tags = pick(api.typeTags, ['ApiAuth', 'DataAction'])
-    renderWithSearchAndRouter(
+    renderWithRouterAndReduxProvider(
       <SideNavTypeTags tags={tags} specKey={'3.1'} />,
-      undefined,
-      undefined,
       ['/3.1/types/DataAction']
     )
 

package/src/components/SideNav/SideNavTypes.spec.tsx

@@ -27,12 +27,15 @@ import React from 'react'
 import { screen } from '@testing-library/react'
 
 import { api } from '../../test-data'
-import { renderWithSearchAndRouter } from '../../test-utils'
+import {
+  createTestStore,
+  renderWithRouterAndReduxProvider,
+} from '../../test-utils'
 import { SideNavTypes } from './SideNavTypes'
 
 describe('SideNavTypes', () => {
   test('it renders provided types', () => {
-    renderWithSearchAndRouter(
+    renderWithRouterAndReduxProvider(
       <SideNavTypes
         specKey={'3.1'}
         types={{
@@ -46,7 +49,8 @@ describe('SideNavTypes', () => {
   })
 
   test('it highlights text matching search pattern', () => {
-    renderWithSearchAndRouter(
+    const store = createTestStore({ settings: { searchPattern: 'dash' } })
+    renderWithRouterAndReduxProvider(
       <SideNavTypes
         specKey={'3.1'}
         types={{
@@ -54,7 +58,8 @@ describe('SideNavTypes', () => {
         }}
         tag="Dashboard"
       />,
-      'dash'
+      undefined,
+      store
     )
     const match = screen.getByText(/dash/i)
     expect(match).toContainHTML('<span class="hi">Dash</span>')

package/src/components/SideNav/SideNavTypes.tsx

@@ -24,14 +24,16 @@
 
  */
 
-import React, { useContext, useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import styled from 'styled-components'
 import { Accordion2, Heading } from '@looker/components'
 import type { TypeList } from '@looker/sdk-codegen'
 import { useHistory, useRouteMatch } from 'react-router-dom'
+import { useSelector } from 'react-redux'
+
 import { Link } from '../Link'
 import { buildTypePath, highlightHTML } from '../../utils'
-import { SearchContext } from '../../context'
+import { selectSearchPattern } from '../../state'
 
 interface TypesProps {
   types: TypeList
@@ -43,9 +45,7 @@ interface TypesProps {
 
 export const SideNavTypes = styled(
   ({ className, types, tag, specKey, defaultOpen = false }: TypesProps) => {
-    const {
-      searchSettings: { pattern },
-    } = useContext(SearchContext)
+    const searchPattern = useSelector(selectSearchPattern)
     const match = useRouteMatch<{ typeTag: string }>(
       `/:specKey/types/:typeTag/:typeName?`
     )
@@ -73,7 +73,7 @@ export const SideNavTypes = styled(
         className={className}
         label={
           <Heading as="h4" fontSize="small" py="xsmall">
-            {highlightHTML(pattern, tag)}
+            {highlightHTML(searchPattern, tag)}
           </Heading>
         }
       >
@@ -81,7 +81,7 @@ export const SideNavTypes = styled(
           {Object.values(types).map((type) => (
             <li key={type.name}>
               <Link to={`${buildTypePath(specKey, tag, type.name)}`}>
-                {highlightHTML(pattern, type.name)}
+                {highlightHTML(searchPattern, type.name)}
               </Link>
             </li>
           ))}

package/src/components/SideNav/{searchUtils.tsx → searchUtils.ts}

@@ -27,8 +27,8 @@
 import { useState, useEffect } from 'react'
 import type { TagList, TypeList } from '@looker/sdk-codegen'
 
-export const useDebounce = (value: any, delay: number) => {
-  const [debouncedValue, setDebouncedValue] = useState()
+export const useDebounce = <T>(value: T, delay: number): T => {
+  const [debouncedValue, setDebouncedValue] = useState(value)
   useEffect(() => {
     // Update debounced value only once delay has been elapsed
     const handler = setTimeout(() => {

package/src/components/common/Loader.tsx

@@ -32,7 +32,7 @@ import {
   Heading,
   ProgressCircular,
 } from '@looker/components'
-import type { ThemeOverrides } from '../../utils'
+import type { ThemeOverrides } from '@looker/extension-utils'
 
 export interface LoaderProps {
   themeOverrides: ThemeOverrides

package/src/{context/lode/index.ts → index.ts}

@@ -23,4 +23,7 @@
  SOFTWARE.
 
  */
-export { defaultLodeContextValue, LodeContext } from './LodeContext'
+export * from './ApiExplorer'
+export * from './StandaloneApiExplorer'
+export * from './components'
+export * from './state'

package/src/reducers/index.ts

@@ -24,4 +24,3 @@
 
  */
 export * from './spec'
-export * from './search'

package/src/routes/AppRouter.tsx

@@ -23,11 +23,13 @@
  SOFTWARE.
 
  */
+
 import type { FC } from 'react'
 import React from 'react'
 import { Redirect, Route, Switch } from 'react-router-dom'
 import type { ApiModel, SpecList } from '@looker/sdk-codegen'
 import type { RunItSetter } from '@looker/run-it'
+import type { IEnvironmentAdaptor } from '@looker/extension-utils'
 
 import {
   HomeScene,
@@ -37,7 +39,6 @@ import {
   TypeTagScene,
 } from '../scenes'
 import { DiffScene } from '../scenes/DiffScene'
-import type { IApixEnvAdaptor } from '../utils'
 import { diffPath } from '../utils'
 
 interface AppRouterProps {
@@ -45,7 +46,7 @@ interface AppRouterProps {
   specKey: string
   specs: SpecList
   toggleNavigation: (target?: boolean) => void
-  envAdaptor: IApixEnvAdaptor
+  adaptor: IEnvironmentAdaptor
   setVersionsUrl: RunItSetter
 }
 
@@ -54,7 +55,7 @@ export const AppRouter: FC<AppRouterProps> = ({
   api,
   specs,
   toggleNavigation,
-  envAdaptor,
+  adaptor,
   setVersionsUrl,
 }) => {
   return (
@@ -72,7 +73,7 @@ export const AppRouter: FC<AppRouterProps> = ({
       <Route path="/:specKey/methods/:methodTag/:methodName">
         <MethodScene
           api={api}
-          envAdaptor={envAdaptor}
+          adaptor={adaptor}
           setVersionsUrl={setVersionsUrl}
         />
       </Route>

package/src/scenes/MethodScene/MethodScene.tsx

@@ -25,7 +25,7 @@
  */
 
 import type { FC } from 'react'
-import React, { useContext, useState, useEffect } from 'react'
+import React, { useState, useEffect } from 'react'
 import {
   Aside,
   Button,
@@ -37,11 +37,12 @@ import {
 import { Beaker } from '@looker/icons'
 import { useHistory, useParams } from 'react-router-dom'
 import type { RunItSetter } from '@looker/run-it'
-import { RunIt, RunItContext, RunItFormKey } from '@looker/run-it'
+import { RunIt, RunItFormKey } from '@looker/run-it'
 import type { ApiModel } from '@looker/sdk-codegen'
 import { typeRefs } from '@looker/sdk-codegen'
 import { useSelector } from 'react-redux'
 
+import type { IEnvironmentAdaptor } from '@looker/extension-utils'
 import {
   ApixSection,
   DocActivityType,
@@ -57,12 +58,11 @@ import {
   DocSchema,
 } from '../../components'
 import { selectSdkLanguage } from '../../state'
-import type { IApixEnvAdaptor } from '../../utils'
 import { DocOperation, DocRequestBody } from './components'
 
 interface MethodSceneProps {
   api: ApiModel
-  envAdaptor: IApixEnvAdaptor
+  adaptor: IEnvironmentAdaptor
   setVersionsUrl: RunItSetter
 }
 
@@ -72,18 +72,17 @@ interface MethodSceneParams {
   specKey: string
 }
 
-const showRunIt = async (envAdaptor: IApixEnvAdaptor) => {
-  const data = await envAdaptor.localStorageGetItem(RunItFormKey)
+const showRunIt = async (adaptor: IEnvironmentAdaptor) => {
+  const data = await adaptor.localStorageGetItem(RunItFormKey)
   return !!data
 }
 
 export const MethodScene: FC<MethodSceneProps> = ({
   api,
-  envAdaptor,
+  adaptor,
   setVersionsUrl,
 }) => {
   const history = useHistory()
-  const { sdk } = useContext(RunItContext)
   const sdkLanguage = useSelector(selectSdkLanguage)
   const { specKey, methodTag, methodName } = useParams<MethodSceneParams>()
   const { value, toggle, setOn } = useToggle()
@@ -110,7 +109,7 @@ export const MethodScene: FC<MethodSceneProps> = ({
   useEffect(() => {
     const checkRunIt = async () => {
       try {
-        const show = await showRunIt(envAdaptor)
+        const show = await showRunIt(adaptor)
         if (show) {
           setOn()
         }
@@ -119,7 +118,7 @@ export const MethodScene: FC<MethodSceneProps> = ({
       }
     }
     checkRunIt()
-  }, [envAdaptor, setOn])
+  }, [adaptor, setOn])
 
   const runItToggle = (
     <RunItButton
@@ -157,7 +156,7 @@ export const MethodScene: FC<MethodSceneProps> = ({
           <DocSchema object={method.schema} />
         </ApixSection>
       )}
-      {sdk && value && (
+      {value && (
         <Aside width="50rem">
           <ExtendComponentsThemeProvider
             themeCustomizations={{
@@ -171,6 +170,7 @@ export const MethodScene: FC<MethodSceneProps> = ({
             }}
           >
             <RunIt
+              adaptor={adaptor}
               key={method.operationId}
               sdkLanguage={sdkLanguage}
               api={api}