feat: integrate Redocusaurus for interactive OFREP OpenAPI docs page

Signed-off-by: Jonathan Norris <[email protected]>

Author: jonathannorris

docusaurus.config.ts

@@ -172,7 +172,7 @@ const themeConfig: ThemeCommonConfig & AlgoliaThemeConfig = {
   },
   prism: {
     theme: themes.oceanicNext,
-    additionalLanguages: ['java', 'csharp', 'powershell', 'php', 'kotlin', 'ruby', 'dart'],
+    additionalLanguages: ['java', 'csharp', 'powershell', 'php', 'kotlin', 'ruby', 'dart', 'scala'],
     magicComments: [
       {
         className: 'theme-code-block-highlighted-line',
@@ -284,7 +284,31 @@ const config: Config = {
       },
     },
   ],
-  presets: [['classic', presetClassicOptions]],
+  presets: [
+    ['classic', presetClassicOptions],
+    [
+      'redocusaurus',
+      {
+        specs: [
+          {
+            id: 'ofrep-api',
+            spec: 'https://raw.githubusercontent.com/open-feature/protocol/refs/heads/main/service/openapi.yaml',
+          },
+        ],
+        theme: {
+          primaryColor: '#1890ff',
+          options: {
+            disableSearch: true,
+            theme: {
+              sidebar: {
+                width: '0px',
+              },
+            },
+          },
+        },
+      },
+    ],
+  ],
   plugins: [
     async function tailwind() {
       return {
@@ -377,7 +401,7 @@ const config: Config = {
   markdown: {
     mermaid: true,
   },
-  themes: ['@docusaurus/theme-mermaid'],
+  themes: ['@docusaurus/theme-mermaid', 'docusaurus-theme-redoc'],
 };
 
 export default config;

package.json

@@ -57,6 +57,7 @@
     "react-instantsearch": "^7.15.8",
     "react-lite-youtube-embed": "^2.5.1",
     "react-transition-group": "^4.4.5",
+    "redocusaurus": "^2.5.0",
     "rehype-github-alerts": "^4.1.1",
     "remark-gfm": "^4.0.1",
     "remarkable": "2.0.1",
@@ -72,8 +73,8 @@
     "@docusaurus/tsconfig": "^3.9.1",
     "@types/fs-extra": "11.0.4",
     "@types/react": "^19.1.6",
-    "@typescript-eslint/parser": "8.35.1",
     "@typescript-eslint/eslint-plugin": "8.35.1",
+    "@typescript-eslint/parser": "8.35.1",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "10.1.5",
     "eslint-mdx": "3.6.0",

src/css/custom.css

@@ -333,4 +333,52 @@ details[open] .mcp-install-summary strong::before {
 [data-theme='dark'] .mcp-install-button:hover {
   background-color: var(--ifm-color-primary-light);
   border-color: var(--ifm-color-primary-light);
+  color: #fff;
+  text-decoration: none;
+}
+
+/* Full width Redoc API viewer */
+.redocusaurus {
+  max-width: none !important;
+  width: 100% !important;
+}
+
+.redocusaurus .api-content {
+  max-width: none !important;
+}
+
+.redoc-wrap {
+  max-width: none !important;
+}
+
+/* Expand main container for Redoc pages */
+article:has(.redocusaurus) {
+  max-width: none !important;
+}
+
+.docMainContainer_TBSr:has(.redocusaurus) {
+  max-width: 100% !important;
+}
+
+.container:has(.redocusaurus) {
+  max-width: 100% !important;
+}
+
+.docItemContainer_Djhp:has(.redocusaurus) {
+  max-width: none !important;
+  width: 100%;
+}
+
+.docItemCol_VOVn:has(.redocusaurus) {
+  max-width: none !important;
+  flex-basis: 100% !important;
+}
+
+/* Hide Redocly branding footer */
+.redocusaurus a[href*="redocly.com"] {
+  display: none !important;
+}
+
+.redocusaurus [class*="powered-by"] {
+  display: none !important;
 }