import type { Metadata } from "next";

import Navbar from "@/components/Navbar";
import Gallery from "@/components/Gallery";
import Footer from "@/components/Footer";

export const metadata: Metadata = {
  title: "Gallery | GlobalValueTech",
  description:
    "Explore the professional gallery of Eky Syafputra featuring engineering leadership, technology, engineering projects, IoT, facility systems, and professional activities through GlobalValueTech.",

  keywords: [
    "GlobalValueTech Gallery",
    "GloVaTech Gallery",
    "Eky Syafputra Gallery",
    "Eky Syafputra Photos",
    "Engineering Director Gallery",
    "Engineering Leadership",
    "Engineering Projects",
    "Engineering Management",
    "IoT Engineering",
    "Facility Engineering",
    "Building Management System",
    "Energy Management",
    "Technology Projects",
    "Professional Portfolio",
  ],

  alternates: {
    canonical: "https://globalvaluetech.com/gallery",
  },

  openGraph: {
    title: "Gallery | GlobalValueTech",
    description:
      "Professional gallery of Eky Syafputra featuring engineering leadership, technology projects, engineering activities, IoT, facility systems, and professional work.",
    url: "https://globalvaluetech.com/gallery",
    siteName: "GlobalValueTech",
    type: "website",
  },
};

const structuredData = {
  "@context": "https://schema.org",
  "@type": "CollectionPage",
  "@id": "https://globalvaluetech.com/gallery#webpage",

  url: "https://globalvaluetech.com/gallery",

  name: "Gallery | GlobalValueTech",

  description:
    "Professional gallery of Eky Syafputra featuring engineering leadership, technology projects, engineering activities, IoT, facility systems, and professional work.",

  isPartOf: {
    "@id": "https://globalvaluetech.com/#website",
  },

  about: {
    "@id": "https://globalvaluetech.com/#person",
  },
};

export default function GalleryPage() {
  return (
    <>
      <Navbar />

      <div style={{ paddingTop: "76px" }}>
        <Gallery />
      </div>

      <Footer />

      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{
          __html: JSON.stringify(structuredData),
        }}
      />
    </>
  );
}

