[DEV-2699] Add rapidoc as api viewer #1668

MarBert · 2025-09-03T13:42:49Z

List of Changes

Add rapidoc as the api viewer

Motivation and Context

How Has This Been Tested?

on localhost

Screenshots (if appropriate):

Types of changes

Chore (nothing changes by a user perspective)
Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist:

My change requires a change to the documentation.
I have updated the documentation accordingly.

changeset-bot · 2025-09-03T13:42:54Z

🦋 Changeset detected

Latest commit: 121af18

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
nextjs-website	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

marcobottaro · 2025-09-04T09:08:08Z

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

+        overflow: 'hidden',
+      }}
+    >
+      <rapi-doc


I think you should remove the blue line at the top of the component

i tried to add custom css like here: https://rapidocweb.com/api.html but it doesn't seem to work. The border is an inline style option, so there is some part in the rapidoc parser that sets it.

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

.changeset/thick-spoons-double.md

Co-authored-by: marcobottaro <[email protected]>

github-actions · 2025-09-04T14:48:30Z

Branch is not up to date with base branch

@MarBert it seems this Pull Request is not updated with base branch.
Please proceed with a merge or rebase to solve this.

Copilot

Pull Request Overview

This PR replaces the Stoplight Elements API viewer with RapiDoc for displaying API documentation. The change updates the API viewer component to use RapiDoc's custom web component instead of the previous Stoplight implementation.

Replace Stoplight Elements with RapiDoc library
Update component props by removing product dependency
Configure RapiDoc with theme-aware styling

Reviewed Changes

Copilot reviewed 4 out of 5 changed files in this pull request and generated 3 comments.

File	Description
package.json	Adds RapiDoc dependency
ApiRestSection.tsx	Removes product prop from ApiViewer component
ApiViewer.tsx	Complete rewrite to use RapiDoc instead of Stoplight Elements
thick-spoons-double.md	Changeset documenting the API viewer replacement

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

Copilot · 2025-09-23T14:59:42Z

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

 type ApiViewerProps = {
  specURL: string;
-  product: Product;
  hideTryIt?: boolean;


The hideTryIt prop is still defined in ApiViewerProps but is no longer used in the component. This creates an inconsistent API where the prop is accepted but ignored.

Suggested change

hideTryIt?: boolean;

Copilot · 2025-09-23T14:59:43Z

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

+const ApiViewer: FC<ApiViewerProps> = ({ specURL }) => {
+  const { palette } = useTheme();
+
+  // function that return current API component type


This comment is unclear and doesn't accurately describe what the function does. It should be updated to describe that the function renders a RapiDoc API viewer component.

Suggested change

// function that return current API component type

// Renders a RapiDoc API viewer component for the provided OpenAPI spec URL

Copilot · 2025-09-23T14:59:43Z

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

+        show-method-in-nav-bar='as-plain-text'
+        spec-url={specURL}
+        text-color={palette.text.primary}
+        theme='light'


The theme is hardcoded to 'light' but the component uses theme-aware colors from Material-UI. Consider making this dynamic based on the current theme mode (light/dark).

Suggested change

theme='light'

theme={palette.mode}

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx

github-actions · 2025-10-08T02:59:53Z

This pull request is stale because it has been open for 14 days with no activity. If the pull request is still valid, please update it within 21 days to keep it open or merge it, otherwise it will be closed automatically.

# Conflicts: # apps/nextjs-website/src/components/molecules/ApiRestSection/ApiRestSection.tsx

github-actions · 2025-10-08T15:56:14Z

Jira Pull Request Link

This Pull Request refers to the following Jira issue DEV-2699

MarBert added 4 commits September 3, 2025 12:58

add rapidoc and base component

47acca5

update style

29362be

add focused

f1ba8df

add changeset

d02ed6b

MarBert self-assigned this Sep 3, 2025

MarBert requested review from a team, MarcoPonchia, marcobottaro and tommaso1 as code owners September 3, 2025 13:42

github-actions bot added changeset website size/small labels Sep 3, 2025

Merge branch 'main' into DEV-2699-test-rapidoc

f50021b

tommaso1 approved these changes Sep 3, 2025

View reviewed changes

marcobottaro requested changes Sep 4, 2025

View reviewed changes

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx Outdated Show resolved Hide resolved

marcobottaro requested changes Sep 4, 2025

View reviewed changes

MarBert and others added 3 commits September 4, 2025 14:36

fixes to style

297c0f9

Update .changeset/thick-spoons-double.md

37f18ee

Co-authored-by: marcobottaro <[email protected]>

update package-lock

30212f9

MarBert temporarily deployed to uat September 4, 2025 14:51 — with GitHub Actions Inactive

MarBert temporarily deployed to prod September 4, 2025 14:51 — with GitHub Actions Inactive

MarBert temporarily deployed to dev September 4, 2025 14:51 — with GitHub Actions Inactive

MarBert requested a review from marcobottaro September 4, 2025 14:56

Merge branch 'main' into DEV-2699-test-rapidoc

b56aa21

MarBert temporarily deployed to prod September 5, 2025 09:58 — with GitHub Actions Inactive

MarBert temporarily deployed to dev September 5, 2025 09:58 — with GitHub Actions Inactive

MarBert temporarily deployed to uat September 5, 2025 09:58 — with GitHub Actions Inactive

Merge branch 'main' into DEV-2699-test-rapidoc

f2fe415

marcobottaro temporarily deployed to prod September 8, 2025 07:45 — with GitHub Actions Inactive

marcobottaro temporarily deployed to dev September 8, 2025 07:45 — with GitHub Actions Inactive

marcobottaro temporarily deployed to uat September 8, 2025 07:45 — with GitHub Actions Inactive

marcobottaro mentioned this pull request Sep 8, 2025

[DEV-2563] poc api viewer #1621

Closed

6 tasks

MarcoPonchia approved these changes Sep 11, 2025

View reviewed changes

Merge branch 'main' into DEV-2699-test-rapidoc

043b16c

marcobottaro temporarily deployed to uat September 19, 2025 12:42 — with GitHub Actions Inactive

marcobottaro temporarily deployed to dev September 19, 2025 12:42 — with GitHub Actions Inactive

marcobottaro temporarily deployed to prod September 19, 2025 12:42 — with GitHub Actions Inactive

marcobottaro temporarily deployed to dev September 19, 2025 13:04 — with GitHub Actions Inactive

marcobottaro requested a review from Copilot September 23, 2025 14:59

Copilot AI reviewed Sep 23, 2025

View reviewed changes

Sebastiano-Bertolin reviewed Sep 23, 2025

View reviewed changes

apps/nextjs-website/src/components/atoms/ApiViewer/ApiViewer.tsx Outdated Show resolved Hide resolved

github-actions bot added the stale label Oct 8, 2025

MarBert added 3 commits October 8, 2025 17:34

move global declaration to separate file

2345b22

Merge branch 'main' into DEV-2699-test-rapidoc

87256ef

# Conflicts: # apps/nextjs-website/src/components/molecules/ApiRestSection/ApiRestSection.tsx

fix merge conflicts

121af18

MarBert requested a review from Sebastiano-Bertolin October 8, 2025 15:58

MarBert temporarily deployed to uat October 8, 2025 15:58 — with GitHub Actions Inactive

MarBert temporarily deployed to dev October 8, 2025 15:58 — with GitHub Actions Inactive

MarBert temporarily deployed to prod October 8, 2025 15:58 — with GitHub Actions Inactive

github-actions bot removed the stale label Oct 15, 2025

	// function that return current API component type
	// Renders a RapiDoc API viewer component for the provided OpenAPI spec URL

[DEV-2699] Add rapidoc as api viewer #1668

Are you sure you want to change the base?

[DEV-2699] Add rapidoc as api viewer #1668

Conversation

MarBert commented Sep 3, 2025

List of Changes

Motivation and Context

How Has This Been Tested?

Screenshots (if appropriate):

Types of changes

Checklist:

Uh oh!

changeset-bot bot commented Sep 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

marcobottaro Sep 4, 2025

Choose a reason for hiding this comment

Uh oh!

MarBert Sep 4, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actions bot commented Sep 4, 2025

Branch is not up to date with base branch

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Sep 23, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Sep 23, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Sep 23, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

github-actions bot commented Oct 8, 2025

Uh oh!

github-actions bot commented Oct 8, 2025 • edited by atlassian bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Jira Pull Request Link

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

changeset-bot bot commented Sep 3, 2025 •

edited

Loading

github-actions bot commented Oct 8, 2025 •

edited by atlassian bot

Loading