From 37cb82ccd5a382623effee2205df5ad4c4ac0b22 Mon Sep 17 00:00:00 2001
From: Sergey Yarkov <serzh.yarkov@gmail.com>
Date: Wed, 3 Aug 2022 18:30:20 +0300
Subject: [PATCH] refactor: moved pages to templates

---
 src/pages/404.astro          |  9 ++-------
 src/pages/about.astro        | 23 ++---------------------
 src/pages/articles.astro     | 23 ++---------------------
 src/pages/contacts.astro     | 11 ++---------
 src/pages/index.astro        | 25 ++-----------------------
 src/pages/projects.astro     | 15 ++-------------
 src/templates/About.astro    | 24 ++++++++++++++++++++++++
 src/templates/Articles.astro | 24 ++++++++++++++++++++++++
 src/templates/Contacts.astro | 12 ++++++++++++
 src/templates/Home.astro     | 26 ++++++++++++++++++++++++++
 src/templates/NotFound.astro | 10 ++++++++++
 src/templates/Projects.astro | 16 ++++++++++++++++
 12 files changed, 124 insertions(+), 94 deletions(-)
 create mode 100644 src/templates/About.astro
 create mode 100644 src/templates/Articles.astro
 create mode 100644 src/templates/Contacts.astro
 create mode 100644 src/templates/Home.astro
 create mode 100644 src/templates/NotFound.astro
 create mode 100644 src/templates/Projects.astro

diff --git a/src/pages/404.astro b/src/pages/404.astro
index d12a21c..fa0c686 100644
--- a/src/pages/404.astro
+++ b/src/pages/404.astro
@@ -1,10 +1,5 @@
 ---
-  import PageLayout from '@layouts/default.astro'
+import NotFound from '@root/templates/NotFound.astro';
 ---
 
-<PageLayout title="404" showPageHeading={false}>
-  <div class="container">
-    <h1 style="font-size:var(--font-size-5xl);">404</h1>
-    <p>Страницу которую вы пытаетесь найти не существует.</p>
-  </div>
-</PageLayout>
\ No newline at end of file
+<NotFound />
diff --git a/src/pages/about.astro b/src/pages/about.astro
index fb93f21..7d6b876 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -1,24 +1,5 @@
 ---
-import { SITE_METADATA } from '@root/config';
-import PageLayout from '@layouts/default.astro';
-import SkillsList from '@components/SkillsList';
-import SkillsBlock from '@components/SkillsBlock';
-
-// TODO: import content based on user ui language
-import * as data from '../../content/about/ru/index.md';
-import ArticleContent from '@components/ArticleContent';
-
-const { skills } = SITE_METADATA;
-const { Content } = data;
+import About from '@root/templates/About.astro';
 ---
 
-<PageLayout title="Обо мне">
-	<section>
-		<ArticleContent>
-			<Content />
-		</ArticleContent>
-		<SkillsList>
-			{skills.map((block) => <SkillsBlock data={block} />)}
-		</SkillsList>
-	</section>
-</PageLayout>
+<About />
diff --git a/src/pages/articles.astro b/src/pages/articles.astro
index 8f2974e..c37dc98 100644
--- a/src/pages/articles.astro
+++ b/src/pages/articles.astro
@@ -1,24 +1,5 @@
 ---
-import PageLayout from '@layouts/default.astro';
-import ArticlesList from '@components/ArticlesList';
-import { transformArticles, formatToArticleBlocks } from '@utils/articles';
-
-const articles = await Astro.glob<ArticleType>('../../content/articles/**/*.md');
-const tags = new Set(articles.map((article) => article.frontmatter.tags).flat());
+import Articles from '@root/templates/Articles.astro';
 ---
 
-<PageLayout
-	title='Статьи'
-	description='Технические статьи, туториалы и различные справочные материалы которые связаны с IT тематикой находятся здесь.'
->
-	<section>
-		<ArticlesList
-			client:load
-			data={{
-				articles: formatToArticleBlocks(transformArticles(articles)),
-				tags: [...tags],
-			}}
-			emptyPlaceholder='Не найдено ни одной статьи...'
-		/>
-	</section>
-</PageLayout>
+<Articles />
diff --git a/src/pages/contacts.astro b/src/pages/contacts.astro
index 82caea4..1d07417 100644
--- a/src/pages/contacts.astro
+++ b/src/pages/contacts.astro
@@ -1,12 +1,5 @@
 ---
-import PageLayout from '@layouts/default.astro';
-import ContactForm from '@components/ContactForm';
-import ContactsList from '@components/ContactsList';
+import Contacts from '@root/templates/Contacts.astro';
 ---
 
-<PageLayout title='Контакты' description='Воспользуйтесь формой обратной связи или напишите мне в социальные сети.'>
-	<section>
-		<ContactForm client:idle />
-		<ContactsList />
-	</section>
-</PageLayout>
+<Contacts />
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 50e9e06..3371b69 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,26 +1,5 @@
 ---
-import * as utils from '@utils/index';
-import PageLayout from '@layouts/default.astro';
-import RecentArticles from '@components/RecentArticles';
-import { Splash, SplashHeading, SplashLinks, Link } from '@components/Splash';
-
-const data = await Astro.glob<ArticleType>('../../content/articles/**/*.md');
-const articles = utils.transformArticles(data);
+import Home from '@root/templates/Home.astro';
 ---
 
-<PageLayout showPageHeading={false}>
-	<Splash>
-		<SplashHeading>
-			<hgroup>
-				<h1>Hello, I'am Sergey</h1>
-				<h2>Fullstack <b>web-developer</b> & <b>freelancer</b></h2>
-			</hgroup>
-			<p>Я занимаюсь разработкой веб-сайтов и веб-приложений разной сложности, а также публикую различные статьи и туториалы на разные IT темы.</p>
-		</SplashHeading>
-		<SplashLinks>
-			<Link icon="information" href="/about">обо мне</Link>
-			<Link icon="email_filled" href="/contacts">написать мне</Link>
-		</SplashLinks>
-	</Splash>
-	<RecentArticles articles={articles} length={4} />
-</PageLayout>
+<Home />
diff --git a/src/pages/projects.astro b/src/pages/projects.astro
index 03f8ae5..89b26e8 100644
--- a/src/pages/projects.astro
+++ b/src/pages/projects.astro
@@ -1,16 +1,5 @@
 ---
-import { SITE_METADATA } from '@root/config';
-import PageLayout from '@layouts/default.astro';
-import ProjectsList from '@components/ProjectsList';
-import ProjectItem from '@components/ProjectItem';
-
-const { projects } = SITE_METADATA;
+import Projects from '@root/templates/Projects.astro';
 ---
 
-<PageLayout title='Проекты' description='Несколько моих основных проектов которые были разработаны и выложены в открытый доступ.'>
-	<section>
-		<ProjectsList>
-			{projects.map((project) => <ProjectItem data={project} />)}
-		</ProjectsList>
-	</section>
-</PageLayout>
+<Projects />
diff --git a/src/templates/About.astro b/src/templates/About.astro
new file mode 100644
index 0000000..fb93f21
--- /dev/null
+++ b/src/templates/About.astro
@@ -0,0 +1,24 @@
+---
+import { SITE_METADATA } from '@root/config';
+import PageLayout from '@layouts/default.astro';
+import SkillsList from '@components/SkillsList';
+import SkillsBlock from '@components/SkillsBlock';
+
+// TODO: import content based on user ui language
+import * as data from '../../content/about/ru/index.md';
+import ArticleContent from '@components/ArticleContent';
+
+const { skills } = SITE_METADATA;
+const { Content } = data;
+---
+
+<PageLayout title="Обо мне">
+	<section>
+		<ArticleContent>
+			<Content />
+		</ArticleContent>
+		<SkillsList>
+			{skills.map((block) => <SkillsBlock data={block} />)}
+		</SkillsList>
+	</section>
+</PageLayout>
diff --git a/src/templates/Articles.astro b/src/templates/Articles.astro
new file mode 100644
index 0000000..85bce3c
--- /dev/null
+++ b/src/templates/Articles.astro
@@ -0,0 +1,24 @@
+---
+import PageLayout from '@layouts/default.astro';
+import ArticlesList from '@components/ArticlesList';
+import { transformArticles, formatToArticleBlocks } from '@utils/articles';
+
+const articles = await Astro.glob<ArticleType>('../../content/articles/**/*.md');
+const tags = new Set(articles.map((article) => article.frontmatter.tags).flat());
+---
+
+<PageLayout
+	title="Статьи"
+	description="Технические статьи, туториалы и различные справочные материалы которые связаны с IT тематикой находятся здесь."
+>
+	<section>
+		<ArticlesList
+			client:load
+			data={{
+				articles: formatToArticleBlocks(transformArticles(articles)),
+				tags: [...tags],
+			}}
+			emptyPlaceholder="Не найдено ни одной статьи..."
+		/>
+	</section>
+</PageLayout>
diff --git a/src/templates/Contacts.astro b/src/templates/Contacts.astro
new file mode 100644
index 0000000..2f022ac
--- /dev/null
+++ b/src/templates/Contacts.astro
@@ -0,0 +1,12 @@
+---
+import PageLayout from '@layouts/default.astro';
+import ContactForm from '@components/ContactForm';
+import ContactsList from '@components/ContactsList';
+---
+
+<PageLayout title="Контакты" description="Воспользуйтесь формой обратной связи или напишите мне в социальные сети.">
+	<section>
+		<ContactForm client:idle />
+		<ContactsList />
+	</section>
+</PageLayout>
diff --git a/src/templates/Home.astro b/src/templates/Home.astro
new file mode 100644
index 0000000..50e9e06
--- /dev/null
+++ b/src/templates/Home.astro
@@ -0,0 +1,26 @@
+---
+import * as utils from '@utils/index';
+import PageLayout from '@layouts/default.astro';
+import RecentArticles from '@components/RecentArticles';
+import { Splash, SplashHeading, SplashLinks, Link } from '@components/Splash';
+
+const data = await Astro.glob<ArticleType>('../../content/articles/**/*.md');
+const articles = utils.transformArticles(data);
+---
+
+<PageLayout showPageHeading={false}>
+	<Splash>
+		<SplashHeading>
+			<hgroup>
+				<h1>Hello, I'am Sergey</h1>
+				<h2>Fullstack <b>web-developer</b> & <b>freelancer</b></h2>
+			</hgroup>
+			<p>Я занимаюсь разработкой веб-сайтов и веб-приложений разной сложности, а также публикую различные статьи и туториалы на разные IT темы.</p>
+		</SplashHeading>
+		<SplashLinks>
+			<Link icon="information" href="/about">обо мне</Link>
+			<Link icon="email_filled" href="/contacts">написать мне</Link>
+		</SplashLinks>
+	</Splash>
+	<RecentArticles articles={articles} length={4} />
+</PageLayout>
diff --git a/src/templates/NotFound.astro b/src/templates/NotFound.astro
new file mode 100644
index 0000000..7e74675
--- /dev/null
+++ b/src/templates/NotFound.astro
@@ -0,0 +1,10 @@
+---
+import PageLayout from '@layouts/default.astro';
+---
+
+<PageLayout title="404" showPageHeading={false}>
+	<div class="container">
+		<h1 style="font-size:var(--font-size-5xl);">404</h1>
+		<p>Страницу которую вы пытаетесь найти не существует.</p>
+	</div>
+</PageLayout>
diff --git a/src/templates/Projects.astro b/src/templates/Projects.astro
new file mode 100644
index 0000000..1dddd87
--- /dev/null
+++ b/src/templates/Projects.astro
@@ -0,0 +1,16 @@
+---
+import { SITE_METADATA } from '@root/config';
+import PageLayout from '@layouts/default.astro';
+import ProjectsList from '@components/ProjectsList';
+import ProjectItem from '@components/ProjectItem';
+
+const { projects } = SITE_METADATA;
+---
+
+<PageLayout title="Проекты" description="Несколько моих основных проектов которые были разработаны и выложены в открытый доступ.">
+	<section>
+		<ProjectsList>
+			{projects.map((project) => <ProjectItem data={project} />)}
+		</ProjectsList>
+	</section>
+</PageLayout>