Pulls out NewsIndex Astro component

2 files changed, 27 insertions, 2 deletions

diff --git a/src/components/NewsIndex/NewsIndex.astro b/src/components/NewsIndex/NewsIndex.astro
new file mode 100644
index 0000000..6738071
--- /dev/null
+++ b/src/components/NewsIndex/NewsIndex.astro
@@ -0,0 +1,25 @@
+---
+import type { CollectionEntry } from 'astro:content';
+import NewsPreviewLink from './NewsPreviewLink.astro';
+import getLocaleFromPath from '$lib/getLocaleFromPath';
+import translate from '$i18n/translate';
+import tComponent from '$i18n/translations/components/newsIndex';
+interface Props {
+  headingLevel: 'h2' | 'h3' | 'h4';
+  newsItems: CollectionEntry<'news'>[];
+}
+
+const { headingLevel, newsItems } = Astro.props;
+const locale = getLocaleFromPath(Astro.url.pathname);
+const t = translate(locale);
+---
+
+<div class="news-index">
+  {
+    newsItems.length > 0 ? (
+      newsItems.map((item) => <NewsPreviewLink headingLevel={headingLevel} newsItem={item} />)
+    ) : (
+      <p>{t(tComponent, { key: 'no-news' })}</p>
+    )
+  }
+</div>
diff --git a/src/components/NewsPreviewLink.astro b/src/components/NewsIndex/NewsPreviewLink.astro
index 90cce61..aa8a371 100644
--- a/src/components/NewsPreviewLink.astro
+++ b/src/components/NewsIndex/NewsPreviewLink.astro
@@ -1,6 +1,6 @@
 ---
 import translate from '$i18n/translate';
-import tNewsPreviewLink from '$i18n/translations/components/newsPreviewLink';
+import tComponent from '$i18n/translations/components/newsIndex';
 import getLocaleFromPath from '$lib/getLocaleFromPath';
 import type { CollectionEntry } from 'astro:content';
 
@@ -21,5 +21,5 @@ const t = translate(locale);
   `}
   />
   <p>{newsItem.data.summary}</p>
-  <p class="link">{t(tNewsPreviewLink, { key: 'read-article' })}</p>
+  <p class="link">{t(tComponent, { key: 'read-article' })}</p>
 </a>