feat: astro seo

packages/website/src/pages/[...locale]/tools/embed/[embed]/host/index.astro

@@ -1,5 +1,4 @@
 ---
-import { capitalize } from 'lodash-es';
 import EmbedLayout from '../../../../../../layouts/EmbedLayout.astro';
 import type { getStaticPaths } from '../index.astro';
 import { Page } from './_index';
@@ -7,8 +6,6 @@ import { Page } from './_index';
 export { getStaticPaths } from '../index.astro';
 ---
 
-<title>BlitzKit - {capitalize(Astro.params.embed)} embed</title>
-
 <EmbedLayout>
   <Page client:only="react" embed={Astro.params.embed} />
 </EmbedLayout>

packages/website/src/pages/[...locale]/tools/embed/[embed]/index.astro

@@ -1,4 +1,5 @@
 ---
+import { AstroSeo } from '@astrolib/seo';
 import type { GetStaticPaths } from 'astro';
 import { capitalize } from 'lodash-es';
 import { embedConfigurations } from '../../../../../constants/embeds';
@@ -21,10 +22,24 @@ export const getStaticPaths = (() => {
     .flat();
 }) satisfies GetStaticPaths;
 
+const name = capitalize(Astro.params.embed);
+const title = `BlitzKit - ${name} embed`;
+const description = `BlitzKit ${name} embeds for streaming World of Tanks Blitz with extreme customization`;
 const { locale } = Astro.params;
 ---
 
-<title>BlitzKit - {capitalize(Astro.params.embed)} embed</title>
+<AstroSeo
+  title={title}
+  description={description}
+  canonical={Astro.url.href}
+  openGraph={{
+    url: Astro.url.href,
+    title,
+    description,
+    site_name: 'BlitzKit',
+  }}
+  twitter={{ cardType: 'summary_large_image' }}
+/>
 
 <style is:global>
   @keyframes fade-out-border {

packages/website/src/pages/[...locale]/tools/tankopedia/[id]/index.astro

@@ -1,4 +1,5 @@
 ---
+import { AstroSeo } from '@astrolib/seo';
 import {
   asset,
   createDefaultProvisions,
@@ -11,10 +12,10 @@ import {
   TIER_ROMAN_NUMERALS,
 } from '@blitzkit/core';
 import { DEFAULT_LOCALE, unwrapper } from '@blitzkit/i18n';
+import { literals } from '@blitzkit/i18n/src/literals';
 import type { GetStaticPaths } from 'astro';
 import { tankCharacteristics } from '../../../../../core/blitzkit/tankCharacteristics';
 import { getStrings } from '../../../../../core/i18n/getStrings';
-import { literals } from '@blitzkit/i18n/src/literals';
 import BaseLayout from '../../../../../layouts/BaseLayout.astro';
 import { genericDefaultEquipmentMatrix } from '../../../../../stores/duel/constants';
 import { getStaticPaths as parentGetStaticPaths } from '../index.astro';
@@ -95,12 +96,12 @@ const description = literals(
 );
 ---
 
-<title>{title}</title>
-<meta property="og:title" content={title} />
-<meta name="description" content={description} />
-<meta property="og:description" content={description} />
-<meta property="og:image" content={icon} />
-<meta property="og:url" content={url} />
+<AstroSeo
+  {title}
+  {description}
+  openGraph={{ title, description, images: [{ url: icon }], url }}
+/>
+
 <meta name="twitter:title" content={title} />
 <meta name="twitter:description" content={description} />
 <meta name="twitter:card" content="summary" />