src/pages/ToPage.tsx

@@ -0,0 +1,50 @@
+import React from "react"
+import NavbarCentered from "@/components/ui/NavbarCentered"
+import { routes } from "@/routes"
+
+// Assuming these section components exist in src/components/sections/
+// You might need to adjust the imports based on your actual file structure and component names
+import HeroProductShowcase from "@/components/sections/HeroProductShowcase"
+import ProductFeatures from "@/components/sections/ProductFeatures"
+import ProductGrid from "@/components/sections/ProductGrid"
+import CallToAction from "@/components/sections/CallToAction"
+import TestimonialCarousel from "@/components/sections/TestimonialCarousel"
+
+const ToPage: React.FC = () => {
+  const navItems = routes.map((r) => ({ name: r.label, href: r.path }))
+
+  return (
+    <div className="flex min-h-screen flex-col bg-gray-50 text-gray-900">
+      <NavbarCentered navItems={navItems} />
+
+      <main className="flex-grow">
+        <HeroProductShowcase
+          title="Discover Our Innovative Products"
+          description="Explore a range of solutions designed to elevate your experience and simplify your life. Built with quality and precision."
+          primaryButton={{ text: "View All Products", href: "/products" }}
+          secondaryButton={{ text: "Learn More", href: "/about" }}
+          imageSrc="https://images.unsplash.com/photo-1517336714730-bc5567953f9e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80"
+          imageAlt="Modern product display"
+        />
+
+        <ProductFeatures
+          heading="Key Features That Stand Out"
+          subheading="Why our products are the best choice for you."
+          features={[
+            {
+              icon: (
+                <svg
+                  className="h-6 w-6 text-indigo-600"
+                  fill="none"
+                  viewBox="0 0 24 24"
+                  stroke="currentColor"
+                >
+                  <path
+                    strokeLinecap="round"
+                    strokeLinejoin="round"
+                    strokeWidth={2}
+                    d="M13 10V3L4 14h7v7l9-11h-7z"
+                  />
+                </svg>
+              ),
+              title: "

src/routes.ts

@@ -6,4 +6,5 @@ export interface Route {
 
 export const routes: Route[] = [
   { path: '/', label: 'Home', pageFile: 'HomePage' },
+  { path: '/to', label: 'To', pageFile: 'ToPage' },
 ];