@looker/api-explorer 0.9.54 → 0.9.57

package/src/ApiExplorer.tsx

@@ -24,9 +24,9 @@
 
  */
 
-import type { FC } from 'react'
-import React, { useState, useEffect, useCallback } from 'react'
-import styled, { createGlobalStyle } from 'styled-components'
+import type { FC } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
+import styled, { createGlobalStyle } from 'styled-components';
 import {
   Aside,
   ComponentsProvider,
@@ -36,48 +36,48 @@ import {
   Layout,
   Page,
   Space,
-} from '@looker/components'
-import { FirstPage } from '@styled-icons/material/FirstPage'
-import { LastPage } from '@styled-icons/material/LastPage'
+} from '@looker/components';
+import { FirstPage } from '@styled-icons/material/FirstPage';
+import { LastPage } from '@styled-icons/material/LastPage';
 import {
   registerEnvAdaptor,
   unregisterEnvAdaptor,
-} from '@looker/extension-utils'
-import { useSelector } from 'react-redux'
-import { useLocation } from 'react-router-dom'
+} from '@looker/extension-utils';
+import { useSelector } from 'react-redux';
+import { useLocation } from 'react-router-dom';
 
-import type { IApixAdaptor } from './utils'
+import type { IApixAdaptor } from './utils';
 import {
-  Header,
-  SideNav,
+  Banner,
   ErrorBoundary,
-  SelectorContainer,
   HEADER_TOGGLE_LABEL,
+  Header,
   Loader,
-  Banner,
-} from './components'
-import { AppRouter } from './routes'
-import { apixFilesHost } from './utils/lodeUtils'
+  SelectorContainer,
+  SideNav,
+} from './components';
+import { AppRouter } from './routes';
+import { apixFilesHost } from './utils/lodeUtils';
 import {
-  useSettingActions,
+  selectCurrentSpec,
+  selectSpecs,
   useLodeActions,
   useLodesStoreState,
+  useSettingActions,
+  useSettingStoreState,
   useSpecActions,
   useSpecStoreState,
-  selectSpecs,
-  selectCurrentSpec,
-  useSettingStoreState,
-} from './state'
-import { getSpecKey, findSdk, useGlobalStoreSync } from './utils'
+} from './state';
+import { findSdk, getSpecKey, useGlobalStoreSync } from './utils';
 
 export interface ApiExplorerProps {
-  adaptor: IApixAdaptor
-  examplesLodeUrl?: string
-  declarationsLodeUrl?: string
-  headless?: boolean
+  adaptor: IApixAdaptor;
+  examplesLodeUrl?: string;
+  declarationsLodeUrl?: string;
+  headless?: boolean;
 }
 
-const BodyOverride = createGlobalStyle` html { height: 100%; overflow: hidden; } `
+const BodyOverride = createGlobalStyle` html { height: 100%; overflow: hidden; } `;
 
 export const ApiExplorer: FC<ApiExplorerProps> = ({
   adaptor,
@@ -85,72 +85,72 @@ export const ApiExplorer: FC<ApiExplorerProps> = ({
   declarationsLodeUrl = `${apixFilesHost}/declarationsIndex.json`,
   headless = false,
 }) => {
-  useLodesStoreState()
-  const { working, description } = useSpecStoreState()
-  const specs = useSelector(selectSpecs)
-  const spec = useSelector(selectCurrentSpec)
-  const { initLodesAction } = useLodeActions()
-  const { initialized } = useSettingStoreState()
+  useLodesStoreState();
+  const { working, description } = useSpecStoreState();
+  const specs = useSelector(selectSpecs);
+  const spec = useSelector(selectCurrentSpec);
+  const { initLodesAction } = useLodeActions();
+  const { initialized } = useSettingStoreState();
   const { initSettingsAction, setSearchPatternAction, setSdkLanguageAction } =
-    useSettingActions()
-  const { initSpecsAction, setCurrentSpecAction } = useSpecActions()
+    useSettingActions();
+  const { initSpecsAction, setCurrentSpecAction } = useSpecActions();
 
-  const location = useLocation()
-  useGlobalStoreSync()
-  const [hasNavigation, setHasNavigation] = useState(true)
+  const location = useLocation();
+  useGlobalStoreSync();
+  const [hasNavigation, setHasNavigation] = useState(true);
   const toggleNavigation = (target?: boolean) =>
-    setHasNavigation(target || !hasNavigation)
+    setHasNavigation(target || !hasNavigation);
 
   const hasNavigationToggle = useCallback((e: MessageEvent<any>) => {
     if (e.origin === window.origin && e.data.action === 'toggle_sidebar') {
-      setHasNavigation((currentHasNavigation) => !currentHasNavigation)
+      setHasNavigation((currentHasNavigation) => !currentHasNavigation);
     }
-  }, [])
+  }, []);
 
-  registerEnvAdaptor(adaptor)
+  registerEnvAdaptor(adaptor);
 
   useEffect(() => {
-    initSettingsAction()
-    initLodesAction({ examplesLodeUrl, declarationsLodeUrl })
+    initSettingsAction();
+    initLodesAction({ examplesLodeUrl, declarationsLodeUrl });
 
-    const specKey = getSpecKey(location)
-    initSpecsAction({ specKey })
-    return () => unregisterEnvAdaptor()
-  }, [])
+    const specKey = getSpecKey(location);
+    initSpecsAction({ specKey });
+    return () => unregisterEnvAdaptor();
+  }, []);
 
   useEffect(() => {
-    const maybeSpec = location.pathname?.split('/')[1]
+    const maybeSpec = location.pathname?.split('/')[1];
     if (spec && maybeSpec && maybeSpec !== spec.key) {
-      setCurrentSpecAction({ currentSpecKey: maybeSpec })
+      setCurrentSpecAction({ currentSpecKey: maybeSpec });
     }
-  }, [location.pathname, spec])
+  }, [location.pathname, spec]);
 
   useEffect(() => {
-    if (!initialized) return
-    const searchParams = new URLSearchParams(location.search)
-    const searchPattern = searchParams.get('s') || ''
-    const sdkParam = searchParams.get('sdk') || 'all'
-    const { language: sdkLanguage } = findSdk(sdkParam)
-    setSearchPatternAction({ searchPattern })
-    setSdkLanguageAction({ sdkLanguage })
-  }, [location.search])
+    if (!initialized) return;
+    const searchParams = new URLSearchParams(location.search);
+    const searchPattern = searchParams.get('s') || '';
+    const sdkParam = searchParams.get('sdk') || 'all';
+    const { language: sdkLanguage } = findSdk(sdkParam);
+    setSearchPatternAction({ searchPattern });
+    setSdkLanguageAction({ sdkLanguage });
+  }, [location.search]);
 
   useEffect(() => {
     if (headless) {
-      window.addEventListener('message', hasNavigationToggle)
+      window.addEventListener('message', hasNavigationToggle);
     }
     return () => {
       if (headless) {
-        window.removeEventListener('message', hasNavigationToggle)
+        window.removeEventListener('message', hasNavigationToggle);
       }
-    }
-  }, [headless, hasNavigationToggle])
+    };
+  }, [headless, hasNavigationToggle]);
 
-  const themeOverrides = adaptor.themeOverrides()
+  const themeOverrides = adaptor.themeOverrides();
 
-  let neededSpec = location.pathname?.split('/')[1]
+  let neededSpec = location.pathname?.split('/')[1];
   if (!neededSpec) {
-    neededSpec = spec?.key
+    neededSpec = spec?.key;
   }
 
   return (
@@ -228,13 +228,13 @@ export const ApiExplorer: FC<ApiExplorerProps> = ({
       </ComponentsProvider>
       {!headless && <BodyOverride />}
     </>
-  )
-}
+  );
+};
 
 const AsideBorder = styled(Aside)<{
-  isOpen: boolean
-  headless: boolean
+  isOpen: boolean;
+  headless: boolean;
 }>`
   width: ${({ isOpen, headless }) =>
     isOpen ? '20rem' : headless ? '2.75rem' : '0rem'};
-`
+`;

package/src/App.tsx

@@ -24,26 +24,26 @@
 
  */
 
-import React from 'react'
-import { BrowserRouter as Router } from 'react-router-dom'
-import ReactDOM from 'react-dom'
-import { createGlobalStyle } from 'styled-components'
-import { StandaloneApiExplorer } from './StandaloneApiExplorer'
+import React from 'react';
+import { BrowserRouter as Router } from 'react-router-dom';
+import ReactDOM from 'react-dom';
+import { createGlobalStyle } from 'styled-components';
+import { StandaloneApiExplorer } from './StandaloneApiExplorer';
 
 const BodyReset = createGlobalStyle`
   body {
     margin: 0;
   }
-`
+`;
 
 const basename = (window as any).LOOKER_DEV_PORTAL
   ? (window as any).LOOKER_DEV_PORTAL.basename
-  : undefined
+  : undefined;
 
 const versionsUrl = new URL(
   'versions.json',
   (window as any).location.origin
-).toString()
+).toString();
 
 ReactDOM.render(
   <Router basename={basename}>
@@ -51,4 +51,4 @@ ReactDOM.render(
     <BodyReset />
   </Router>,
   document.getElementById('container')
-)
+);

package/src/StandaloneApiExplorer.tsx

@@ -24,22 +24,22 @@
 
  */
 
-import type { FC } from 'react'
-import React, { useEffect, useState } from 'react'
-import { initRunItSdk, RunItProvider } from '@looker/run-it'
-import type { OAuthConfigProvider } from '@looker/extension-utils'
-import { OAuthScene } from '@looker/extension-utils'
-import { Provider } from 'react-redux'
-import { useLocation } from 'react-router'
+import type { FC } from 'react';
+import React, { useEffect, useState } from 'react';
+import { RunItProvider, initRunItSdk } from '@looker/run-it';
+import type { OAuthConfigProvider } from '@looker/extension-utils';
+import { OAuthScene } from '@looker/extension-utils';
+import { Provider } from 'react-redux';
+import { useLocation } from 'react-router';
 
-import { ApiExplorer } from './ApiExplorer'
-import { store } from './state'
-import { oAuthPath, ApixAdaptor } from './utils'
-import { Loader } from './components'
+import { ApiExplorer } from './ApiExplorer';
+import { store } from './state';
+import { ApixAdaptor, oAuthPath } from './utils';
+import { Loader } from './components';
 
 export interface StandaloneApiExplorerProps {
-  headless?: boolean
-  versionsUrl: string
+  headless?: boolean;
+  versionsUrl: string;
 }
 
 export const StandaloneApiExplorer: FC<StandaloneApiExplorerProps> = ({
@@ -47,25 +47,25 @@ export const StandaloneApiExplorer: FC<StandaloneApiExplorerProps> = ({
 }) => {
   const [browserAdaptor] = useState(
     new ApixAdaptor(initRunItSdk(), window.origin)
-  )
-  const location = useLocation()
-  const oauthReturn = location.pathname === `/${oAuthPath}`
-  const sdk = browserAdaptor.sdk
+  );
+  const location = useLocation();
+  const oauthReturn = location.pathname === `/${oAuthPath}`;
+  const sdk = browserAdaptor.sdk;
   const canLogin =
     (sdk.authSession.settings as OAuthConfigProvider).authIsConfigured() &&
     !sdk.authSession.isAuthenticated() &&
-    !oauthReturn
+    !oauthReturn;
 
   useEffect(() => {
-    const login = async () => await browserAdaptor.login()
+    const login = async () => await browserAdaptor.login();
     if (canLogin) {
-      login()
+      login();
     }
-  }, [])
+  }, []);
 
   const { looker_url } = (
     sdk.authSession.settings as OAuthConfigProvider
-  ).getStoredConfig()
+  ).getStoredConfig();
 
   return (
     <Provider store={store}>
@@ -86,5 +86,5 @@ export const StandaloneApiExplorer: FC<StandaloneApiExplorerProps> = ({
         )}
       </RunItProvider>
     </Provider>
-  )
-}
+  );
+};

package/src/components/Banner/Banner.spec.tsx

@@ -23,12 +23,12 @@
  SOFTWARE.
 
  */
-import React from 'react'
-import { renderWithTheme } from '@looker/components-test-utils'
-import { screen, fireEvent, waitFor } from '@testing-library/react'
-import type { IEnvironmentAdaptor } from '@looker/extension-utils'
-import type { SpecList } from '@looker/sdk-codegen'
-import { Banner } from './Banner'
+import React from 'react';
+import { renderWithTheme } from '@looker/components-test-utils';
+import { fireEvent, screen, waitFor } from '@testing-library/react';
+import type { IEnvironmentAdaptor } from '@looker/extension-utils';
+import type { SpecList } from '@looker/sdk-codegen';
+import { Banner } from './Banner';
 
 describe('Banner', () => {
   const specs: any = {
@@ -38,62 +38,64 @@ describe('Banner', () => {
     '4.0': {
       status: 'beta',
     },
-  }
+  };
 
   test('renders with button that opens api 4.0 dev portal link in new page', async () => {
     const adaptor: any = {
       localStorageGetItem: jest.fn().mockReturnValue(Promise.resolve(null)),
       isExtension: jest.fn().mockReturnValue(true),
-    }
+    };
     renderWithTheme(
       <Banner
         adaptor={adaptor as IEnvironmentAdaptor}
         specs={specs as SpecList}
       />
-    )
+    );
 
     await waitFor(() => {
       expect(
         screen.getByText('API 4.0 moves from Beta', { exact: false })
-      ).toBeInTheDocument()
-      const link = screen.getByText('Announcement').closest('a')
+      ).toBeInTheDocument();
+      const link = screen.getByText('Announcement').closest('a');
+      // eslint-disable-next-line testing-library/no-wait-for-multiple-assertions
       expect(link).toHaveAttribute(
         'href',
         'https://developers.looker.com/api/advanced-usage/version-4-ga'
-      )
-      expect(link).toHaveAttribute('target', '_blank')
-    })
-  })
+      );
+      // eslint-disable-next-line testing-library/no-wait-for-multiple-assertions
+      expect(link).toHaveAttribute('target', '_blank');
+    });
+  });
 
   test('sets local storage value and unrenders on close button click', async () => {
     const adaptor: any = {
       localStorageGetItem: jest.fn().mockReturnValue(Promise.resolve(null)),
       localStorageSetItem: jest.fn(),
       isExtension: jest.fn().mockReturnValue(true),
-    }
+    };
 
     renderWithTheme(
       <Banner
         adaptor={adaptor as IEnvironmentAdaptor}
         specs={specs as SpecList}
       />
-    )
+    );
 
     await waitFor(() => {
       expect(
         screen.getByText('API 4.0 moves from Beta', { exact: false })
-      ).toBeInTheDocument()
-    })
+      ).toBeInTheDocument();
+    });
 
-    const closeButton = screen.getByText('Dismiss Inform').closest('button')
-    fireEvent.click(closeButton as HTMLButtonElement)
+    const closeButton = screen.getByText('Dismiss Inform').closest('button');
+    fireEvent.click(closeButton as HTMLButtonElement);
 
     expect(
       screen.queryByText('API 4.0 moves from Beta', { exact: false })
-    ).not.toBeInTheDocument()
+    ).not.toBeInTheDocument();
     expect(adaptor.localStorageSetItem).toHaveBeenCalledWith(
       'api-40-ga-apix-banner',
       'dismissed'
-    )
-  })
-})
+    );
+  });
+});

package/src/components/Banner/Banner.tsx

@@ -23,23 +23,23 @@
  SOFTWARE.
 
  */
-import { ButtonOutline, Link, MessageBar } from '@looker/components'
-import type { IEnvironmentAdaptor } from '@looker/extension-utils'
-import type { SpecList } from '@looker/sdk-codegen'
-import type { FC } from 'react'
-import React, { useState, useEffect } from 'react'
+import { ButtonOutline, Link, MessageBar } from '@looker/components';
+import type { IEnvironmentAdaptor } from '@looker/extension-utils';
+import type { SpecList } from '@looker/sdk-codegen';
+import type { FC } from 'react';
+import React, { useEffect, useState } from 'react';
 
-const LOCAL_STORAGE_KEY = 'api-40-ga-apix-banner'
-const LOCAL_STORAGE_VALUE = 'dismissed'
+const LOCAL_STORAGE_KEY = 'api-40-ga-apix-banner';
+const LOCAL_STORAGE_VALUE = 'dismissed';
 
 export interface BannerProps {
-  adaptor: IEnvironmentAdaptor
-  specs: SpecList
+  adaptor: IEnvironmentAdaptor;
+  specs: SpecList;
 }
 
 export const Banner: FC<BannerProps> = ({ adaptor, specs }) => {
-  const [isOpen, setOpen] = useState(false)
-  useEffect(onLoad, [])
+  const [isOpen, setOpen] = useState(false);
+  useEffect(onLoad, []);
 
   if (isOpen) {
     return (
@@ -59,9 +59,9 @@ export const Banner: FC<BannerProps> = ({ adaptor, specs }) => {
         additions and possible breaking changes. Read the announcement to see
         how this affects you.
       </MessageBar>
-    )
+    );
   } else {
-    return null
+    return null;
   }
 
   function onLoad() {
@@ -71,17 +71,17 @@ export const Banner: FC<BannerProps> = ({ adaptor, specs }) => {
       // 4.0 is stable in Looker 22.4+. 4.0 is default or `current` in 22.4+.
       // Still check for `stable` just in case new version comes along.
       const is40Stable =
-        specs['4.0'].status === 'stable' || specs['4.0'].status === 'current'
+        specs['4.0'].status === 'stable' || specs['4.0'].status === 'current';
       const wasDismissed =
         (await adaptor.localStorageGetItem(LOCAL_STORAGE_KEY)) ===
-        LOCAL_STORAGE_VALUE
-      setOpen(!is40Stable && !wasDismissed && adaptor.isExtension())
+        LOCAL_STORAGE_VALUE;
+      setOpen(!is40Stable && !wasDismissed && adaptor.isExtension());
     }
-    innerOnLoad()
+    innerOnLoad();
   }
 
   function onClose() {
-    adaptor.localStorageSetItem(LOCAL_STORAGE_KEY, LOCAL_STORAGE_VALUE)
-    setOpen(false)
+    adaptor.localStorageSetItem(LOCAL_STORAGE_KEY, LOCAL_STORAGE_VALUE);
+    setOpen(false);
   }
-}
+};

package/src/components/Banner/index.ts

@@ -23,4 +23,4 @@
  SOFTWARE.
 
  */
-export { Banner } from './Banner'
+export { Banner } from './Banner';

package/src/components/DocActivityType/DocActivityType.spec.tsx

@@ -23,28 +23,29 @@
  SOFTWARE.
 
  */
-import React from 'react'
-import { renderWithTheme } from '@looker/components-test-utils'
-import { screen, fireEvent, waitFor } from '@testing-library/react'
+import React from 'react';
+import { renderWithTheme } from '@looker/components-test-utils';
+import { fireEvent, screen, waitFor } from '@testing-library/react';
 
-import { api } from '../../test-data'
-import { DocActivityType } from './DocActivityType'
+import { api } from '../../test-data';
+import { DocActivityType } from './DocActivityType';
 
 describe('DocActivityType', () => {
-  const method = api.methods.run_inline_query
+  const method = api.methods.run_inline_query;
   test('it renders', () => {
-    renderWithTheme(<DocActivityType method={method} />)
-    expect(screen.getByText('db_query')).toBeInTheDocument()
-  })
+    renderWithTheme(<DocActivityType method={method} />);
+    expect(screen.getByText('db_query')).toBeInTheDocument();
+  });
 
   test('it displays a tooltip with the right information on hover', async () => {
-    renderWithTheme(<DocActivityType method={method} />)
-    const costSymbol = screen.getByText('$')
+    renderWithTheme(<DocActivityType method={method} />);
+    const costSymbol = screen.getByText('$');
     await waitFor(() => {
-      fireEvent.mouseOver(costSymbol)
+      // eslint-disable-next-line testing-library/no-wait-for-side-effects
+      fireEvent.mouseOver(costSymbol);
       expect(screen.getByRole('tooltip')).toHaveTextContent(
         'Call volume for this endpoint counts toward the "db_query" API activity category.'
-      )
-    })
-  })
-})
+      );
+    });
+  });
+});

package/src/components/DocActivityType/DocActivityType.tsx

@@ -23,13 +23,13 @@
  SOFTWARE.
 
  */
-import type { FC } from 'react'
-import React from 'react'
-import { Code, Tooltip, Badge } from '@looker/components'
-import type { IMethod } from '@looker/sdk-codegen'
+import type { FC } from 'react';
+import React from 'react';
+import { Badge, Code, Tooltip } from '@looker/components';
+import type { IMethod } from '@looker/sdk-codegen';
 
 interface DocActivityTypeProps {
-  method: IMethod
+  method: IMethod;
 }
 export const DocActivityType: FC<DocActivityTypeProps> = ({ method }) => (
   <>
@@ -52,4 +52,4 @@ export const DocActivityType: FC<DocActivityTypeProps> = ({ method }) => (
       </>
     )}
   </>
-)
+);

package/src/components/DocActivityType/index.ts

@@ -23,4 +23,4 @@
  SOFTWARE.
 
  */
-export { DocActivityType } from './DocActivityType'
+export { DocActivityType } from './DocActivityType';

package/src/components/DocCode/DocCode.tsx

@@ -24,23 +24,25 @@
 
  */
 
-import type { FC } from 'react'
-import React from 'react'
-import { findGenerator } from '@looker/sdk-codegen'
-import { CodeDisplay } from '@looker/code-editor'
-import { useSelector } from 'react-redux'
+import type { FC } from 'react';
+import React from 'react';
+import { findGenerator } from '@looker/sdk-codegen';
+import { CodeDisplay } from '@looker/code-editor';
+import { useSelector } from 'react-redux';
 
-import { selectSearchPattern } from '../../state'
+import { selectSearchPattern } from '../../state';
 
 interface DocCodeProps {
-  code: string
-  language?: string
+  code: string;
+  language?: string;
 }
 
 export const DocCode: FC<DocCodeProps> = ({ code, language = 'json' }) => {
-  const searchPattern = useSelector(selectSearchPattern)
-  const gen = findGenerator(language)
-  if (gen) language = gen.language.toLocaleLowerCase()
-
-  return <CodeDisplay language={language} code={code} pattern={searchPattern} />
-}
+  const searchPattern = useSelector(selectSearchPattern);
+  const gen = findGenerator(language);
+  if (gen) language = gen.language.toLocaleLowerCase();
+
+  return (
+    <CodeDisplay language={language} code={code} pattern={searchPattern} />
+  );
+};

package/src/components/DocCode/index.ts

@@ -23,4 +23,4 @@
  SOFTWARE.
 
  */
-export { DocCode } from './DocCode'
+export { DocCode } from './DocCode';