diff --git a/.eslintrc.js b/.eslintrc.js
index 03f3ce170..ed3edcca7 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -11,6 +11,7 @@ module.exports = {
MultiCodeBlock: 'readonly',
YouTube: 'readonly',
PropertyList: 'readonly',
+ ErrorCode: 'readonly',
Property: 'readonly',
Tabs: 'readonly',
Tab: 'readonly',
@@ -53,7 +54,8 @@ module.exports = {
StudioPages: 'readonly',
HowSubscriptionsWork: 'readonly',
WhatSubscriptionsAreFor: 'readonly',
- TopLevelAwait: 'readonly'
+ TopLevelAwait: 'readonly',
+ RouterErrorCodes: 'readonly'
},
rules: {
'react/no-unescaped-entities': 'off'
diff --git a/gatsby-node.js b/gatsby-node.js
index 2303f86d9..fd02109c1 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -11,7 +11,7 @@ exports.sourceNodes = ({
store,
cache,
reporter
-}) =>
+}) => {
// download Apollo Client typedoc output and save it as a file node
createRemoteFileNode({
url: 'https://apollo-client-docs.netlify.app/docs.json',
@@ -22,6 +22,22 @@ exports.sourceNodes = ({
reporter
});
+ const routerErrors = [
+ 'https://raw.githubusercontent.com/apollographql/router/ee0e96d0c66594bd1865fb27eb83802cecc8b22a/apollo-router/resources/errors/apollo_router%3A%3Astructured_errors%3A%3Atest%3A%3ATestError.yaml'
+ ];
+
+ routerErrors.forEach(url => {
+ createRemoteFileNode({
+ url,
+ store,
+ cache,
+ createNode,
+ createNodeId,
+ reporter
+ });
+ });
+};
+
exports.onCreateWebpackConfig = ({actions}) => {
actions.setWebpackConfig({
resolve: {
@@ -40,7 +56,11 @@ exports.onCreateNode = async ({node, getNode, loadNodeContent, actions}) => {
const {type, mediaType} = node.internal;
switch (type) {
case 'File':
- if (mediaType === 'application/json' || node.base === '_redirects') {
+ if (
+ mediaType === 'application/json' ||
+ mediaType === 'text/yaml' ||
+ node.base === '_redirects'
+ ) {
// save the raw content of JSON files as a field
const content = await loadNodeContent(node);
actions.createNodeField({
diff --git a/src/components/ErrorCode.js b/src/components/ErrorCode.js
new file mode 100644
index 000000000..ed8a00d6c
--- /dev/null
+++ b/src/components/ErrorCode.js
@@ -0,0 +1,78 @@
+import PropTypes from 'prop-types';
+import React, {useContext} from 'react';
+import {CustomHeading} from './CustomHeading';
+import {Link, Td, Tr} from '@chakra-ui/react';
+import {MarkdownInAdmonitions} from './MarkdownInAdmonitions';
+import {PropertyListContext} from './PropertyList';
+
+export function ErrorCode({
+ code,
+ level,
+ detail,
+ type,
+ origin,
+ trace,
+ debug_uri,
+ actions,
+ attributes,
+ children
+}) {
+ return (
+
+
+
+
+
+ {code}
+
+
+
+ |
+
+ {detail && (
+
+ {detail}
+
+
+
+ )}
+ {children && (
+
+ {children}
+
+
+ )}
+ {level && (
+
+ Level:
+ {level}
+
+
+ )}
+ {origin && (
+
+ Origin:
+ {origin}
+
+
+ )}
+ {type && (
+
+ Type:
+ {type}
+
+
+ )}
+ |
+
+ );
+}
+
+ErrorCode.propTypes = {
+ code: PropTypes.string.isRequired,
+ detail: PropTypes.string,
+ level: PropTypes.string,
+ origin: PropTypes.string,
+ type: PropTypes.string,
+ children: PropTypes.node
+};
diff --git a/src/components/Page.js b/src/components/Page.js
index 37e325ac1..6dcb99acc 100644
--- a/src/components/Page.js
+++ b/src/components/Page.js
@@ -9,13 +9,7 @@ import InlineCode from './InlineCode';
import Pagination from './Pagination';
import Prism from 'prismjs';
import PropTypes from 'prop-types';
-import React, {
- Fragment,
- createElement,
- useCallback,
- useMemo,
- useState
-} from 'react';
+import React, {Fragment, createElement, useMemo, useState} from 'react';
import RelativeLink, {ButtonLink, PrimaryLink} from './RelativeLink';
import RuleExpansionPanel from './RuleExpansionPanel';
import TableOfContents from './TableOfContents';
@@ -65,6 +59,7 @@ import {
MultiCodeBlockContext
} from '@apollo/chakra-helpers';
import {EnterpriseFeature} from './EnterpriseFeature';
+import {ErrorCode} from './ErrorCode';
import {ExperimentalFeature} from './ExperimentalFeature';
import {Link as GatsbyLink} from 'gatsby';
import {Global} from '@emotion/react';
@@ -84,6 +79,7 @@ import {PremiumFeature} from './PremiumFeature';
import {PreviewFeature} from './PreviewFeature';
import {Property} from './Property';
import {PropertyList} from './PropertyList';
+import {RouterErrorCodes} from './RouterErrorCodes';
import {TOTAL_HEADER_HEIGHT} from './Header';
import {Tab} from './Tab';
import {Tabs} from './Tabs';
@@ -217,6 +213,7 @@ const mdxComponents = {
YouTube,
Property,
PropertyList,
+ ErrorCode,
Tab,
Tabs,
WistiaEmbed,
@@ -239,7 +236,8 @@ const mdxComponents = {
TrackableLink,
useApiDocContext,
PrimaryLink,
- MDXRenderer
+ MDXRenderer,
+ RouterErrorCodes
};
const {processSync} = rehype()
diff --git a/src/components/RouterErrorCodes.js b/src/components/RouterErrorCodes.js
new file mode 100644
index 000000000..d31f6728f
--- /dev/null
+++ b/src/components/RouterErrorCodes.js
@@ -0,0 +1,57 @@
+import React from 'react';
+import yaml from 'js-yaml';
+import {ErrorCode} from './ErrorCode';
+import {PropertyList} from './PropertyList';
+import {graphql, useStaticQuery} from 'gatsby';
+
+export const RouterErrorCodes = () => {
+ const data = useStaticQuery(
+ graphql`
+ query RouterErrorCodes {
+ allFile(
+ filter: {
+ extension: {eq: "yaml"}
+ sourceInstanceName: {eq: "__PROGRAMMATIC__"}
+ }
+ ) {
+ nodes {
+ name
+ fields {
+ content
+ }
+ }
+ }
+ }
+ `
+ );
+
+ return (
+
+ {data.allFile.nodes.map((file, index) => {
+ const errors = yaml.load(file.fields.content);
+
+ return (
+
+
+ {errors.map((error, index) => {
+ console.log(error);
+ return (
+ <>
+
+
+ );
+ })}
+
+
+ );
+ })}
+