Skip to content

Commit df7406d

Browse files
committed
Fix build issues: prism v2.x compatibility, SSR safety, missing components, MDX parsing
1 parent 5430110 commit df7406d

12 files changed

Lines changed: 301 additions & 14 deletions

File tree

.vscode/settings.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,21 +4,21 @@
44
"editor.defaultFormatter": "esbenp.prettier-vscode",
55
"editor.formatOnSave": true,
66
"editor.codeActionsOnSave": {
7-
"source.fixAll.eslint": true
7+
"source.fixAll.eslint": "explicit"
88
}
99
},
1010
"[typescript]": {
1111
"editor.defaultFormatter": "esbenp.prettier-vscode",
1212
"editor.formatOnSave": true,
1313
"editor.codeActionsOnSave": {
14-
"source.fixAll.eslint": true
14+
"source.fixAll.eslint": "explicit"
1515
}
1616
},
1717
"[typescriptreact]": {
1818
"editor.defaultFormatter": "esbenp.prettier-vscode",
1919
"editor.formatOnSave": true,
2020
"editor.codeActionsOnSave": {
21-
"source.fixAll.eslint": true
21+
"source.fixAll.eslint": "explicit"
2222
}
2323
}
2424
}

demo/docusaurus.config.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,6 @@ const config = {
2525
sidebarPath: require.resolve("./sidebars.js"),
2626
editUrl:
2727
"https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/tree/main/demo",
28-
docLayoutComponent: "@theme/DocRoot",
29-
docItemComponent: "@theme/ApiItem", // Derived from docusaurus-theme-openapi
3028
},
3129
blog: false,
3230
theme: {

demo/src/utils/prismDark.mjs

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
* LICENSE file in the root directory of this source tree.
66
*/
77

8-
import darkTheme from "prism-react-renderer/themes/vsDark/index.cjs.js";
8+
import { themes } from "prism-react-renderer";
9+
const darkTheme = themes.vsDark;
910

1011
export default {
1112
plain: {

demo/src/utils/prismLight.mjs

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
* LICENSE file in the root directory of this source tree.
66
*/
77

8-
import lightTheme from "prism-react-renderer/themes/github/index.cjs.js";
8+
import { themes } from "prism-react-renderer";
9+
const lightTheme = themes.github;
910

1011
export default {
1112
...lightTheme,

packages/docusaurus-theme-openapi-docs/src/theme/ApiItem/hooks.ts

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,29 @@
66
* ========================================================================== */
77

88
import { TypedUseSelectorHook, useDispatch, useSelector } from "react-redux";
9+
import ExecutionEnvironment from "@docusaurus/ExecutionEnvironment";
910

1011
import type { RootState, AppDispatch } from "./store";
1112

12-
export const useTypedDispatch = () => useDispatch<AppDispatch>();
13-
export const useTypedSelector: TypedUseSelectorHook<RootState> = useSelector;
13+
export const useTypedDispatch = (): any => {
14+
if (!ExecutionEnvironment.canUseDOM) {
15+
return () => {}; // Return a no-op function during SSR
16+
}
17+
return useDispatch<AppDispatch>();
18+
};
19+
20+
export const useTypedSelector: TypedUseSelectorHook<RootState> = (selector) => {
21+
if (!ExecutionEnvironment.canUseDOM) {
22+
// Return default values during SSR to prevent null store access
23+
return selector({
24+
accept: { value: undefined },
25+
contentType: { value: undefined },
26+
response: { value: undefined },
27+
server: { value: undefined, options: [] },
28+
body: { type: "empty" },
29+
params: {},
30+
auth: { selected: undefined, options: {}, data: {} },
31+
} as RootState);
32+
}
33+
return useSelector(selector);
34+
};
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
/* ============================================================================
2+
* Copyright (c) Palo Alto Networks
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
* ========================================================================== */
7+
8+
import React from "react";
9+
10+
interface EndpointProps {
11+
method: string;
12+
path: string;
13+
}
14+
15+
export default function Endpoint({ method, path }: EndpointProps) {
16+
return (
17+
<div
18+
style={{
19+
border: "1px solid #ddd",
20+
borderRadius: "4px",
21+
padding: "8px 12px",
22+
margin: "16px 0",
23+
backgroundColor: "#f8f9fa",
24+
}}
25+
>
26+
<span
27+
style={{
28+
backgroundColor: method === "get" ? "#28a745" : "#007bff",
29+
color: "white",
30+
padding: "2px 8px",
31+
borderRadius: "3px",
32+
fontSize: "12px",
33+
fontWeight: "bold",
34+
textTransform: "uppercase",
35+
marginRight: "8px",
36+
}}
37+
>
38+
{method}
39+
</span>
40+
<code>{path}</code>
41+
</div>
42+
);
43+
}

packages/docusaurus-theme-openapi-docs/src/theme/MimeTabs/index.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,6 @@ function TabList({
5454
const acceptTypeVal = useTypedSelector(
5555
(state: RootState) => state.accept.value
5656
);
57-
5857
useEffect(() => {
5958
if (tabRefs.length > 1) {
6059
if (isRequestSchema) {
Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
/* ============================================================================
2+
* Copyright (c) Palo Alto Networks
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
* ========================================================================== */
7+
8+
/* ============================================================================
9+
* Copyright (c) Palo Alto Networks
10+
*
11+
* This source code is licensed under the MIT license found in the
12+
* LICENSE file in the root directory of this source tree.
13+
* ========================================================================== */
14+
15+
import React from "react";
16+
17+
interface ParamDetailsProps {
18+
paramType: string;
19+
params: Array<{
20+
field: string;
21+
required?: boolean;
22+
description?: string;
23+
type?: string;
24+
}>;
25+
}
26+
27+
export default function ParamDetails({ paramType, params }: ParamDetailsProps) {
28+
if (!params || params.length === 0) {
29+
return null;
30+
}
31+
32+
return (
33+
<div style={{ margin: "16px 0" }}>
34+
<h3>{paramType} Parameters</h3>
35+
<table style={{ width: "100%", borderCollapse: "collapse" }}>
36+
<thead>
37+
<tr style={{ backgroundColor: "#f8f9fa" }}>
38+
<th
39+
style={{
40+
padding: "8px",
41+
border: "1px solid #ddd",
42+
textAlign: "left",
43+
}}
44+
>
45+
Name
46+
</th>
47+
<th
48+
style={{
49+
padding: "8px",
50+
border: "1px solid #ddd",
51+
textAlign: "left",
52+
}}
53+
>
54+
Type
55+
</th>
56+
<th
57+
style={{
58+
padding: "8px",
59+
border: "1px solid #ddd",
60+
textAlign: "left",
61+
}}
62+
>
63+
Required
64+
</th>
65+
<th
66+
style={{
67+
padding: "8px",
68+
border: "1px solid #ddd",
69+
textAlign: "left",
70+
}}
71+
>
72+
Description
73+
</th>
74+
</tr>
75+
</thead>
76+
<tbody>
77+
{params.map((param, index) => (
78+
<tr key={index}>
79+
<td style={{ padding: "8px", border: "1px solid #ddd" }}>
80+
<code>{param.field}</code>
81+
</td>
82+
<td style={{ padding: "8px", border: "1px solid #ddd" }}>
83+
{param.type || "string"}
84+
</td>
85+
<td style={{ padding: "8px", border: "1px solid #ddd" }}>
86+
{param.required ? "✓" : ""}
87+
</td>
88+
<td style={{ padding: "8px", border: "1px solid #ddd" }}>
89+
{param.description || ""}
90+
</td>
91+
</tr>
92+
))}
93+
</tbody>
94+
</table>
95+
</div>
96+
);
97+
}
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
/* ============================================================================
2+
* Copyright (c) Palo Alto Networks
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
* ========================================================================== */
7+
8+
import React from "react";
9+
10+
interface RequestBodyDetailsBaseProps {
11+
children?: React.ReactNode;
12+
[key: string]: any;
13+
}
14+
15+
export default function RequestBodyDetailsBase({
16+
children,
17+
...props
18+
}: RequestBodyDetailsBaseProps) {
19+
return <div style={{ margin: "8px 0" }}>{children}</div>;
20+
}
Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
/* ============================================================================
2+
* Copyright (c) Palo Alto Networks
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
* ========================================================================== */
7+
8+
/* ============================================================================
9+
* Copyright (c) Palo Alto Networks
10+
*
11+
* This source code is licensed under the MIT license found in the
12+
* LICENSE file in the root directory of this source tree.
13+
* ========================================================================== */
14+
15+
import React from "react";
16+
17+
interface RequestBodyDetailsProps {
18+
children?: React.ReactNode;
19+
[key: string]: any;
20+
}
21+
22+
export default function RequestBodyDetails({
23+
children,
24+
...props
25+
}: RequestBodyDetailsProps) {
26+
return (
27+
<div style={{ margin: "16px 0" }}>
28+
<h3>Request Body</h3>
29+
<div
30+
style={{
31+
border: "1px solid #ddd",
32+
borderRadius: "4px",
33+
padding: "12px",
34+
backgroundColor: "#f8f9fa",
35+
}}
36+
>
37+
{children}
38+
</div>
39+
</div>
40+
);
41+
}

0 commit comments

Comments
 (0)