Adds news index page

2 files changed, 67 insertions, 0 deletions

diff --git a/src/i18n/translations/pages/news.ts b/src/i18n/translations/pages/news.ts
new file mode 100644
index 0000000..0cc411a
--- /dev/null
+++ b/src/i18n/translations/pages/news.ts
@@ -0,0 +1,19 @@
+import type { TranslationsDictionary } from '$types/TranslationsDictionary';
+
+const tPage = {
+  title: {
+    sco: () => 'News',
+    'en-GB': () => 'News',
+  },
+  'read-article': {
+    sco: () => 'Read fu airticle',
+    'en-GB': () => 'Read full article',
+  },
+  'no-news': {
+    sco: () => 'The ar nae news at the present time. Caw again later!',
+    'en-GB': () => 'There is no news at the current time. Check in again later!',
+  },
+};
+
+type Raw = typeof tPage;
+export default tPage as TranslationsDictionary<Raw>;
diff --git a/src/pages/[locale]/news/index.astro b/src/pages/[locale]/news/index.astro
new file mode 100644
index 0000000..3e1b994
--- /dev/null
+++ b/src/pages/[locale]/news/index.astro
@@ -0,0 +1,48 @@
+---
+import translate from '$i18n/translate';
+import tPage from '$i18n/translations/pages/news';
+import Page from '$layouts/Page.astro';
+import getLocaleFromPath from '$lib/getLocaleFromPath';
+import localeStaticPaths from '$lib/localeStaticPaths';
+import { getCollection } from 'astro:content';
+import relativePath from '$lib/relativePath';
+
+const allNews = await getCollection('news');
+const locale = getLocaleFromPath(Astro.url.pathname);
+const allNewsInLocale = allNews.filter(isInLocale);
+const t = translate(locale);
+
+function isInLocale(newsItem: (typeof allNews)[number]) {
+  const srcPath = newsItem.id;
+  const newsItemLocale = srcPath.slice(0, srcPath.indexOf('/'));
+  return newsItemLocale === locale;
+}
+
+export async function getStaticPaths() {
+  return localeStaticPaths;
+}
+---
+
+<Page title={t(tPage, { key: 'title' })}>
+  <section>
+    <h1>{t(tPage, { key: 'title' })}</h1>
+    <div class="news-index">
+      {
+        allNewsInLocale.length > 0 ? (
+          allNewsInLocale.map((item) => (
+            <a
+              class="news-index__item"
+              href={relativePath(Astro.url.pathname, item.slug.replace('/', '-'))}
+            >
+              <h2>{item.data.title}</h2>
+              <p>{item.data.summary}</p>
+              <p class="link">{t(tPage, { key: 'read-article' })}</p>
+            </a>
+          ))
+        ) : (
+          <p>{t(tPage, { key: 'no-news' })}</p>
+        )
+      }
+    </div>
+  </section>
+</Page>