Merge branch 'main' into feat/hide-dev-controls

Author: matiboux

app/app/src/components/RenderDocument.astro

@@ -1,7 +1,7 @@
 ---
+import { i18n as i18nConfig } from '~/config'
 import { site } from '~/site'
 import LocalesPicker from '~/components/LocalesPicker/LocalesPicker.astro'
-
 import logosrc from '~/assets/logo.png?url'
 
 function splitHash(hash: string)
@@ -22,11 +22,11 @@ function splitHash(hash: string)
 
 const data = Astro.props.data || {}
 const version = data.version || site.version || 'dev'
-
+const supportedLocales: string[] = data.supportedLocales || [i18nConfig.defaultLocale]
 const footerText = data.footer || null
 ---
 
-<div class="controls">
+<div class="page-controls">
 
 	<LocalesPicker lang={Astro.currentLocale} />
 
@@ -60,6 +60,19 @@ const footerText = data.footer || null
 
 </div>
 
+<div class="page-warnings">
+
+	{!supportedLocales.includes(Astro.currentLocale ?? '') && (
+		<div class="unsupported-locale-warning">
+			<span class="icon icon-[mdi--warning-circle] icon-align"></span>
+			<p>
+				<b>Sorry,</b> this document is not available in your language yet.
+			</p>
+		</div>
+	)}
+
+</div>
+
 <div class="main">
 
 	<div class="content-ruler"></div>
@@ -119,7 +132,7 @@ const footerText = data.footer || null
 <style lang="scss">
 @reference "~/styles/tailwind.css";
 
-.controls {
+.page-controls {
 	@apply flex justify-center items-center gap-4;
 	@apply w-full mt-8;
 
@@ -177,6 +190,23 @@ const footerText = data.footer || null
 	}
 }
 
+.page-warnings {
+	@apply flex justify-center items-center;
+	@apply w-full mt-4 mb-4;
+
+	.unsupported-locale-warning {
+		@apply flex justify-center items-center gap-2;
+		@apply bg-orange-100;
+		@apply px-4 py-2;
+		@apply text-sm text-orange-800 font-semibold;
+		@apply border border-orange-400 rounded-lg;
+
+		.icon {
+			@apply text-xl;
+		}
+	}
+}
+
 .main {
 	@apply flex flex-col justify-start items-center;
 	@apply pt-8 pb-24;