@digi-frontend/dgate-api-documentation 4.2.3 → 4.2.5

package/dist/index.cjs

@@ -704,6 +704,99 @@ const getSidebarStyles$1 = (token, scope) => ({
 	}
 });
 //#endregion
+//#region src/view/helper/patch-endpoint.ts
+/** Convert an editor ParameterFormValues into an OpenAPI request Parameter. */
+const toOpenApiParam = (p) => ({
+	name: p.name,
+	in: p.in,
+	required: p.required,
+	...p.description ? { description: p.description } : {},
+	schema: {
+		type: p.type,
+		...p.enum && p.enum.length > 0 ? { enum: p.enum } : {}
+	}
+});
+/** Convert editor response ParameterFormValues into an OpenAPI response headers map. */
+const toResponseHeaders = (params) => params.reduce((acc, p) => {
+	acc[p.name] = {
+		schema: {
+			type: p.type,
+			...p.enum && p.enum.length > 0 ? { enum: p.enum } : {}
+		},
+		required: p.required,
+		...p.description ? { description: p.description } : {}
+	};
+	return acc;
+}, {});
+/**
+* Apply the local (unsaved) edits for a single endpoint onto a clone of the
+* stored endpoint. Absent edits fall back to the endpoint's existing value, so
+* unedited fields are never wiped.
+*/
+const buildPatchedEndpoint = (ep, edits) => {
+	const localName = edits.names[ep.id];
+	const localDesc = edits.descs[ep.id];
+	const localTags = edits.tags[ep.id];
+	const localParams = edits.params[ep.id];
+	const localResponseParams = edits.responseParams[ep.id];
+	const localResponseBody = edits.responseBody[ep.id];
+	const parameters = localParams !== void 0 ? localParams.map(toOpenApiParam) : ep.parameters;
+	const responseHeadersMap = localResponseParams && localResponseParams.length > 0 ? toResponseHeaders(localResponseParams) : null;
+	const responses = Object.fromEntries(Object.entries(ep.responses ?? {}).map(([code, resp]) => {
+		const patchedExample = localResponseBody?.[code];
+		const existingJson = resp.content?.["application/json"];
+		const content = patchedExample !== void 0 ? {
+			...resp.content,
+			"application/json": {
+				...existingJson ?? { schema: {} },
+				example: patchedExample
+			}
+		} : resp.content;
+		return [code, {
+			...resp,
+			headers: responseHeadersMap ?? resp.headers,
+			...content ? { content } : {}
+		}];
+	}));
+	const tags = localTags ?? ep.tags;
+	return {
+		...ep,
+		summary: localName !== void 0 ? localName : ep.summary,
+		description: localDesc !== void 0 ? localDesc : ep.description,
+		tags,
+		parameters,
+		responses
+	};
+};
+/**
+* Build a fully-patched copy of `selectedApi` that reflects all unsaved local
+* edits, so View-mode surfaces (API page cards, endpoint detail, Codebox,
+* sidebar tree) preview changes before saving. Endpoints are re-grouped under
+* their edited primary tag. Returns the same `selectedApi` reference when no
+* edit changes the result, to keep memo consumers stable.
+*/
+const buildPatchedApi = (selectedApi, edits) => {
+	const patchedTags = {};
+	Object.entries(selectedApi.tags ?? {}).forEach(([bucketKey, endpoints]) => {
+		endpoints.forEach((ep) => {
+			const patched = buildPatchedEndpoint(ep, edits);
+			const newKey = edits.tags[ep.id]?.[0] ?? ep.tagName ?? bucketKey;
+			const endpoint = newKey === patched.tagName ? patched : {
+				...patched,
+				tagName: newKey
+			};
+			(patchedTags[newKey] ??= []).push(endpoint);
+		});
+	});
+	const patched = {
+		...selectedApi,
+		title: edits.apiTitle ?? selectedApi.title,
+		description: edits.apiDescription ?? selectedApi.description,
+		tags: patchedTags
+	};
+	return JSON.stringify(patched) === JSON.stringify(selectedApi) ? selectedApi : patched;
+};
+//#endregion
 //#region src/utils/OverflowTooltip.tsx
 const OverflowTooltip = ({ title, children, className, style, placement }) => {
 	const ref = (0, react.useRef)(null);
@@ -1697,9 +1790,10 @@ const APIPage = ({ apiOverride }) => {
 		if (selectedApi?.servers && !selectedUrl) setSelectedUrl(selectedApi?.servers?.[0].url);
 	}, [selectedApi?.servers]);
 	const getEndpointsForSelectedUrl = () => {
-		if (!selectedApi) return {};
-		const tags = selectedApi.tags || {};
-		const curl = selectedApi.curl || [];
+		const api = apiOverride ?? selectedApi;
+		if (!api) return {};
+		const tags = api.tags || {};
+		const curl = api.curl || [];
 		const filtered = {};
 		Object.keys(tags).forEach((tagKey) => {
 			filtered[tagKey] = tags[tagKey].map((endpoint) => {
@@ -3384,6 +3478,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 //#endregion
 //#region src/view/components/ApiPage/components/EndpointsSection.tsx
 const { useBreakpoint: useBreakpoint$2 } = antd.Grid;
+const ucFirst = (s) => s.charAt(0).toUpperCase() + s.slice(1);
 const PAGE_SIZE = 4;
 const VIEW_PAGE_SIZE = 4;
 const getStatusCodeColor = (code, token) => {
@@ -3754,6 +3849,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			alignItems: "center",
 			justifyContent: "space-between",
 			width: "100%",
+			gap: 16,
 			padding: `12px 0px`,
 			borderBottom: `1px solid ${token.colorBorderSecondary}`,
 			background: token.colorBgContainer,
@@ -4089,7 +4185,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			background: token.colorBgElevated,
 			borderRadius: token.borderRadius,
 			paddingTop: 16,
-			paddingBottom: 16,
+			paddingBottom: 32,
 			gap: 8,
 			display: "flex",
 			flexDirection: "column",
@@ -4561,7 +4657,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																children: "Parameter In"
 															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																className: cx("param-detail-value"),
-																children: param.in
+																children: ucFirst(param.in)
 															})]
 														})]
 													}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -4640,7 +4736,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																	children: "Parameter In"
 																}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																	className: cx("param-detail-value"),
-																	children: param.in
+																	children: ucFirst(param.in)
 																})]
 															}),
 															/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -4650,7 +4746,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																	children: "Parameter Type"
 																}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																	className: cx("param-detail-value"),
-																	children: param.type
+																	children: ucFirst(param.type)
 																})]
 															}),
 															/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5048,7 +5144,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																children: "Parameter In"
 															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																className: cx("param-detail-value"),
-																children: param.in
+																children: ucFirst(param.in)
 															})]
 														})]
 													}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5127,7 +5223,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																	children: "Parameter In"
 																}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																	className: cx("param-detail-value"),
-																	children: param.in
+																	children: ucFirst(param.in)
 																})]
 															}),
 															/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5137,7 +5233,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																	children: "Parameter Type"
 																}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																	className: cx("param-detail-value"),
-																	children: param.type
+																	children: ucFirst(param.type)
 																})]
 															}),
 															/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5868,7 +5964,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																	children: "Parameter In"
 																}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																	className: cx("param-detail-value"),
-																	children: param.in
+																	children: ucFirst(param.in)
 																})]
 															})]
 														}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5943,7 +6039,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																		children: "Parameter In"
 																	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																		className: cx("param-detail-value"),
-																		children: param.in
+																		children: ucFirst(param.in)
 																	})]
 																}),
 																/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5953,7 +6049,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																		children: "Parameter Type"
 																	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																		className: cx("param-detail-value"),
-																		children: param.type
+																		children: ucFirst(param.type)
 																	})]
 																}),
 																/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -6347,7 +6443,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																	children: "Parameter In"
 																}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																	className: cx("param-detail-value"),
-																	children: param.in
+																	children: ucFirst(param.in)
 																})]
 															})]
 														}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -6422,7 +6518,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																		children: "Parameter In"
 																	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																		className: cx("param-detail-value"),
-																		children: param.in
+																		children: ucFirst(param.in)
 																	})]
 																}),
 																/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -6432,7 +6528,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																		children: "Parameter Type"
 																	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 																		className: cx("param-detail-value"),
-																		children: param.type
+																		children: ucFirst(param.type)
 																	})]
 																}),
 																/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -9281,17 +9377,27 @@ const ConsoleDocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPa
 	const viewModeApi = (0, react$1.useMemo)(() => {
 		if (!selectedApi) return null;
 		if (mode !== "view") return selectedApi;
-		if (localApiName === selectedApi.title && localDescription === selectedApi.description) return selectedApi;
-		return {
-			...selectedApi,
-			title: localApiName,
-			description: localDescription
-		};
+		return buildPatchedApi(selectedApi, {
+			apiTitle: localApiName,
+			apiDescription: localDescription,
+			names: endpointNames,
+			descs: endpointDescs,
+			tags: endpointTags,
+			params: endpointParams,
+			responseParams: endpointResponseParams,
+			responseBody: endpointResponseBody
+		});
 	}, [
 		mode,
 		selectedApi,
 		localApiName,
-		localDescription
+		localDescription,
+		endpointNames,
+		endpointDescs,
+		endpointTags,
+		endpointParams,
+		endpointResponseParams,
+		endpointResponseBody
 	]);
 	(0, react$1.useEffect)(() => {
 		return () => {
@@ -9617,58 +9723,32 @@ const ConsoleDocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPa
 		setBannerVisible(hasChanges);
 	}, [hasChanges]);
 	(0, react$1.useEffect)(() => {
-		if (mode !== "view" || !selectedEndpoint) return;
-		const epId = selectedEndpoint.id;
-		const localName = endpointNames[epId];
-		const localDesc = endpointDescs[epId];
-		const localEpTags = endpointTags[epId];
-		const patchedSummary = localName !== void 0 && localName !== selectedEndpoint.summary ? localName : selectedEndpoint.summary;
-		const patchedDesc = localDesc !== void 0 && localDesc !== selectedEndpoint.description ? localDesc : selectedEndpoint.description;
-		const patchedTags = localEpTags !== void 0 && JSON.stringify(localEpTags) !== JSON.stringify(selectedEndpoint.tags ?? []) ? localEpTags : selectedEndpoint.tags;
-		const openApiParams = (endpointParams[epId] ?? []).map((p) => ({
-			name: p.name,
-			in: p.in,
-			required: p.required,
-			...p.description ? { description: p.description } : {},
-			schema: {
-				type: p.type,
-				...p.enum && p.enum.length > 0 ? { enum: p.enum } : {}
-			}
-		}));
-		const responseHeadersMap = (endpointResponseParams[epId] ?? []).reduce((acc, p) => {
-			acc[p.name] = {
-				schema: {
-					type: p.type,
-					...p.enum && p.enum.length > 0 ? { enum: p.enum } : {}
-				},
-				required: p.required,
-				...p.description ? { description: p.description } : {}
-			};
-			return acc;
-		}, {});
-		const patchedResponses = Object.fromEntries(Object.entries(selectedEndpoint.responses ?? {}).map(([code, resp]) => [code, {
-			...resp,
-			headers: Object.keys(responseHeadersMap).length > 0 ? responseHeadersMap : resp.headers
-		}]));
-		if (selectedEndpoint.summary === patchedSummary && selectedEndpoint.description === patchedDesc && JSON.stringify(selectedEndpoint.tags ?? []) === JSON.stringify(patchedTags ?? []) && JSON.stringify(selectedEndpoint.parameters ?? []) === JSON.stringify(openApiParams) && JSON.stringify(selectedEndpoint.responses) === JSON.stringify(patchedResponses)) return;
+		if (mode !== "view" || !selectedEndpoint || !viewModeApi) return;
+		const patched = Object.values(viewModeApi.tags ?? {}).flat().find((e) => e.id === selectedEndpoint.id);
+		if (!patched) return;
+		if (selectedEndpoint.summary === patched.summary && selectedEndpoint.description === patched.description && JSON.stringify(selectedEndpoint.tags ?? []) === JSON.stringify(patched.tags ?? []) && JSON.stringify(selectedEndpoint.parameters ?? []) === JSON.stringify(patched.parameters ?? []) && JSON.stringify(selectedEndpoint.responses) === JSON.stringify(patched.responses)) return;
 		setSelectedEndpoint({
-			...selectedEndpoint,
-			summary: patchedSummary,
-			description: patchedDesc,
-			tags: patchedTags,
-			parameters: openApiParams,
-			responses: patchedResponses
+			...patched,
+			parentApiId: selectedEndpoint.parentApiId
 		});
 	}, [
 		mode,
 		selectedEndpoint,
-		endpointNames,
-		endpointDescs,
-		endpointTags,
-		endpointParams,
-		endpointResponseParams,
+		viewModeApi,
 		setSelectedEndpoint
 	]);
+	(0, react$1.useEffect)(() => {
+		if (!selectedApi || !transformedData?.length) return;
+		const rebuilt = buildTreeDataStructure(mode === "view" && viewModeApi ? transformedData.map((api) => api.contextPath === selectedApi.contextPath ? viewModeApi : api) : transformedData);
+		if (JSON.stringify(rebuilt) !== JSON.stringify(builtTreeData)) setBuiltTreeData(rebuilt);
+	}, [
+		mode,
+		viewModeApi,
+		transformedData,
+		selectedApi,
+		builtTreeData,
+		setBuiltTreeData
+	]);
 	const handleAddTag = (tag) => {
 		const newTag = {
 			name: tag.name,