From f0f33fe20111bb6c6fcf84912b42776f7509a075 Mon Sep 17 00:00:00 2001
From: Roman Timashev <roman@tmshv.ru>
Date: Mon, 5 Aug 2019 17:23:10 +0300
Subject: [PATCH] ArticleCard + ArticleCardList refactoring

---
 pages/articles/[page].jsx          |  2 +-
 pages/index.jsx                    |  2 +-
 src/components/ArticleCard.jsx     |  4 +---
 src/components/ArticleCardList.js  | 26 --------------------------
 src/components/ArticleCardList.jsx | 24 ++++++++++++++++++++++++
 5 files changed, 27 insertions(+), 31 deletions(-)
 delete mode 100644 src/components/ArticleCardList.js
 create mode 100644 src/components/ArticleCardList.jsx

diff --git a/pages/articles/[page].jsx b/pages/articles/[page].jsx
index 32429704..6864152f 100644
--- a/pages/articles/[page].jsx
+++ b/pages/articles/[page].jsx
@@ -2,7 +2,7 @@ import React from 'react'
 import axios from 'axios'
 import Head from 'next/head'
 import { App } from '../../src/components/App'
-import ArticleCardList from '../../src/components/ArticleCardList'
+import { ArticleCardList } from '../../src/components/ArticleCardList'
 import menuModel from '../../src/models/menu'
 import { buildMenu } from '../../src/lib/menu'
 import { meta } from '../../src/lib/meta'
diff --git a/pages/index.jsx b/pages/index.jsx
index b4d4c63d..5ed2f7bb 100644
--- a/pages/index.jsx
+++ b/pages/index.jsx
@@ -3,7 +3,7 @@ import axios from 'axios'
 import Head from 'next/head'
 import { App } from '../src/components/App'
 import { Meta } from '../src/components/Meta'
-import ArticleCardList from '../src/components/ArticleCardList'
+import { ArticleCardList } from '../src/components/ArticleCardList'
 import { HudozkaTitle } from '../src/components/HudozkaTitle'
 import menuModel from '../src/models/menu'
 import { meta } from '../src/lib/meta'
diff --git a/src/components/ArticleCard.jsx b/src/components/ArticleCard.jsx
index c7319c95..407120ec 100644
--- a/src/components/ArticleCard.jsx
+++ b/src/components/ArticleCard.jsx
@@ -6,7 +6,7 @@ const Date = ({ children }) => (
     <p className="date">{dateFormat(children)}</p>
 )
 
-const ArticleCard = ({ article }) => (
+export const ArticleCard = ({ article }) => (
     <article className="ArticleCard">
         <style jsx>{`
             .ArticleCard {
@@ -120,5 +120,3 @@ const ArticleCard = ({ article }) => (
         </a>
     </article>
 )
-
-module.exports = ArticleCard
diff --git a/src/components/ArticleCardList.js b/src/components/ArticleCardList.js
deleted file mode 100644
index 68c8f310..00000000
--- a/src/components/ArticleCardList.js
+++ /dev/null
@@ -1,26 +0,0 @@
-const React = require('react')
-const Paginator = require('./Paginator')
-const ArticleCard = require('./ArticleCard')
-
-const ArticleCardList = ({articles, nextPage, prevPage}) => (
-	<div className="ArticleCardList">
-		{!prevPage ? null : (
-			<Paginator url={`/articles/${prevPage}`} type="top"/>
-		)}
-
-		<div className="ArticleCardList-body">
-			{articles.map((article, i) => (
-				<ArticleCard
-					key={i}
-					article={article}
-				/>
-			))}
-		</div>
-
-		{!nextPage ? null : (
-			<Paginator url={`/articles/${nextPage}`} type="bottom"/>
-		)}
-	</div>
-)
-
-module.exports = ArticleCardList
diff --git a/src/components/ArticleCardList.jsx b/src/components/ArticleCardList.jsx
new file mode 100644
index 00000000..bb4ca866
--- /dev/null
+++ b/src/components/ArticleCardList.jsx
@@ -0,0 +1,24 @@
+import React from 'react'
+import Paginator from './Paginator'
+import { ArticleCard } from './ArticleCard'
+
+export const ArticleCardList = ({ articles, nextPage, prevPage }) => (
+    <div className="ArticleCardList">
+        {!prevPage ? null : (
+            <Paginator url={`/articles/${prevPage}`} type="top" />
+        )}
+
+        <div className="ArticleCardList-body">
+            {articles.map((article, i) => (
+                <ArticleCard
+                    key={i}
+                    article={article}
+                />
+            ))}
+        </div>
+
+        {!nextPage ? null : (
+            <Paginator url={`/articles/${nextPage}`} type="bottom" />
+        )}
+    </div>
+)