fix(plugins/plugin-client-common): markdown tabs may drop/misplace text near tab title

Author: starpit

plugins/plugin-client-common/src/components/Content/Markdown/components/tabbed.tsx

@@ -103,11 +103,18 @@ class LinkableTabs extends React.PureComponent<Props, State> {
             className="kui--markdown-tab"
             title={<TabTitleText>{_.props.title}</TabTitleText>}
           >
-            <Card className="kui--markdown-tab-card">{_.props && _.props.children}</Card>
+            <Card className="kui--markdown-tab-card">
+              <React.Fragment>{_.props && _.props.children}</React.Fragment>
+            </Card>
           </Tab>
         ))}
       </Tabs>
     )
+
+    // re: the <React.Fragment> wrapper around props.children; this is
+    // to avoid Card's PatternFly impl creating a separate Markdown
+    // component for every child. We know here that all of the children are part
+    // of the same contiguous stretch of text.
   }
 }
 

plugins/plugin-client-common/src/components/Content/Markdown/rehype-tabbed/index.ts

@@ -116,13 +116,15 @@ export default function plugin(/* options */) {
                     position
                   })
                   return newChildren
-                } else if (currentTabs.length > 0) {
-                  return addToTab(pchild)
                 }
               }
 
-              newChildren.push(pchild)
-              return newChildren
+              if (currentTabs.length > 0) {
+                return addToTab(pchild)
+              } else {
+                newChildren.push(pchild)
+                return newChildren
+              }
             }, [])
           }
           if (currentTabs.length > 0) {