Merge branch 'main' into ue

packages/preforged/tools/embed/[embed]/_index.tsx

@@ -1,4 +1,3 @@
-import { imgur } from '@blitzkit/core';
 import {
   CodeIcon,
   HeightIcon,
@@ -63,7 +62,7 @@ function Content({ embed }: PageProps) {
   const embedStateStore = EmbedState.useStore();
   const config = embedConfigurations[embed] as EmbedConfig;
   const [backgroundImage, setBackgroundImage] = useState(
-    imgur('SO13zur', { format: 'jpeg' }),
+    '/assets/images/backgrounds/embed-default.webp',
   );
   const fileInput = useRef<HTMLInputElement>();
   const { strings } = useLocale();

packages/preforged/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/preforged/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/preforged/tools/embed/_index.tsx

@@ -1,4 +1,3 @@
-import { imgur, ImgurSize } from '@blitzkit/core';
 import { Box, Flex, Link, Text } from '@radix-ui/themes';
 import { PreviewWrapper } from '../../../../components/Embeds/PreviewWrapper';
 import { LinkI18n } from '../../../../components/LinkI18n';
@@ -85,7 +84,8 @@ function Content() {
                   overflow="hidden"
                   position="relative"
                   style={{
-                    backgroundImage: `url(${imgur('SO13zur', { format: 'jpeg', size: ImgurSize.SmallThumbnail })})`,
+                    backgroundImage:
+                      'url(/assets/images/backgrounds/embed-default.webp)',
                     backgroundSize: 'cover',
                     backgroundPosition: 'center',
                   }}