From a2877c2844825853b8913a07a40f814fc03ac999 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Fri, 3 Apr 2020 03:30:16 +0300
Subject: feat: support Markdown by url
---
src/index.tsx | 4 +---
src/lib/Markdown/Markdown.tsx | 15 +++++++++------
2 files changed, 10 insertions(+), 9 deletions(-)
(limited to 'src')
diff --git a/src/index.tsx b/src/index.tsx
index cba71b6..9678beb 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -28,8 +28,6 @@ const useStyles = makeStyles(theme => ({
}));
-const data = "# Getting started\n## Installation \nGo and install it \n# Development\nMore info on dev";
-
const Icon = <img src={icon} width="32px" height="37px" alt="logo"/>
const headerContents = {
@@ -92,7 +90,7 @@ const App: React.FC = () => {
primary
</Button>
</ContentSection>
- <Markdown data={data} />
+ <Markdown url='https://raw.githubusercontent.com/eug-vs/react-benzin/develop/README.md' />
</div>
</Window>
<Window type="secondary" name="SmartList preview window">
diff --git a/src/lib/Markdown/Markdown.tsx b/src/lib/Markdown/Markdown.tsx
index a3ffc38..944ac86 100644
--- a/src/lib/Markdown/Markdown.tsx
+++ b/src/lib/Markdown/Markdown.tsx
@@ -1,10 +1,12 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
import ContentSection from '../ContentSection/ContentSection';
interface PropTypes {
- data: string;
+ data?: string;
+ url?: string;
}
interface RawLinesPropType {
@@ -14,7 +16,7 @@ interface RawLinesPropType {
const header = (level: number): string => {
return `^#{${level}} .*$`;
-};
+}
const Content: React.FC<RawLinesPropType> = ({ rawLines }) => {
const plainText = rawLines.join();
@@ -47,9 +49,10 @@ const Level: React.FC<RawLinesPropType> = ({ rawLines, level = 0 }) => {
);
}
-const Markdown: React.FC<PropTypes> = ({ data }) => {
- const rawLines = data.split('\n');
- return <Level rawLines={rawLines} />
+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')} />
};
--
cgit v1.2.3