refactor: improve Markdown/Section :zap:

1 files changed, 20 insertions, 14 deletions

diff --git a/src/lib/Markdown/Section.tsx b/src/lib/Markdown/Section.tsx
index c902379..5ae4a10 100644
--- a/src/lib/Markdown/Section.tsx
+++ b/src/lib/Markdown/Section.tsx
@@ -11,27 +11,33 @@ const matchHeaderLevel = (line: string, level: number): boolean => {
   return line.match(`^#{${level}} .*$`) !== null;
 }
 
-const Section: React.FC<PropTypes> = ({ rawLines, level = 0 }) => {
-  const sectionName = rawLines.splice(0, 1)[0].slice(level).trim();
-  const contentSize = rawLines.findIndex(line => matchHeaderLevel(line, level + 1));
-  const rawContent = rawLines.splice(0, (contentSize < 0) ? rawLines.length : contentSize);
-
+const ChildrenSections: React.FC<PropTypes> = ({ rawLines, level = 1 }) => {
   const childrenSectionLines = rawLines.reduce((sections: string[][], line: string) => {
-    if (matchHeaderLevel(line, level + 1)) sections.push([]);
+    if (matchHeaderLevel(line, level)) sections.push([]);
     if (sections.length) sections[sections.length - 1].push(line);
     return sections;
   }, []);
-  const children = childrenSectionLines.map(sectionLines => <Section rawLines={sectionLines} level={level + 1}/>)
+  const children = childrenSectionLines.map(sectionLines => <Section rawLines={sectionLines} level={level}/>);
+  return <> {children} </>;
+}
+
+const Section: React.FC<PropTypes> = ({ rawLines, level = 0 }) => {
+  if (!level) {
+    const beforeMarkdown = rawLines.splice(0, rawLines.findIndex(line => line.match(/^#.+$/g)));
+    console.log(`This content was found in original .md file but will not be shown: ${beforeMarkdown.join()}`);
+    while(rawLines[0][level + 1] === '#') level++;
+    return <ChildrenSections rawLines={rawLines} level={level + 1}/>;
+  }
+
+  const sectionName = rawLines.splice(0, 1)[0].slice(level).trim();
+  const contentSize = rawLines.findIndex(line => matchHeaderLevel(line, level + 1));
+  const rawContent = rawLines.splice(0, (contentSize < 0) ? rawLines.length : contentSize);
 
-  return level ? (
-    <ContentSection sectionName={sectionName}>
+  return (
+    <ContentSection sectionName={sectionName} level={level}>
       <Content rawLines={rawContent} />
-      {children}
+      <ChildrenSections rawLines={rawLines} level={level + 1} />
     </ContentSection>
-  ) : (
-    <>
-      {children}
-    </>
   );
 }