1 files changed, 42 insertions, 42 deletions

diff --git a/src/index.tsx b/src/index.tsx
index a9a7012..c5e1989 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -27,23 +27,23 @@ const useStyles = makeStyles(theme => ({
     display: 'flex',
     justifyContent: 'center',
     marginTop: theme.spacing(4),
-  }
+  },
 }));
 
 
-const Icon = <img src={icon} width="32px" height="37px" alt="logo"/>
+const Icon = <img src={icon} width="32px" height="37px" alt="logo" />;
 
 const headerContents = {
   home: null,
-  'spacevim': null,
+  spacevim: null,
   'material-ui': null,
-  'custom': null,
+  custom: null,
   'live preview': null,
 };
 
 const pageMap: Record<string, string> = {
   home: 'https://raw.githubusercontent.com/eug-vs/react-benzin/develop/README.md',
-  'spacevim': 'https://raw.githubusercontent.com/spacevim/spacevim/master/README.md',
+  spacevim: 'https://raw.githubusercontent.com/spacevim/spacevim/master/README.md',
   'material-ui': 'https://raw.githubusercontent.com/mui-org/material-ui/master/README.md',
 };
 
@@ -54,11 +54,11 @@ const CustomPage: React.FC = () => {
 
   const handleParseUrl = (): void => {
     setUrl(inputEl.current?.value || '');
-  }
+  };
 
   return (
     <>
-      <ContentSection sectionName="Render custom markdown document" level={2} >
+      <ContentSection sectionName="Render custom markdown document" level={2}>
         <p>
           This should be a link to a valid markdown file. Response should give the file contents.
           If you copy README file from GitHub, make sure you provide link to raw view.
@@ -72,14 +72,14 @@ const CustomPage: React.FC = () => {
             label="Markdown url"
           />
         </p>
-        <Button variant="contained" color="secondary" onClick={handleParseUrl} >
+        <Button variant="contained" color="secondary" onClick={handleParseUrl}>
           Render!
         </Button>
       </ContentSection>
       <Markdown url={url} />
     </>
   );
-}
+};
 
 interface LivePropTypes {
   setLivePreviewData: (livePreviewData: string) => void;
@@ -90,13 +90,14 @@ const LivePreviewPage: React.FC<LivePropTypes> = ({ setLivePreviewData }) => {
 
   const handleRender = (): void => {
     setLivePreviewData(inputEl.current?.value || '');
-  }
+  };
 
   return (
     <>
-      <ContentSection sectionName="Markdown live preview" level={2} >
+      <ContentSection sectionName="Markdown live preview" level={2}>
         <p>
-          Start typing and see your text rendered on the left window! We recommend starting with # Header.
+          Start typing and see your text rendered on the left window!
+          We recommend starting with # Header.
         </p>
         <p>
           <TextField
@@ -111,8 +112,8 @@ const LivePreviewPage: React.FC<LivePropTypes> = ({ setLivePreviewData }) => {
         </p>
       </ContentSection>
     </>
-  )
-}
+  );
+};
 
 
 const App: React.FC = () => {
@@ -122,11 +123,12 @@ const App: React.FC = () => {
 
   const handleGoLivePreview = (): void => {
     setPage('live preview');
-  }
+  };
 
   const url = pageMap[page];
   const fileName = url?.slice(url.lastIndexOf('/') + 1);
   const info = [
+    /* eslint-disable max-len */
     `## Markdown\n [Markdown file](${url}) *(...${fileName})* that you can see on the left was parsed and rendered by **BENZIN**! :rocket:`,
     'Switch between tabs on the header to explore other markdown templates. :recycle: ',
     'Currently **only core features** of markdown function.',
@@ -137,8 +139,15 @@ const App: React.FC = () => {
     'const data = \'# Header\\nHello, *world!*\';',
     'ReactDOM.render(<Markdown data={data}/>, document.getElementById(\'root\'));',
     '```',
+    /* eslint-enable max-len */
   ].join('\n');
 
+  let primaryWindowContent = <Markdown url={url} />;
+  if (page === 'custom') primaryWindowContent = <CustomPage />;
+  else if (page === 'live preview') {
+    primaryWindowContent = <Markdown data={livePreviewData || '# Start typing in the right window!'} />;
+  }
+
   return (
     <Benzin>
       <Header
@@ -151,37 +160,28 @@ const App: React.FC = () => {
         setPage={setPage}
       />
       <Window type="primary">
-        <div className={classes.window}>
-          {
-            (page === 'custom') ?
-            <CustomPage />
-            :
-            (page === 'live preview') ?
-            <Markdown data={livePreviewData || '# Start typing in the right window!'} />
-            :
-            <Markdown url={url} />
-          }
-        </div>
+        <div className={classes.window}>{primaryWindowContent}</div>
       </Window>
       <Window type="secondary" name="Feature preview">
         <div className={classes.window}>
           {
-            (page === 'live preview') ?
-            <LivePreviewPage setLivePreviewData={setLivePreviewData} />
-            :
-            <>
-              <Markdown data={info} />
-              <p className={classes.promoButton}>
-                <Button
-                  variant="contained"
-                  color="primary"
-                  size="large"
-                  onClick={handleGoLivePreview}
-                >
-                  Try it yourself!
-                </Button>
-              </p>
-            </>
+            (page === 'live preview')
+              ? <LivePreviewPage setLivePreviewData={setLivePreviewData} />
+              : (
+                <>
+                  <Markdown data={info} />
+                  <p className={classes.promoButton}>
+                    <Button
+                      variant="contained"
+                      color="primary"
+                      size="large"
+                      onClick={handleGoLivePreview}
+                    >
+                      Try it yourself!
+                    </Button>
+                  </p>
+                </>
+              )
           }
         </div>
       </Window>