Add src/app/payment/page.tsx

2026-06-09 23:37:48 +00:00
parent 157c936136
commit 65bbd09e2b
1 changed files with 134 additions and 0 deletions
--- a/src/app/payment/page.tsx
+++ b/src/app/payment/page.tsx
@@ -0,0 +1,134 @@
+"use client";
+
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
+import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { CreditCard, Apple, Google, Paypal, Banknote, MousePointerClick, Wallet, Receipt, History, Repeat, PiggyBank, Bookmark } from "lucide-react";
+
+export default function PaymentSystemPage() {
+    const navItems = [
+        { name: "Features", id: "features" },
+        { name: "Pricing", id: "pricing" },
+        { name: "Payments", href: "/payment" },
+        { name: "Docs", id: "docs" },
+        { name: "Contact", id: "contact" }
+    ];
+
+    const footerColumns = [
+        {
+            title: "Product",            items: [
+                { label: "Features", href: "/#features" },
+                { label: "Pricing", href: "/#pricing" },
+                { label: "Integrations", href: "#" },
+                { label: "Changelog", href: "#" },
+            ],
+        },
+        {
+            title: "Resources",            items: [
+                { label: "Documentation", href: "#" },
+                { label: "API Reference", href: "#" },
+                { label: "Tutorials", href: "#" },
+                { label: "Blog", href: "#" },
+            ],
+        },
+        {
+            title: "Company",            items: [
+                { label: "About", href: "#" },
+                { label: "Careers", href: "#" },
+                { label: "Contact", href: "/#contact" },
+                { label: "Press", href: "#" },
+            ],
+        },
+    ];
+
+    const paymentFeatures = [
+        {
+            id: "stripe",            title: "Stripe Integration",            descriptions: ["Seamlessly process payments using the industry-leading Stripe platform, ensuring reliability and security."],
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/payment/stripe-logo.png?_wi=1"
+        },
+        {
+            id: "apple-pay",            title: "Apple Pay Support",            descriptions: ["Offer customers a fast and secure checkout experience with Apple Pay, reducing friction and increasing conversions."],
+            icon: Apple
+        },
+        {
+            id: "google-pay",            title: "Google Pay Support",            descriptions: ["Integrate Google Pay for Android users, providing another convenient and widely adopted payment method."],
+            icon: Google
+        },
+        {
+            id: "paypal",            title: "PayPal Payments",            descriptions: ["Accept payments via PayPal, a trusted choice for millions of users worldwide."],
+            icon: Paypal
+        },
+        {
+            id: "bank-cards",            title: "Bank Card Processing",            descriptions: ["Support all major credit and debit cards, including Visa, Mastercard, American Express, and Discover."],
+            icon: CreditCard
+        },
+        {
+            id: "one-click",            title: "One-Click Payments",            descriptions: ["Enable lightning-fast checkouts for returning customers with secure one-click payment options."],
+            icon: MousePointerClick
+        },
+        {
+            id: "saved-cards",            title: "Saved Card Management",            descriptions: ["Allow users to securely save multiple payment methods for future purchases, enhancing convenience."],
+            icon: Bookmark
+        },
+        {
+            id: "deposits",            title: "Customer Deposits",            descriptions: ["Manage customer deposits for bookings, pre-orders, or services, with clear tracking and reconciliation."],
+            icon: Wallet
+        },
+        {
+            id: "tips",            title: "Tipping Functionality",            descriptions: ["Integrate an optional tipping system, allowing customers to show appreciation for exceptional service."],
+            icon: PiggyBank
+        },
+        {
+            id: "invoices",            title: "Automated Invoicing",            descriptions: ["Generate professional invoices automatically for every transaction, streamlining your billing process."],
+            icon: Receipt
+        },
+        {
+            id: "refunds",            title: "Easy Refunds",            descriptions: ["Process full or partial refunds directly from your dashboard with just a few clicks."],
+            icon: Repeat
+        },
+        {
+            id: "history",            title: "Payment History",            descriptions: ["Access a comprehensive transaction history, including status, details, and customer information."],
+            icon: History
+        }
+    ];
+
+    return (
+        <ThemeProvider
+            defaultButtonVariant="icon-arrow"
+            defaultTextAnimation="background-highlight"
+            borderRadius="rounded"
+            contentWidth="medium"
+            sizing="medium"
+            background="none"
+            cardStyle="gradient-bordered"
+            primaryButtonStyle="gradient"
+            secondaryButtonStyle="layered"
+            headingFontWeight="semibold"
+        >
+            <NavbarStyleFullscreen
+                navItems={navItems}
+                brandName="AgentFlow"
+                bottomLeftText="Build Smarter"
+                bottomRightText="hello@agentflow.ai"
+            />
+
+            <FeatureCardTwentySeven
+                animationType="slide-up"
+                tag="Payments"
+                tagIcon={CreditCard}
+                title="Comprehensive Payment System"
+                description="Manage all your transactions with a robust payment solution supporting multiple methods, secure storage, and advanced features."
+                textboxLayout="default"
+                useInvertedBackground={false}
+                features={paymentFeatures}
+            />
+
+            <FooterBaseCard
+                logoText="AgentFlow"
+                columns={footerColumns}
+                copyrightText="© 2025 AgentFlow. All rights reserved."
+            />
+        </ThemeProvider>
+    );
+}