fix: markdown parent name (#2062)

Co-authored-by: Alex Varchuk <[email protected]>
Redocly · Sep 6, 2022 · da9ed0b · da9ed0b
1 parent 3241000
commit da9ed0b
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 5 deletions.
diff --git a/src/components/ContentItems/ContentItems.tsx b/src/components/ContentItems/ContentItems.tsx
@@ -79,7 +79,11 @@ export class SectionItem extends React.Component<ContentItemProps> {
             </Header>
           </MiddlePanel>
         </Row>
-        <AdvancedMarkdown source={description || ''} htmlWrap={middlePanelWrap} />
+        <AdvancedMarkdown
+          parentId={this.props.item.id}
+          source={description || ''}
+          htmlWrap={middlePanelWrap}
+        />
         {externalDocs && (
           <Row>
             <MiddlePanel>

diff --git a/src/components/Markdown/AdvancedMarkdown.tsx b/src/components/Markdown/AdvancedMarkdown.tsx
@@ -9,6 +9,7 @@ import { StoreConsumer } from '../StoreBuilder';
 
 export interface AdvancedMarkdownProps extends BaseMarkdownProps {
   htmlWrap?: (part: JSX.Element) => JSX.Element;
+  parentId?: string;
 }
 
 export class AdvancedMarkdown extends React.Component<AdvancedMarkdownProps> {
@@ -28,7 +29,7 @@ export class AdvancedMarkdown extends React.Component<AdvancedMarkdownProps> {
       throw new Error('When using components in markdown, store prop must be provided');
     }
 
-    const renderer = new MarkdownRenderer(options);
+    const renderer = new MarkdownRenderer(options, this.props.parentId);
     const parts = renderer.renderMdWithComponents(source);
 
     if (!parts.length) {

diff --git a/src/services/MarkdownRenderer.ts b/src/services/MarkdownRenderer.ts
@@ -46,7 +46,8 @@ export class MarkdownRenderer {
   private headingEnhanceRenderer: marked.Renderer;
   private originalHeadingRule: typeof marked.Renderer.prototype.heading;
 
-  constructor(public options?: RedocNormalizedOptions) {
+  constructor(public options?: RedocNormalizedOptions, public parentId?: string) {
+    this.parentId = parentId;
     this.parser = new marked.Parser();
     this.headingEnhanceRenderer = new marked.Renderer();
     this.originalHeadingRule = this.headingEnhanceRenderer.heading.bind(
@@ -63,7 +64,9 @@ export class MarkdownRenderer {
   ): MarkdownHeading {
     name = unescapeHTMLChars(name);
     const item: MarkdownHeading = {
-      id: parentId ? `${parentId}/${safeSlugify(name)}` : `section/${safeSlugify(name)}`,
+      id: parentId
+        ? `${parentId}/${safeSlugify(name)}`
+        : `${this.parentId || 'section'}/${safeSlugify(name)}`,
       name,
       level,
       items: [],

diff --git a/src/services/MenuBuilder.ts b/src/services/MenuBuilder.ts
@@ -41,7 +41,7 @@ export class MenuBuilder {
     initialDepth: number,
     options: RedocNormalizedOptions,
   ): ContentItemModel[] {
-    const renderer = new MarkdownRenderer(options);
+    const renderer = new MarkdownRenderer(options, parent?.id);
     const headings = renderer.extractHeadings(description || '');
 
     if (headings.length && parent && parent.description) {