<script setup>
import { defineAsyncComponent } from "vue";

const size375 = defineAsyncComponent(() =>
  import("@/views/myHome/size375/index.vue")
);
const size768 = defineAsyncComponent(() =>
  import("@/views/myHome/size768/index.vue")
);
const size1440 = defineAsyncComponent(() =>
  import("@/views/myHome/size1440/index.vue")
);
const size1920 = defineAsyncComponent(() =>
  import("@/views/myHome/size1920/index.vue")
);

const { viewComponent, componentKey } = useViewSelector({
  size375,
  size768,
  size1440,
  size1920,
});

// SEO for this page
useSeoMeta({
  title: "FiEE Home - Innovative Electronics Solutions",
  description:
    "Welcome to FiEE official website. We provide cutting-edge solutions for your business needs.",
  ogTitle: "FiEE Official Website",
  ogDescription: "Leading the future of electronics...",
  ogImage: "/assets/image/og-home.png",
});
</script>

<template>
  <component :is="viewComponent" :key="componentKey" />
</template>
