add swagger

Signed-off-by: Kiss Miklos <[email protected]>

.github/workflows/test.yml

@@ -43,6 +43,27 @@ jobs:
           CONTENTFUL_ACCESS_TOKEN: ${{ secrets.CONTENTFUL_ACCESS_TOKEN }}
           GATSBY_RECAPTCHAS_ENABLED: false
 
+      - name: Fetch Scaffolder API Docs
+        uses: JamesIves/fetch-api-data-action@v2
+        with:
+          endpoint: https://api.roadie.so/api/scaffolder/api-docs
+          configuration: '{ "method": "GET", "headers": {"Authorization": "Bearer ${{ secrets.ROADIE_API_TOKEN }}"} }'
+          save-location: 'static/scaffolder-openapi.json'
+
+      - name: Fetch Catalog API Docs
+        uses: JamesIves/fetch-api-data-action@v2
+        with:
+          endpoint: https://api.roadie.so/api/catalog/api-docs
+          configuration: '{ "method": "GET", "headers": {"Authorization": "Bearer ${{ secrets.ROADIE_API_TOKEN }}"} }'
+          save-location: 'static/catalog-openapi.json'
+
+      - name: Fetch Tech Insights API Docs
+        uses: JamesIves/fetch-api-data-action@v2
+        with:
+          endpoint: https://api.roadie.so/api/tech-insights/v1/api-docs
+          configuration: '{ "method": "GET", "headers": {"Authorization": "Bearer ${{ secrets.ROADIE_API_TOKEN }}"} }'
+          save-location: 'static/tech-insights-openapi.json'
+
       - name: Cypress run
         uses: cypress-io/github-action@v4
         with:

gatsby-browser.js

@@ -16,3 +16,11 @@ import './src/stylesheets/algolia-autocomplete-theme-overrides.css';
 
 import 'prismjs/themes/prism.css';
 import './src/stylesheets/prismjs-theme-overrides.css';
+// eslint-disable-next-line
+import SwaggerUI from 'swagger-ui';
+// eslint-disable-next-line
+import SwaggerUIStandalonePreset from 'swagger-ui-dist/swagger-ui-standalone-preset';
+import './src/stylesheets/swagger-ui.css';
+
+window.SwaggerUI = SwaggerUI;
+window.SwaggerUIStandalonePreset = SwaggerUIStandalonePreset;

package.json

@@ -66,6 +66,8 @@
     "react-tabs": "^4.2.1",
     "react-use": "^17.2.4",
     "remark-html": "^13.0.2",
+    "swagger-ui": "^5.9.1",
+    "swagger-ui-dist": "^5.9.1",
     "tailwindcss": "^3.0.7"
   },
   "devDependencies": {

src/components/doc/layouts.js

@@ -49,4 +49,10 @@ export const DOCS_LAYOUTS = [
     isActiveMatch: '/docs/details',
     sidebarNavItemGroups: [sidebar.nav[3]],
   },
+  {
+    tabLabel: 'Roadie API Docs',
+    startPath: '/docs/openapi',
+    isActiveMatch: '/docs/openapi',
+    sidebarNavItemGroups: [sidebar.nav[8]],
+  },
 ];

src/pages/docs/openapi.js

@@ -0,0 +1,38 @@
+import React, { useEffect, useRef } from 'react';
+import DocsHeader from 'components/SitewideHeader/DocsHeader';
+
+const ApiDocsPage = () => {
+  const swaggerRef = useRef(null);
+
+  useEffect(() => {
+    window.SwaggerUI({
+      domNode: swaggerRef.current,
+      supportedSubmitMethods: [],
+      urls: [
+        {
+          url: 'https://roadie.io/tech-insights-openapi.json',
+          name: 'Tech Insights',
+        },
+        {
+          url: 'https://roadie.io/catalog-openapi.json',
+          name: 'Catalog',
+        },
+        {
+          url: 'https://roadie.io/scaffolder-openapi.json',
+          name: 'Templates',
+        },
+      ],
+      presets: [window.SwaggerUI.presets.apis, window.SwaggerUIStandalonePreset],
+      layout: 'StandaloneLayout',
+    });
+  }, []);
+
+  return (
+    <>
+      <DocsHeader location={location} />
+      <div ref={swaggerRef} id="swaggerWrapper" />;
+    </>
+  );
+};
+
+export default ApiDocsPage;