From d66dea16fc60f751fe80652ff6eccb70a33b4c91 Mon Sep 17 00:00:00 2001
From: matsn0w <bartscholtus@gmail.com>
Date: Tue, 21 Nov 2023 22:23:16 +0100
Subject: [PATCH] feat: add seo meta tags

---
 web/pages/configurator.vue                 |  12 +++++++++++-
 web/pages/index.vue                        |  13 ++++++++++++-
 web/{assets => public}/images/MISS-ELS.png | Bin
 3 files changed, 23 insertions(+), 2 deletions(-)
 rename web/{assets => public}/images/MISS-ELS.png (100%)

diff --git a/web/pages/configurator.vue b/web/pages/configurator.vue
index 3142f22..8d86e37 100644
--- a/web/pages/configurator.vue
+++ b/web/pages/configurator.vue
@@ -160,11 +160,21 @@ import { resetVcfConfiguration } from "~/composables/vcfConfiguration";
 import LocalStorageButton from "~/components/LocalStorageButton.vue";
 import { compareVersions } from "compare-versions";
 
+const url = useRequestURL();
+const config = useRuntimeConfig();
+
 useHead({
   title: "MISS-ELS VCF Configurator",
 });
 
-const config = useRuntimeConfig();
+useSeoMeta({
+  ogSiteName: "MISS-ELS",
+  title: "MISS-ELS VCF Configurator",
+  ogTitle: "MISS-ELS VCF Configurator",
+  ogDescription:
+    "Using our VCF Configurator, you can easily generate configuration files for your vehicles.",
+  ogImage: `${url.origin}/images/MISS-ELS.png`,
+});
 
 const isVcfSchemaVersionUpToDate = computed(() => {
   return (
diff --git a/web/pages/index.vue b/web/pages/index.vue
index a456472..774ebbd 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -25,6 +25,17 @@
 </template>
 
 <script setup lang="ts">
+const url = useRequestURL();
+
+useSeoMeta({
+  ogSiteName: "MISS-ELS",
+  title: "MISS-ELS - server sided sirens for FiveM",
+  ogTitle: "MISS-ELS - server sided sirens for FiveM",
+  ogDescription:
+    "Server-sided ELS for FiveM with custom patterns per vehicle, custom sirens, indicator control and more!",
+  ogImage: `${url.origin}/images/MISS-ELS.png`,
+});
+
 definePageMeta({
   layout: "fullscreen",
 });
@@ -52,7 +63,7 @@ const viewRelease = async () => {
 
 <style>
 .background {
-  background-image: url("~/assets/images/MISS-ELS.png");
+  background-image: url("/images/MISS-ELS.png");
   background-size: cover;
   background-position: center;
 }
diff --git a/web/assets/images/MISS-ELS.png b/web/public/images/MISS-ELS.png
similarity index 100%
rename from web/assets/images/MISS-ELS.png
rename to web/public/images/MISS-ELS.png