@looker/api-explorer 0.9.54 → 0.9.57

package/src/scenes/MethodTagScene/MethodTagScene.spec.tsx

@@ -23,20 +23,20 @@
  SOFTWARE.
 
  */
-import React from 'react'
-import { Route } from 'react-router-dom'
-import { screen, waitFor } from '@testing-library/react'
-import userEvent from '@testing-library/user-event'
+import React from 'react';
+import { Route } from 'react-router-dom';
+import { screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 
-import { api } from '../../test-data'
-import { renderWithRouterAndReduxProvider } from '../../test-utils'
-import { MethodTagScene } from './MethodTagScene'
+import { api } from '../../test-data';
+import { renderWithRouterAndReduxProvider } from '../../test-utils';
+import { MethodTagScene } from './MethodTagScene';
 
-const opBtnNames = /ALL|GET|POST|PUT|PATCH|DELETE/
+const opBtnNames = /ALL|GET|POST|PUT|PATCH|DELETE/;
 
-const mockHistoryPush = jest.fn()
+const mockHistoryPush = jest.fn();
 jest.mock('react-router-dom', () => {
-  const ReactRouterDOM = jest.requireActual('react-router-dom')
+  const ReactRouterDOM = jest.requireActual('react-router-dom');
   return {
     ...ReactRouterDOM,
     useHistory: () => ({
@@ -45,11 +45,11 @@ jest.mock('react-router-dom', () => {
         pathname: '/4.0/methods/Look',
       },
     }),
-  }
-})
+  };
+});
 
 describe('MethodTagScene', () => {
-  Element.prototype.scrollTo = jest.fn()
+  Element.prototype.scrollTo = jest.fn();
 
   test('it renders operation buttons and all methods for a given method tag', () => {
     renderWithRouterAndReduxProvider(
@@ -57,22 +57,22 @@ describe('MethodTagScene', () => {
         <MethodTagScene api={api} />
       </Route>,
       ['/4.0/methods/ColorCollection']
-    )
+    );
     expect(
       screen.getAllByRole('button', {
         name: opBtnNames,
       })
-    ).toHaveLength(6)
+    ).toHaveLength(6);
     expect(screen.getAllByText(/^\/color_collections.*/)).toHaveLength(
       Object.keys(api.tags.ColorCollection).length
-    )
+    );
     expect(
       screen.getByText('/color_collections/standard').closest('a')
     ).toHaveAttribute(
       'href',
       '/4.0/methods/ColorCollection/color_collections_standard'
-    )
-  })
+    );
+  });
 
   test('it only renders operation buttons for operations that exist under that tag', () => {
     /** ApiAuth contains two POST methods and a DELETE method */
@@ -81,38 +81,38 @@ describe('MethodTagScene', () => {
         <MethodTagScene api={api} />
       </Route>,
       ['/4.0/methods/ApiAuth']
-    )
+    );
     expect(
       screen.getAllByRole('button', {
         name: opBtnNames,
       })
-    ).toHaveLength(3)
-  })
+    ).toHaveLength(3);
+  });
 
   test('it pushes filter to URL on toggle', async () => {
-    const site = '/4.0/methods/Look'
+    const site = '/4.0/methods/Look';
     renderWithRouterAndReduxProvider(
       <Route path="/:specKey/methods/:methodTag">
         <MethodTagScene api={api} />
       </Route>,
       [site]
-    )
+    );
     /** Filter by GET operation */
-    userEvent.click(screen.getByRole('button', { name: 'GET' }))
+    await userEvent.click(screen.getByRole('button', { name: 'GET' }));
     await waitFor(() => {
       expect(mockHistoryPush).toHaveBeenCalledWith({
         pathname: site,
         search: 't=get',
-      })
-    })
+      });
+    });
     /** Filter by DELETE operation */
-    userEvent.click(screen.getByRole('button', { name: 'DELETE' }))
+    await userEvent.click(screen.getByRole('button', { name: 'DELETE' }));
     await waitFor(() => {
       // eslint-disable-next-line jest-dom/prefer-in-document
       expect(mockHistoryPush).toHaveBeenCalledWith({
         pathname: site,
         search: 't=delete',
-      })
-    })
-  })
-})
+      });
+    });
+  });
+});

package/src/scenes/MethodTagScene/MethodTagScene.tsx

@@ -23,72 +23,77 @@
  SOFTWARE.
 
  */
-import type { FC } from 'react'
-import React, { useEffect, useState } from 'react'
-import { useHistory, useLocation, useParams } from 'react-router-dom'
-import { Grid, ButtonToggle, ButtonItem } from '@looker/components'
-import type { ApiModel } from '@looker/sdk-codegen'
-import { useSelector } from 'react-redux'
-import { ApixSection, DocTitle, DocMethodSummary, Link } from '../../components'
-import { buildMethodPath, isValidFilter, useNavigation } from '../../utils'
-import { selectTagFilter, useSettingActions } from '../../state'
-import { useTagStoreSync } from '../utils'
-import { getOperations } from './utils'
+import type { FC } from 'react';
+import React, { useEffect, useState } from 'react';
+import { useHistory, useLocation, useParams } from 'react-router-dom';
+import { ButtonItem, ButtonToggle, Grid } from '@looker/components';
+import type { ApiModel } from '@looker/sdk-codegen';
+import { useSelector } from 'react-redux';
+import {
+  ApixSection,
+  DocMethodSummary,
+  DocTitle,
+  Link,
+} from '../../components';
+import { buildMethodPath, isValidFilter, useNavigation } from '../../utils';
+import { selectTagFilter, useSettingActions } from '../../state';
+import { useTagStoreSync } from '../utils';
+import { getOperations } from './utils';
 
 interface MethodTagSceneProps {
-  api: ApiModel
+  api: ApiModel;
 }
 
 interface MethodTagSceneParams {
-  specKey: string
-  methodTag: string
+  specKey: string;
+  methodTag: string;
 }
 
 export const MethodTagScene: FC<MethodTagSceneProps> = ({ api }) => {
-  const { specKey, methodTag } = useParams<MethodTagSceneParams>()
-  const location = useLocation()
-  const history = useHistory()
-  const methods = api.tags[methodTag]
+  const { specKey, methodTag } = useParams<MethodTagSceneParams>();
+  const location = useLocation();
+  const history = useHistory();
+  const methods = api.tags[methodTag];
   const { navigate, buildPathWithGlobalParams, navigateWithGlobalParams } =
-    useNavigation()
-  const selectedTagFilter = useSelector(selectTagFilter)
-  const { setTagFilterAction } = useSettingActions()
-  const [tagFilter, setTagFilter] = useState(selectedTagFilter)
-  useTagStoreSync()
+    useNavigation();
+  const selectedTagFilter = useSelector(selectTagFilter);
+  const { setTagFilterAction } = useSettingActions();
+  const [tagFilter, setTagFilter] = useState(selectedTagFilter);
+  useTagStoreSync();
 
   const handleChange = (filter: string) => {
     navigate(location.pathname, {
       t: filter === 'ALL' ? null : filter.toLowerCase(),
-    })
-  }
+    });
+  };
 
   useEffect(() => {
-    const searchParams = new URLSearchParams(location.search)
-    let verbParam = searchParams.get('t') || 'ALL'
+    const searchParams = new URLSearchParams(location.search);
+    let verbParam = searchParams.get('t') || 'ALL';
     verbParam = isValidFilter(location.pathname, verbParam)
       ? verbParam.toUpperCase()
-      : 'ALL'
+      : 'ALL';
     setTagFilterAction({
       tagFilter: verbParam,
-    })
-  }, [location.search])
+    });
+  }, [location.search]);
 
   useEffect(() => {
-    setTagFilter(selectedTagFilter)
-  }, [selectedTagFilter])
+    setTagFilter(selectedTagFilter);
+  }, [selectedTagFilter]);
 
   useEffect(() => {
     if (!methods) {
-      navigateWithGlobalParams(`/${specKey}/methods`)
+      navigateWithGlobalParams(`/${specKey}/methods`);
     }
-  }, [history, methods])
+  }, [history, methods]);
   if (!methods) {
-    return <></>
+    return <></>;
   }
   const tag = Object.values(api.spec.tags!).find(
     (tag) => tag.name === methodTag
-  )!
-  const operations = getOperations(methods)
+  )!;
+  const operations = getOperations(methods);
 
   return (
     <ApixSection>
@@ -125,5 +130,5 @@ export const MethodTagScene: FC<MethodTagSceneProps> = ({ api }) => {
           )
       )}
     </ApixSection>
-  )
-}
+  );
+};

package/src/scenes/MethodTagScene/index.ts

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

package/src/scenes/MethodTagScene/utils.spec.ts

@@ -23,12 +23,12 @@
  SOFTWARE.
 
  */
-import { api } from '../../test-data'
-import { getOperations } from './utils'
+import { api } from '../../test-data';
+import { getOperations } from './utils';
 
 describe('MethodTagScene utils', () => {
   test('getOperations returns a unique list of operations', () => {
-    const actual = getOperations(api.tags.Query)
-    expect(actual).toHaveLength(new Set(actual).size)
-  })
-})
+    const actual = getOperations(api.tags.Query);
+    expect(actual).toHaveLength(new Set(actual).size);
+  });
+});

package/src/scenes/MethodTagScene/utils.ts

@@ -23,16 +23,16 @@
  SOFTWARE.
 
  */
-import type { MethodList } from '@looker/sdk-codegen'
+import type { MethodList } from '@looker/sdk-codegen';
 
 /**
  * Given a list of methods it returns a list of distinct operations
  * @param methods A list of methods
  */
 export const getOperations = (methods: MethodList) => {
-  const operationsSet = new Set<string>()
+  const operationsSet = new Set<string>();
   Object.values(methods).forEach((method) => {
-    operationsSet.add(method.httpMethod)
-  })
-  return Array.from(operationsSet.values())
-}
+    operationsSet.add(method.httpMethod);
+  });
+  return Array.from(operationsSet.values());
+};

package/src/scenes/TypeScene/TypeScene.tsx

@@ -24,50 +24,50 @@
 
  */
 
-import type { FC } from 'react'
-import React, { useEffect } from 'react'
-import type { ApiModel } from '@looker/sdk-codegen'
-import { typeRefs, methodRefs } from '@looker/sdk-codegen'
-import { useHistory, useParams } from 'react-router-dom'
-import { Space, Box } from '@looker/components'
+import type { FC } from 'react';
+import React, { useEffect } from 'react';
+import type { ApiModel } from '@looker/sdk-codegen';
+import { methodRefs, typeRefs } from '@looker/sdk-codegen';
+import { useHistory, useParams } from 'react-router-dom';
+import { Box, Space } from '@looker/components';
 
 import {
   ApixSection,
   DocReferences,
   DocSDKs,
+  DocSchema,
   DocSource,
   DocTitle,
   ExploreType,
-  DocSchema,
-} from '../../components'
-import { useNavigation } from '../../utils'
+} from '../../components';
+import { useNavigation } from '../../utils';
 
 interface DocTypeProps {
-  api: ApiModel
+  api: ApiModel;
 }
 
 interface DocTypeParams {
-  specKey: string
-  typeTag: string
-  typeName: string
+  specKey: string;
+  typeTag: string;
+  typeName: string;
 }
 
 export const TypeScene: FC<DocTypeProps> = ({ api }) => {
-  const { specKey, typeTag, typeName } = useParams<DocTypeParams>()
-  const type = api.types[typeName]
-  const history = useHistory()
-  const { navigate } = useNavigation()
-  const typesUsed = typeRefs(api, type?.customTypes)
-  const methodsUsedBy = methodRefs(api, type?.methodRefs)
-  const typesUsedBy = typeRefs(api, type?.parentTypes)
+  const { specKey, typeTag, typeName } = useParams<DocTypeParams>();
+  const type = api.types[typeName];
+  const history = useHistory();
+  const { navigate } = useNavigation();
+  const typesUsed = typeRefs(api, type?.customTypes);
+  const methodsUsedBy = methodRefs(api, type?.methodRefs);
+  const typesUsedBy = typeRefs(api, type?.parentTypes);
   useEffect(() => {
     if (!type) {
       const route = api.typeTags[typeTag]
         ? `/${specKey}/types/${typeTag}`
-        : `/${specKey}/types`
-      navigate(route)
+        : `/${specKey}/types`;
+      navigate(route);
     }
-  }, [history, specKey, type])
+  }, [history, specKey, type]);
 
   return (
     <>
@@ -92,5 +92,5 @@ export const TypeScene: FC<DocTypeProps> = ({ api }) => {
         </ApixSection>
       )}
     </>
-  )
-}
+  );
+};

package/src/scenes/TypeScene/index.ts

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

package/src/scenes/TypeTagScene/TypeTagScene.spec.tsx

@@ -23,21 +23,21 @@
  SOFTWARE.
 
  */
-import React from 'react'
-import { Route } from 'react-router-dom'
-import { screen, waitFor } from '@testing-library/react'
-import userEvent from '@testing-library/user-event'
+import React from 'react';
+import { Route } from 'react-router-dom';
+import { screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 
-import { api } from '../../test-data'
-import { renderWithRouterAndReduxProvider } from '../../test-utils'
-import { TypeTagScene } from './TypeTagScene'
+import { api } from '../../test-data';
+import { renderWithRouterAndReduxProvider } from '../../test-utils';
+import { TypeTagScene } from './TypeTagScene';
 
-const opBtnNames = /ALL|SPECIFICATION|WRITE|REQUEST|ENUMERATED/
+const opBtnNames = /ALL|SPECIFICATION|WRITE|REQUEST|ENUMERATED/;
 
-const path = '/:specKey/types/:typeTag'
-const mockHistoryPush = jest.fn()
+const path = '/:specKey/types/:typeTag';
+const mockHistoryPush = jest.fn();
 jest.mock('react-router-dom', () => {
-  const ReactRouterDOM = jest.requireActual('react-router-dom')
+  const ReactRouterDOM = jest.requireActual('react-router-dom');
   return {
     ...ReactRouterDOM,
     useLocation: () => ({
@@ -49,11 +49,11 @@ jest.mock('react-router-dom', () => {
         pathname: '/4.0/types/Look',
       },
     }),
-  }
-})
+  };
+});
 
 describe('TypeTagScene', () => {
-  Element.prototype.scrollTo = jest.fn()
+  Element.prototype.scrollTo = jest.fn();
   // const mockHistoryPush: jest.Mock = useHistory as jest.Mock
 
   test('it renders type buttons and all methods for a given type tag', () => {
@@ -62,20 +62,20 @@ describe('TypeTagScene', () => {
         <TypeTagScene api={api} />
       </Route>,
       ['/4.0/types/Dashboard']
-    )
+    );
     expect(
       screen.getAllByRole('button', {
         name: opBtnNames,
       })
-    ).toHaveLength(4)
+    ).toHaveLength(4);
     expect(screen.getAllByRole('heading', { level: 3 })).toHaveLength(
       Object.keys(api.typeTags.Dashboard).length
-    )
+    );
     expect(screen.getByText('DashboardBase').closest('a')).toHaveAttribute(
       'href',
       '/4.0/types/Dashboard/DashboardBase'
-    )
-  })
+    );
+  });
 
   test('it only renders operation buttons for operations that exist under that tag', () => {
     renderWithRouterAndReduxProvider(
@@ -83,37 +83,39 @@ describe('TypeTagScene', () => {
         <TypeTagScene api={api} />
       </Route>,
       ['/4.0/types/DataAction']
-    )
+    );
     expect(
       screen.getAllByRole('button', {
         name: opBtnNames,
       })
-    ).toHaveLength(2)
-  })
+    ).toHaveLength(2);
+  });
 
   test('it pushes filter to URL on toggle', async () => {
-    const site = '/4.0/types/Look'
+    const site = '/4.0/types/Look';
     renderWithRouterAndReduxProvider(
       <Route path={path}>
         <TypeTagScene api={api} />
       </Route>,
       [site]
-    )
+    );
     /** Filter by SPECIFICATION */
-    userEvent.click(screen.getByRole('button', { name: 'SPECIFICATION' }))
+    await userEvent.click(
+      screen.getByRole('button', { name: 'SPECIFICATION' })
+    );
     await waitFor(() => {
       expect(mockHistoryPush).toHaveBeenCalledWith({
         pathname: site,
         search: 't=specification',
-      })
-    })
+      });
+    });
     /** Filter by REQUEST */
-    userEvent.click(screen.getByRole('button', { name: 'REQUEST' }))
+    await userEvent.click(screen.getByRole('button', { name: 'REQUEST' }));
     await waitFor(() => {
       expect(mockHistoryPush).toHaveBeenCalledWith({
         pathname: site,
         search: 't=request',
-      })
-    })
-  })
-})
+      });
+    });
+  });
+});

package/src/scenes/TypeTagScene/TypeTagScene.tsx

@@ -23,71 +23,73 @@
  SOFTWARE.
 
  */
-import type { FC } from 'react'
-import React, { useEffect, useState } from 'react'
-import { Grid, ButtonToggle, ButtonItem } from '@looker/components'
-import type { ApiModel } from '@looker/sdk-codegen'
-import { useLocation, useParams } from 'react-router-dom'
-import { useSelector } from 'react-redux'
-import { ApixSection, DocTitle, DocTypeSummary, Link } from '../../components'
-import { buildTypePath, isValidFilter, useNavigation } from '../../utils'
-import { selectTagFilter, useSettingActions } from '../../state'
-import { useTagStoreSync } from '../utils'
-import { getMetaTypes } from './utils'
+import type { FC } from 'react';
+import React, { useEffect, useState } from 'react';
+import { ButtonItem, ButtonToggle, Grid } from '@looker/components';
+import type { ApiModel } from '@looker/sdk-codegen';
+import { useLocation, useParams } from 'react-router-dom';
+import { useSelector } from 'react-redux';
+import { ApixSection, DocTitle, DocTypeSummary, Link } from '../../components';
+import { buildTypePath, isValidFilter, useNavigation } from '../../utils';
+import { selectTagFilter, useSettingActions } from '../../state';
+import { useTagStoreSync } from '../utils';
+import { getMetaTypes } from './utils';
 
 interface TypeTagSceneProps {
-  api: ApiModel
+  api: ApiModel;
 }
 
 interface TypeTagSceneParams {
-  specKey: string
-  typeTag: string
+  specKey: string;
+  typeTag: string;
 }
 
 export const TypeTagScene: FC<TypeTagSceneProps> = ({ api }) => {
-  const { specKey, typeTag } = useParams<TypeTagSceneParams>()
-  const location = useLocation()
+  const { specKey, typeTag } = useParams<TypeTagSceneParams>();
+  const location = useLocation();
   const { navigate, buildPathWithGlobalParams, navigateWithGlobalParams } =
-    useNavigation()
-  const selectedTagFilter = useSelector(selectTagFilter)
-  const { setTagFilterAction } = useSettingActions()
-  const [tagFilter, setTagFilter] = useState(selectedTagFilter)
-  useTagStoreSync()
+    useNavigation();
+  const selectedTagFilter = useSelector(selectTagFilter);
+  const { setTagFilterAction } = useSettingActions();
+  const [tagFilter, setTagFilter] = useState(selectedTagFilter);
+  useTagStoreSync();
 
   const handleChange = (filter: string) => {
     navigate(location.pathname, {
       t: filter === 'ALL' ? null : filter.toLowerCase(),
-    })
-  }
+    });
+  };
 
   useEffect(() => {
-    const searchParams = new URLSearchParams(location.search)
-    let verbParam = searchParams.get('t') || 'ALL'
+    const searchParams = new URLSearchParams(location.search);
+    let verbParam = searchParams.get('t') || 'ALL';
     verbParam = isValidFilter(location.pathname, verbParam)
       ? verbParam.toUpperCase()
-      : 'ALL'
+      : 'ALL';
     setTagFilterAction({
       tagFilter: verbParam,
-    })
-  }, [location.search])
+    });
+  }, [location.search]);
 
-  const types = api.typeTags[typeTag]
+  const types = api.typeTags[typeTag];
   useEffect(() => {
     if (!types) {
-      navigateWithGlobalParams(`/${specKey}/types`)
+      navigateWithGlobalParams(`/${specKey}/types`);
     }
-  }, [types])
+  }, [types]);
 
   useEffect(() => {
-    setTagFilter(selectedTagFilter)
-  }, [selectedTagFilter])
+    setTagFilter(selectedTagFilter);
+  }, [selectedTagFilter]);
 
   if (!types) {
-    return <></>
+    return <></>;
   }
 
-  const tag = Object.values(api.spec.tags!).find((tag) => tag.name === typeTag)!
-  const metaTypes = getMetaTypes(types)
+  const tag = Object.values(api.spec.tags!).find(
+    (tag) => tag.name === typeTag
+  )!;
+  const metaTypes = getMetaTypes(types);
   return (
     <ApixSection>
       <DocTitle>{`${tag.name}: ${tag.description}`}</DocTitle>
@@ -123,5 +125,5 @@ export const TypeTagScene: FC<TypeTagSceneProps> = ({ api }) => {
           )
       )}
     </ApixSection>
-  )
-}
+  );
+};

package/src/scenes/TypeTagScene/index.ts

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

package/src/scenes/TypeTagScene/utils.spec.ts

@@ -23,12 +23,12 @@
  SOFTWARE.
 
  */
-import { api } from '../../test-data'
-import { getMetaTypes } from './utils'
+import { api } from '../../test-data';
+import { getMetaTypes } from './utils';
 
 describe('TypeTagScene utils', () => {
   test('getMetaTypes returns a unique list of MetaTypes', () => {
-    const actual = getMetaTypes(api.typeTags.Query)
-    expect(actual).toHaveLength(4)
-  })
-})
+    const actual = getMetaTypes(api.typeTags.Query);
+    expect(actual).toHaveLength(4);
+  });
+});