add 404 page

astro.config.mjs

@@ -12,8 +12,6 @@ export default defineConfig({
   i18n: {
     locales: ['ua', 'en'],
     defaultLocale: 'ua',
-    routing: {
-      prefixDefaultLocale: true,
-    },
+    routing: 'manual',
   },
 });

src/lib/dictionaries/en.ts

@@ -7,6 +7,8 @@ export const en: Dict = {
     homeDescription:
       'Devodytyji is an open-air cultural space: concerts, movies, talks and markets under the open sky.',
     defaultOgImage: '/og-cover.jpg',
+    notFoundTitle: 'Page not found',
+    notFoundDescription: 'The page you are looking for does not exist or has been moved.',
   },
   nav: {
     home: 'Home',

src/lib/dictionaries/ua.ts

@@ -5,6 +5,8 @@ export const ua = {
     homeDescription:
       'Devodytyji — відкритий простір на свіжому повітрі: концерти, кіно, лекції та маркети просто неба.',
     defaultOgImage: '/og-cover.jpg',
+    notFoundTitle: 'Сторінку не знайдено',
+    notFoundDescription: 'Схоже, такої сторінки не існує або її було переміщено.',
   },
   nav: {
     home: 'Головна',

src/pages/404.astro

@@ -0,0 +1,29 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+import { getDict, getLocaleFromUrl, localizedPath } from '../lib/i18n';
+import type { Locale } from '../lib/i18n';
+
+const locale: Locale = Astro.locals.locale ?? getLocaleFromUrl(Astro.url);
+const dict = getDict(locale);
+const user = Astro.locals.user;
+---
+
+<BaseLayout
+  locale={locale}
+  dict={dict}
+  pagePath="/404"
+  user={user}
+  title={`${dict.meta.notFoundTitle} — ${dict.meta.siteName}`}
+  description={dict.meta.notFoundDescription}
+>
+  <section class="section">
+    <div class="container" style="text-align:center;">
+      <span class="eyebrow">404</span>
+      <h1>{dict.meta.notFoundTitle}</h1>
+      <p class="text-muted">{dict.meta.notFoundDescription}</p>
+      <p>
+        <a class="btn btn--primary" href={localizedPath(locale, '/')}>{dict.nav.home}</a>
+      </p>
+    </div>
+  </section>
+</BaseLayout>