use type assertion functions from graphql-js

Author: thomasheyenbrock

packages/graphiql-react/src/editor/completion.ts

@@ -1,11 +1,6 @@
 import type { Editor, EditorChange } from 'codemirror';
 import escapeHTML from 'escape-html';
-import {
-  GraphQLList,
-  GraphQLNonNull,
-  GraphQLSchema,
-  GraphQLType,
-} from 'graphql';
+import { GraphQLSchema, GraphQLType, isListType, isNonNullType } from 'graphql';
 
 import { ExplorerContextType } from '../explorer';
 import { markdown } from '../markdown';
@@ -117,10 +112,10 @@ export function onHasCompletion(
 }
 
 function renderType(type: GraphQLType): string {
-  if (type instanceof GraphQLNonNull) {
+  if (isNonNullType(type)) {
     return `${renderType(type.ofType)}!`;
   }
-  if (type instanceof GraphQLList) {
+  if (isListType(type)) {
     return `[${renderType(type.ofType)}]`;
   }
   return `<a class="typeName">${escapeHTML(type.name)}</a>`;

packages/graphiql/src/components/DocExplorer/TypeDoc.tsx

@@ -5,27 +5,29 @@
  *  LICENSE file in the root directory of this source tree.
  */
 
-import React, { ReactNode, useState } from 'react';
-import {
-  GraphQLObjectType,
-  GraphQLInterfaceType,
-  GraphQLUnionType,
-  GraphQLEnumType,
-  GraphQLEnumValue,
-  GraphQLNamedType,
-  isType,
-} from 'graphql';
 import {
   ExplorerFieldDef,
   useExplorerContext,
   useSchemaContext,
 } from '@graphiql/react';
+import {
+  GraphQLEnumValue,
+  GraphQLInterfaceType,
+  GraphQLNamedType,
+  GraphQLObjectType,
+  isEnumType,
+  isInterfaceType,
+  isNamedType,
+  isObjectType,
+  isUnionType,
+} from 'graphql';
+import React, { ReactNode, useState } from 'react';
 
 import Argument from './Argument';
-import MarkdownContent from './MarkdownContent';
-import TypeLink from './TypeLink';
 import DefaultValue from './DefaultValue';
 import FieldLink from './FieldLink';
+import MarkdownContent from './MarkdownContent';
+import TypeLink from './TypeLink';
 
 export default function TypeDoc() {
   const { schema } = useSchemaContext({ nonNull: true });
@@ -35,19 +37,19 @@ export default function TypeDoc() {
   const navItem = explorerNavStack[explorerNavStack.length - 1];
   const type = navItem.def;
 
-  if (!schema || !isType(type)) {
+  if (!schema || !isNamedType(type)) {
     return null;
   }
 
   let typesTitle: string | null = null;
   let types: readonly (GraphQLObjectType | GraphQLInterfaceType)[] = [];
-  if (type instanceof GraphQLUnionType) {
+  if (isUnionType(type)) {
     typesTitle = 'possible types';
     types = schema.getPossibleTypes(type);
-  } else if (type instanceof GraphQLInterfaceType) {
+  } else if (isInterfaceType(type)) {
     typesTitle = 'implementations';
     types = schema.getPossibleTypes(type);
-  } else if (type instanceof GraphQLObjectType) {
+  } else if (isObjectType(type)) {
     typesTitle = 'implements';
     types = type.getInterfaces();
   }
@@ -110,7 +112,7 @@ export default function TypeDoc() {
 
   let valuesDef: ReactNode;
   let deprecatedValuesDef: ReactNode;
-  if (type instanceof GraphQLEnumType) {
+  if (isEnumType(type)) {
     const values = type.getValues();
     valuesDef = (
       <div className="doc-category">
@@ -156,12 +158,12 @@ export default function TypeDoc() {
           ('description' in type && type.description) || 'No Description'
         }
       />
-      {type instanceof GraphQLObjectType && typesDef}
+      {isObjectType(type) && typesDef}
       {fieldsDef}
       {deprecatedFieldsDef}
       {valuesDef}
       {deprecatedValuesDef}
-      {!(type instanceof GraphQLObjectType) && typesDef}
+      {!isObjectType(type) && typesDef}
     </div>
   );
 }

packages/graphiql/src/components/DocExplorer/TypeLink.tsx

@@ -5,10 +5,9 @@
  *  LICENSE file in the root directory of this source tree.
  */
 
-import React from 'react';
-import { GraphQLList, GraphQLNonNull, GraphQLType } from 'graphql';
-
 import { useExplorerContext } from '@graphiql/react';
+import { GraphQLType, isListType, isNonNullType } from 'graphql';
+import React from 'react';
 
 type TypeLinkProps = {
   type: GraphQLType;
@@ -22,14 +21,14 @@ export default function TypeLink(props: TypeLinkProps) {
   }
 
   const type = props.type;
-  if (type instanceof GraphQLNonNull) {
+  if (isNonNullType(type)) {
     return (
       <>
         <TypeLink type={type.ofType} />!
       </>
     );
   }
-  if (type instanceof GraphQLList) {
+  if (isListType(type)) {
     return (
       <>
         [<TypeLink type={type.ofType} />]