Add ConfigValue component for dynamic configuration values

[tylernix]

Summary

This PR introduces a new ConfigValue React component that enables dynamic display of configuration values in documentation, supporting multi-tenant deployments with different configuration settings.

What's Changed

✨ New ConfigValue Component

• React Component: Type-safe component for displaying configuration values in MDX files
• TypeScript Support: Full autocomplete and type checking for configuration constants
• Flexible Display: Supports both code and text formatting options
• Error Handling: Graceful fallback for unknown configuration keys

🔧 Auto-Generated Configuration

• Enhanced Script: update-config-page.mjs now generates generic product-config.ts
• Schema Integration: Automatically pulls from OpenFGA GitHub releases
• Prettier Formatting: Auto-formatted TypeScript output with 700+ lines of constants
• Version Tracking: Currently synced with OpenFGA v1.10.0 schema

🏗️ Multi-Tenant Architecture

• Generic Design: Same component works for different product configurations
• Type Safety: Compile-time validation of configuration constant usage

Usage Example

import { ConfigValue } from '@components/Docs';

The Write API supports up to <ConfigValue name="MAX_TUPLES_PER_WRITE" /> tuples per request.
Server timeout is <ConfigValue name="REQUEST_TIMEOUT" format="text" />.

Technical Details

Files Added

• src/components/Docs/ConfigValue/index.tsx - Main React component
• src/constants/product-config.ts - Auto-generated configuration constants (726 lines)

Files Modified

• scripts/update-config-page.mjs - Enhanced to generate generic product-config
• src/components/Docs/index.ts - Export ConfigValue component

Key Features

• 50+ Configuration Constants: All OpenFGA server configuration options
• Type-Safe Access: keyof typeof ProductConfig.PRODUCT_CONFIG_DEFAULTS
• Auto-Sync: Run script to update from latest OpenFGA releases
• Documentation Integration: Seamless MDX usage with IntelliSense

Benefits

1. Synchronized Documentation: Configuration values stay in sync with actual server defaults
2. Multi-Tenant Support: Same codebase can serve different products with different values
3. Developer Experience: TypeScript autocomplete prevents typos and missing constants
4. Maintainability: Single source of truth for configuration documentation

Testing

• ✅ TypeScript compilation passes
• ✅ Component renders correctly in Docusaurus
• ✅ Auto-generation script works with OpenFGA v1.10.0
• ✅ Prettier formatting applied successfully

This component will be used in future documentation updates to replace hardcoded configuration values.

Summary by CodeRabbit

• New Features

  • Exposes auto-generated product configuration default values for use across the app.
  • Adds a ConfigValue component to render default config values in the UI/docs (code or text formats, with graceful fallback).

• Documentation

  • Docs can reference live default configuration values via ConfigValue.
  • Re-exported Docs components for easier imports.

• Chores

  • Added a script to generate TypeScript constants from the configuration schema and update related outputs.

[coderabbitai]

Walkthrough

Adds a script to extract constants from the OpenFGA config schema and generate a TypeScript constants file. Introduces an auto-generated constants module with default config values. Adds a React component to render config default values and re-exports it via the Docs index.

Changes

Cohort / File(s)	Summary of changes
Config constants generator script `scripts/update-config-page.mjs`	Adds `extractConstants(properties, jsonData, parentKey = '')`, `generateConstantsFile(constants, releaseData)`, `CONSTANTS_OUTPUT_FILE`, and updates `generateMdxForLatestRelease()` to generate a TypeScript constants file from the OpenFGA config schema.
Docs UI component for config values `src/components/Docs/ConfigValue/index.tsx`, `src/components/Docs/index.ts`	Introduces `ConfigValue` React component to display default config values from `PRODUCT_CONFIG_DEFAULTS`. Adds re-export via `export * from './ConfigValue'`.
Auto-generated product config defaults `src/constants/product-config.ts`	Adds a generated module exporting typed constants for default configuration values and an aggregated `PRODUCT_CONFIG_DEFAULTS` object with `as const`, plus `ProductConfigConstants` type.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  actor Dev as Developer
  participant Script as update-config-page.mjs
  participant Schema as OpenFGA Config Schema (JSON)
  participant FS as File System
  participant TS as product-config.ts

  Dev->>Script: Run script
  Script->>Schema: Load schema JSON
  Script->>Script: extractConstants(properties, jsonData)
  Script->>Script: generateConstantsFile(constants, releaseData)
  Script->>FS: Write TS content -> product-config.ts
  FS-->>TS: product-config.ts available
  note over Script,TS: New/updated constants and aggregated defaults exported

Loading

sequenceDiagram
  autonumber
  participant Docs as Docs pages
  participant UI as ConfigValue component
  participant Const as PRODUCT_CONFIG_DEFAULTS

  Docs->>UI: <ConfigValue name="..." format="code|text" />
  UI->>Const: Read default by key
  alt key exists
    UI-->>Docs: Render value (code/span)
  else key missing
    UI-->>Docs: Render "[Unknown config: ...]" placeholder
  end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title Check	✅ Passed	The title "Add ConfigValue component for dynamic configuration values" concisely and accurately captures the PR's primary purpose of introducing a new ConfigValue React component. It is clear, specific, and readable for team members scanning the history. While the PR also adds an auto-generated product-config constants file and update script, centering the title on the component — which matches the PR objectives — is reasonable.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

✨ Finishing touches

• 📝 Generate Docstrings

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feature/config-value-component

Tip

👮 Agentic pre-merge checks are now available in preview!

Pro plan users can now enable pre-merge checks in their settings to enforce checklists before merging PRs.

• Built-in checks – Quickly apply ready-made checks to enforce title conventions, require pull request descriptions that follow templates, validate linked issues for compliance, and more.
• Custom agentic checks – Define your own rules using CodeRabbit’s advanced agentic capabilities to enforce organization-specific policies and workflows. For example, you can instruct CodeRabbit’s agent to verify that API documentation is updated whenever API schema files are modified in a PR. Note: Upto 5 custom checks are currently allowed during the preview period. Pricing for this feature will be announced in a few weeks.

Please see the documentation for more information.

Example:

reviews:
  pre_merge_checks:
    custom_checks:
      - name: "Undocumented Breaking Changes"
        mode: "warning"
        instructions: |
          Pass/fail criteria: All breaking changes to public APIs, CLI flags, environment variables, configuration keys, database schemas, or HTTP/GraphQL endpoints must be documented in the "Breaking Change" section of the PR description and in CHANGELOG.md. Exclude purely internal or private changes (e.g., code not exported from package entry points or explicitly marked as internal).

Please share your feedback with us on this Discord post.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

PR Preview Action v1.6.2
🚀 View preview at https://openfga.github.io/openfga.dev/pr-preview/pr-1110/
Built to branch gh-pages at 2025-09-17 22:19 UTC. Preview will be ready when the GitHub Pages deployment is complete.