From bdcc2edb38fb0e57604fa12d25b2a4b478261e18 Mon Sep 17 00:00:00 2001
From: Eug-VS <eug-vs@keemail.me>
Date: Sat, 4 Apr 2020 22:05:40 +0300
Subject: refactor: structurize Markdown component :recycle:

---
 src/lib/Markdown/Markdown.tsx | 71 ++-----------------------------------------
 1 file changed, 2 insertions(+), 69 deletions(-)

(limited to 'src/lib/Markdown/Markdown.tsx')

diff --git a/src/lib/Markdown/Markdown.tsx b/src/lib/Markdown/Markdown.tsx
index 8d93437..aee96e9 100644
--- a/src/lib/Markdown/Markdown.tsx
+++ b/src/lib/Markdown/Markdown.tsx
@@ -1,84 +1,17 @@
 import React, { useState } from 'react';
 import axios from 'axios';
 
-import ContentSection from '../ContentSection/ContentSection';
-
+import Section from './Section';
 
 interface PropTypes {
   data?: string;
   url?: string;
 }
 
-interface RawLinesPropType {
-  rawLines: string[];
-  level?: number;
-}
-
-const header = (level: number): string => {
-  return `^#{${level}} .*$`;
-}
-
-const CodeBlock: React.FC<{ rawLines: String[]}> = ({ rawLines }) => {
-  return (
-    <p style={{background: '#444444'}}>
-      {rawLines.map(line => <> {line} <br/> </>)}
-    </p>
-  );
-}
-
-
-const Content: React.FC<RawLinesPropType> = ({ rawLines }) => {
-  if (!rawLines.length) return <></>;
-  const line = rawLines[0];
-  const otherLines = rawLines.slice(1);
-  if (line.slice(0, 3) === '```') {
-    const closeIndex = otherLines.findIndex(line => line.slice(0, 3) === '```');
-    console.log({ line, otherLines, closeIndex });
-    return (
-      <>
-        <CodeBlock rawLines={otherLines.slice(0, closeIndex)} />
-        <Content rawLines={otherLines.slice(closeIndex + 1)} />
-      </>
-    )
-  }
-  return (
-    <>
-      <p> {line} </p>
-      <Content rawLines={rawLines.slice(1)} />
-    </>
-  )
-}
-
-const Level: React.FC<RawLinesPropType> = ({ rawLines, level = 0 }) => {
-  const name = rawLines[0].slice(level);
-  const contentSize = rawLines.findIndex(line => line.match(header(level + 1)));
-
-  const rawContent = (contentSize > 0) ? rawLines.slice(1, contentSize) : rawLines.slice(1);
-  const rawChildren = rawLines.slice(contentSize);
-
-  const childrenLineGroups = rawChildren.reduce((acc: string[][], cur: string) => {
-    if (cur.match(header(level + 1))) acc.push([]);
-    if (acc.length) acc[acc.length - 1].push(cur);
-    return acc;
-  }, []);
-  const children = childrenLineGroups.map(lineGroup => <Level rawLines={lineGroup} level={level + 1}/>)
-
-  return level ? (
-    <ContentSection sectionName={name}>
-      <Content rawLines={rawContent} />
-      {children}
-    </ContentSection>
-  ) : (
-    <>
-      {children}
-    </>
-  );
-}
-
 const Markdown: React.FC<PropTypes> = ({ data, url }) => {
   const [markdown, setMarkdown] = useState<string>(data || '');
   if (url) axios.get(url).then(response => setMarkdown(response.data));
-  return <Level rawLines={markdown.split('\n')} />
+  return <Section rawLines={markdown.split('\n')} />
 };
 
 
-- 
cgit v1.2.3