From aa25db1b2099dba0ffa50e4ab31e8cd9ca010b3c Mon Sep 17 00:00:00 2001 From: chukwu obed Date: Fri, 24 Oct 2025 20:34:38 +0100 Subject: [PATCH] updated the route for the blog --- app/api/contact/route.ts | 37 + app/blog/3/page.tsx | 5 - app/blog/4/page.tsx | 5 - app/blog/5/page.tsx | 5 - app/blog/7/page.tsx | 190 - app/blog/8/page.tsx | 245 - app/blog/9/page.tsx | 220 - app/blog/[id]/page.tsx | 205 - app/blog/[slug]/page.tsx | 146 + app/blog/page.tsx | 151 +- app/contact/contactForm.tsx | 135 + app/contact/page.tsx | 167 +- components/landingpage/landing/trust.tsx | 2 +- lib/blogPosts.ts | 103 +- package-lock.json | 6073 ++++++++++++++-------- package.json | 4 + 16 files changed, 4355 insertions(+), 3338 deletions(-) create mode 100644 app/api/contact/route.ts delete mode 100644 app/blog/3/page.tsx delete mode 100644 app/blog/4/page.tsx delete mode 100644 app/blog/5/page.tsx delete mode 100644 app/blog/7/page.tsx delete mode 100644 app/blog/8/page.tsx delete mode 100644 app/blog/9/page.tsx delete mode 100644 app/blog/[id]/page.tsx create mode 100644 app/blog/[slug]/page.tsx create mode 100644 app/contact/contactForm.tsx diff --git a/app/api/contact/route.ts b/app/api/contact/route.ts new file mode 100644 index 0000000..e6342cc --- /dev/null +++ b/app/api/contact/route.ts @@ -0,0 +1,37 @@ +import nodemailer from 'nodemailer'; +import { NextResponse } from 'next/server'; + +export async function POST(req: Request) { + try { + const { name, email, subject, message } = await req.json(); + + const transporter = nodemailer.createTransport({ + host: 'smtp.gmail.com', + port: 465, + secure: true, + auth: { + type: 'OAuth2', + user: process.env.GMAIL_USER, + clientId: process.env.GOOGLE_CLIENT_ID, + clientSecret: process.env.GOOGLE_CLIENT_SECRET, + refreshToken: process.env.GOOGLE_REFRESH_TOKEN, + }, + }); + + await transporter.sendMail({ + from: email, + to: 'obedsmart2021@gmail.com', + subject: `New message from ${name}: ${subject}`, + text: message, + html: `

From: ${name} (${email})

${message}

`, + }); + + return NextResponse.json({ message: 'Message sent successfully!' }); + } catch (error: any) { + console.error('Detailed mail error:', error); + return NextResponse.json( + { message: 'Failed to send message.' }, + { status: 500 } + ); + } +} diff --git a/app/blog/3/page.tsx b/app/blog/3/page.tsx deleted file mode 100644 index 4bddcc7..0000000 --- a/app/blog/3/page.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import { redirect } from 'next/navigation' - -export default function RedirectTo7() { - redirect('/blog/7') -} diff --git a/app/blog/4/page.tsx b/app/blog/4/page.tsx deleted file mode 100644 index 31c81f3..0000000 --- a/app/blog/4/page.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import { redirect } from 'next/navigation' - -export default function RedirectTo8() { - redirect('/blog/8') -} diff --git a/app/blog/5/page.tsx b/app/blog/5/page.tsx deleted file mode 100644 index ab9a00d..0000000 --- a/app/blog/5/page.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import { redirect } from 'next/navigation' - -export default function RedirectTo9() { - redirect('/blog/9') -} diff --git a/app/blog/7/page.tsx b/app/blog/7/page.tsx deleted file mode 100644 index 9cfaf16..0000000 --- a/app/blog/7/page.tsx +++ /dev/null @@ -1,190 +0,0 @@ -import { ArrowLeft, Calendar, Clock, User, Share2, Rocket } from "lucide-react" -import Link from "next/link" - -export default function LaunchPost() { - return ( -
- {/* Header */} -
-
- - - Back to Home - -
-
- - {/* Article Content */} -
-
- {/* Hero Image */} -
- -
-
πŸš€
-

VELO Launch

-
-
- - {/* Article Header */} -
-
- - Company - -
- -

- VELO Launch β€” 27 September -

- -
-
- - The VELO Team -
-
- - Sep 27, 2025 -
-
- - 4 min read -
- -
-
- - {/* Article Body */} -
-

- On 27 September we officially launched VELO β€” our platform for modern, low-cost payments that empowers businesses to accept and manage digital payments across chains and rails. -

- -

- πŸ“¦ - What we shipped -

-
-
-

- Core payments API with idempotent, tokenized flows. -

-
-
-

- Merchant dashboard for quick onboarding and monitoring. -

-
-
-

- Support for stable, low-cost fiat on/off ramps and existing card flows. -

-
-
- -

- 🀝 - Early traction and partners -

-
-

- Since launch we've onboarded several pilot partners across e-commerce and marketplaces. Early feedback highlights reduced reconciliation time and noticeably lower processing costs. -

-
- -

- πŸ—ΊοΈ - What's next -

-

- Our near-term roadmap focuses on: -

-
-
-
-
- 1 -
-

- Deeper multi-chain wallet support -

-
-
-
-
-
- 2 -
-

- Programmable payouts -

-
-
-
-
-
- 3 -
-

- Improved analytics for merchants -

-
-
-
- - {/* CTA Section */} -
-
-
-

- ✨ - Join us -

-

- If you'd like to pilot VELO or integrate our APIs, reach out via support or sign up for early access on our homepage. -

-
-
-
- - {/* Related Posts */} - -
-
-
- ) -} \ No newline at end of file diff --git a/app/blog/8/page.tsx b/app/blog/8/page.tsx deleted file mode 100644 index fa5828a..0000000 --- a/app/blog/8/page.tsx +++ /dev/null @@ -1,245 +0,0 @@ -import { ArrowLeft, Calendar, Clock, User, Share2, Network } from "lucide-react" -import Link from "next/link" -import Image from "next/image" - -export default function StellarPost() { - return ( -
- {/* Header */} -
-
- -
-
- - {/* Article Content */} -
-
- {/* Hero Image */} -
- Stellar Network - {/*
*/} - {/*
*/} - {/*
⭐
*/} - {/*

Stellar Network

*/} - {/*
*/} -
- - {/* Article Header */} -
-
- - Integrations - -
- -

- Integrating Stellar with VELO -

- -
-
- - Engineering -
-
- - Oct 10, 2025 -
-
- - 7 min read -
- -
-
- - {/* Article Body */} -
-

- We chose Stellar for specific use-cases: predictable transaction pricing, sub-second finality for simple payments, and mature anchors for fiat rails. In this post we'll explain why Stellar fits into VELO's architecture and provide a high-level integration guide. -

- -

- 🎯 - Why Stellar? -

-
-

- Stellar's consensus and fee model make it ideal for micropayments and frequent settlement flows. Anchors translate on-chain balances to fiat rails, which simplifies on/off ramp integrations. -

-
- -

- βš™οΈ - How we use it at VELO -

-
-
-
-
- 1 -
-

- Settlement layer for specific corridors where Stellar anchors are available. -

-
-
-
-
-
- 2 -
-

- Tokenized representations for stable assets and partner-issued tokens. -

-
-
-
-
-
- 3 -
-

- Off-chain order book + on-chain settlement hybrid for cost efficiency. -

-
-
-
- -

- βœ… - Quick integration notes -

-

- For teams integrating Stellar with VELO or using Stellar directly, here's a minimal checklist: -

-
    -
  • -
    - β€’ - - Use the Stellar SDK (js-stellar-sdk) to build and sign transactions server-side. - -
    -
    • -
  • -
    - β€’ - - Design idempotent payment endpoints: store transaction hashes and reconcile using horizon queries. - -
    -
    • -
  • -
    - β€’ - - Use anchors' webhooks to observe inbound/outbound fiat movements and reconcile with on-chain events. - -
    -
    • -
- -

- πŸ”„ - Sample flow (high level) -

-
-
-
-
- 1 -
-
-

User initiates payment via VELO API

-
-
-
-
-
- 2 -
-
-

VELO constructs a Stellar payment transaction

-
-
-
-
-
- 3 -
-
-

Sign and submit to Horizon

-
-
-
-
-
- 4 -
-
-

Listen for successful ledger inclusion and notify merchant

-
-
-
-
- - {/* CTA Section */} -
-
-
-

- πŸ’‘ - Takeaways -

-

- Stellar is a pragmatic choice for fast, cheap settlements in corridors where anchors provide liquidity. For teams evaluating Stellar: focus on robust reconciliation and anchor integration to avoid edge-case failures. -

-
-
-
- - {/* Related Posts */} - -
-
-
- ) -} \ No newline at end of file diff --git a/app/blog/9/page.tsx b/app/blog/9/page.tsx deleted file mode 100644 index de2162c..0000000 --- a/app/blog/9/page.tsx +++ /dev/null @@ -1,220 +0,0 @@ -import { ArrowLeft, Calendar, Clock, User, Share2, Code, Shield } from "lucide-react" -import Link from "next/link" -import Image from "next/image" - -export default function PolkadotPost() { - return ( -
- {/* Header */} -
-
- -
-
- - {/* Article Content */} -
-
- {/* Hero Image */} -
- Polkadot - {/*
*/} -
- {/* - - - - - - */} - {/*

Polkadot

*/} -
-
- - {/* Article Header */} -
-
- - Engineering - -
- -

- Polkadot Support: Design & Implementation -

- -
-
- - Blockchain Team -
-
- - Oct 20, 2025 -
-
- - 9 min read -
- -
-
- - {/* Article Body */} -
-

- Polkadot brings a powerful substrate-based multi-chain model. At VELO we implemented Polkadot support to enable parachain-native assets, cross-chain messaging, and more flexible settlement primitives. -

- -

- πŸ—οΈ - High-level architecture -

-

- We treat Polkadot as one of several settlement rails. Key components include: -

-
    -
  • -
    - β€’ - - A substrate node client to observe events and finalize balances. - -
    -
    • -
  • -
    - β€’ - - An off-chain worker layer to prepare and sign extrinsics (via polkadot-js). - -
    -
    • -
  • -
    - β€’ - - A bridge layer for XCMP/HRMP routing when moving value across parachains. - -
    -
    • -
- -

- πŸ“¨ - XCMP and messaging -

-
-

- Cross-chain messaging on Polkadot is powerful but introduces ordering and reorg complexity. We isolate message handlers, implement idempotency, and rely on finalization confirmations before marking customer balances as settled. -

-
- -

- πŸ‘¨β€πŸ’» - Developer example (polkadot-js) -

-

- Here's a tiny snippet showing how to submit a balance transfer using polkadot-js (high-level): -

-
-
- polkadot-transfer.js - -
- 
-                
-{`import { ApiPromise, WsProvider } from '@polkadot/api'
-
-const provider = new WsProvider('wss://rpc.polkadot.io')
-const api = await ApiPromise.create({ provider })
-const transfer = api.tx.balances.transfer(destination, amount)
-const hash = await transfer.signAndSend(signer)
-console.log('Submitted with hash', hash.toHex())`}
-                
-
-
- -

- πŸ”’ - Security & testing -

-
-
- -

- We thoroughly test cross-chain flows with mocks and testnets -

-
-
- -

- Enforce rate limits on signing endpoints -

-
-
- -

- Use hardware security modules for production signing keys -

-
-
- - {/* CTA Section */} -
-
-
-

- πŸ“ - Summary -

-

- Supporting Polkadot at VELO expanded our settlement options and unlocked on-chain features for parachain-native assets. The trade-offs require careful engineering β€” especially around messaging guarantees and finality handling. -

-
-
-
- - {/* Related Posts */} - -
-
-
- ) -} \ No newline at end of file diff --git a/app/blog/[id]/page.tsx b/app/blog/[id]/page.tsx deleted file mode 100644 index 98043f7..0000000 --- a/app/blog/[id]/page.tsx +++ /dev/null @@ -1,205 +0,0 @@ -import { ArrowLeft, Calendar, Clock, User, Share2 } from "lucide-react" -import Link from "next/link" -import Image from "next/image" -import { blogPosts } from "@/lib/blogPosts" - -export default function BeautifiedBlogPost() { - return ( -
- {/* Header */} -
-
- -
-
- - {/* Article Content */} -
- {/* Hero Image */} -
- VELO β€” Speed Without Limits -
- - {/* Article Header */} -
- {/* Category Badge */} -
- - Industry Insights - -
- - {/* Title */} -

- πŸ’Ž Are You Tired of Wallet Seed Phrases and Juggling Apps? Meet VELO. -

- - {/* Meta Information */} -
-
- - The VELO Team -
-
- - Sep 27, 2025 -
-
- - 5 min read -
- -
-
- - {/* Article Body */} -
-

- Are you tired of writing down 12-word seed phrases every time you create a wallet? Tired of switching between multiple apps just to manage different tokens, send funds, or buy airtime? -

- -

- We get it β€” crypto was supposed to make life easier, but for most people, it's still too complicated. -

- -

- That's why we built VELO β€” a new kind of payments platform designed to make Web3 feel as simple as Web2. -

- - {/* Section: What Is VELO */} -
-

- 🌍 - What Is VELO? -

-

- VELO is a smart payments platform that lets you send, receive, and spend digital money instantly β€” without dealing with wallet complexities. It blends the convenience of everyday fintech apps with the power of blockchain technology. -

-

- In short: VELO gives you the speed of crypto and the simplicity of mobile money β€” all in one place. -

-
- - {/* Section: The Problem */} -

- 🚫 - The Problem -

-

- Let's face it β€” the current payment experience is broken. -

-
    -
  • - β€’ - You need one app for your local currency. -
    • -
  • - β€’ - Another app for your crypto wallet. -
    • -
  • - β€’ - Yet another to buy airtime or pay bills. And if you ever lose your seed phrase… good luck getting your funds back. -
    • -
-

- This complexity keeps millions of people from fully participating in the digital economy. -

- - {/* Section: The VELO Solution */} -

- ⚑ - The VELO Solution -

-

- VELO simplifies everything. -

-
-
-

- No more seed phrases β€” your wallet is smart, secure, and recoverable. -

-
-
-

- No more multiple apps β€” everything you need lives in one ecosystem. -

-
-
-

- No more slow, expensive transfers β€” payments happen instantly, across borders. -

-
-
-

- Under the hood, VELO uses blockchain technology for trust and transparency. But you never have to see it. You just tap, send, and go. -

- - {/* Section: Why It Matters */} -

- πŸ’Έ - Why It Matters -

-

- For the next billion users coming online, simplicity is everything. VELO is making Web3 accessible β€” turning complex crypto infrastructure into a smooth, everyday payment experience. -

-

- It's not just about wallets or tokens. It's about giving people freedom to move money anywhere, without limits. -

- - {/* Final CTA Section */} -
-
-
-

- πŸš€ - VELO β€” Speed Without Limits -

-

- Fast. Simple. Borderless. -

-

- That's the future of payments. That's VELO. -

-
-
-
- - {/* Related Posts */} -
-

More from the blog

-
- {blogPosts - .filter((p) => p.id !== 1) - .slice(0, 2) - .map((post) => ( - -
- {post.category} -

- {post.title} -

-

{post.excerpt}

-
- - ))} -
-
-
-
- ) -} \ No newline at end of file diff --git a/app/blog/[slug]/page.tsx b/app/blog/[slug]/page.tsx new file mode 100644 index 0000000..827435a --- /dev/null +++ b/app/blog/[slug]/page.tsx @@ -0,0 +1,146 @@ +'use client'; + +import { ArrowLeft, Calendar, Clock, User, Share2 } from 'lucide-react'; +import Link from 'next/link'; +import Image from 'next/image'; +import { blogPosts } from '@/lib/blogPosts'; +import { useRouter } from 'next/navigation'; +import React from 'react'; + +type Props = { + params: Promise<{ slug: string }>; +}; + +export default function BeautifiedBlogPost({ params }: Props) { + const router = useRouter(); + const { slug } = React.use(params); + + const post = blogPosts.find((p) => p.slug === slug); + + if (!post) { + return ( +
+
+

Post not found

+

+ We couldn't find the blog post you're looking for. +

+ + + Back to Blog + +
+
+ ); + } + + const related = [...blogPosts].filter((p) => p.id !== post.id).slice(0, 2); + + return ( +
+ {/* Header */} +
+
+ +
+
+ + {/* Article Content */} +
+ {/* Hero Image */} + {post.image && ( +
+ {/* Use Next.js Image for optimization; keep layout simple */} + {post.title} +
+ )} + + {/* Article Header */} +
+ {/* Category Badge */} +
+ + {post.category} + +
+ + {/* Title */} +

+ {post.title} +

+ + {/* Meta Information */} +
+
+ + {post.author ?? 'VELO Team'} +
+
+ + {post.date} +
+
+ + {post.readTime ?? '5 min read'} +
+ +
+
+ + {/* Article Body */} +
+

+ {post.content} +

+
+ + {/* Related Posts */} +
+

+ More from the blog +

+
+ {related.map((post) => ( + +
+ + {post.category} + +

+ {post.title} +

+

{post.content}

+
+ + ))} +
+
+
+
+ ); +} diff --git a/app/blog/page.tsx b/app/blog/page.tsx index a8830f2..955cf93 100644 --- a/app/blog/page.tsx +++ b/app/blog/page.tsx @@ -1,30 +1,33 @@ -import Link from "next/link" -import Image from "next/image" -import { ArrowLeft, Calendar, Clock, User } from "lucide-react" -import { blogPosts } from "@/lib/blogPosts" +import Link from 'next/link'; +import Image from 'next/image'; +import { ArrowLeft, Calendar, Clock, User } from 'lucide-react'; +import { blogPosts } from '@/lib/blogPosts'; export default function ImprovedBlogPage() { return ( -
+
{/* Header */} -
-
- - - Back to Home +
+
+ + + Back to Home
{/* Hero Section */} -
-
-
-
-

- VELO Blog +
+
+
+
+

+ VELO Blog

-

+

Latest news, updates, and insights from the world of fintech

@@ -32,34 +35,32 @@ export default function ImprovedBlogPage() {
{/* Featured Posts - Hero Grid */} -
-
-
+
+
+
{blogPosts.slice(0, 2).map((post) => ( -
- -
-
+
+ +
+
{post.title} -
-
- - {post.category} - +
+
+ {post.category}
-
-

+
+

{post.title}

-

- {post.excerpt} +

+ {post.content}

@@ -70,52 +71,51 @@ export default function ImprovedBlogPage() {
{/* Recent Posts Section */} -
-

Recent Posts

+
+

Recent Posts

{/* Recent Posts Grid - Improved Cards */} -
- {blogPosts.slice(2).map((post) => ( -
- -
+
+ {blogPosts.map((post) => ( +
+ +
{/* Image Section */} -
+
{post.title} -
- {post.category} +
+ {post.category}
{/* Content Section */} -
-

+
+

{post.title}

-

- {post.excerpt} +

+ {post.content}

{/* Metadata */} -
-
- +
+
+ {post.author}
-
- +
+ {post.date}
-
- +
+ {post.readTime}
@@ -129,22 +129,25 @@ export default function ImprovedBlogPage() {

{/* Newsletter CTA */} -
-
-
-
-
-

Stay Updated

-

- Subscribe to our newsletter for the latest fintech insights and VELO updates +

+
+
+
+
+

+ Stay Updated +

+

+ Subscribe to our newsletter for the latest fintech insights and + VELO updates

-
+
-
@@ -153,5 +156,5 @@ export default function ImprovedBlogPage() {
- ) -} \ No newline at end of file + ); +} diff --git a/app/contact/contactForm.tsx b/app/contact/contactForm.tsx new file mode 100644 index 0000000..8ed25e1 --- /dev/null +++ b/app/contact/contactForm.tsx @@ -0,0 +1,135 @@ +"use client"; + +import { Button } from "@/components/ui/buttons"; +import { useState } from "react"; + + +export default function ContactForm() { + const [formData, setFormData] = useState({ + name: "", + email: "", + subject: "", + message: "", + }); + const [loading, setLoading] = useState(false); + const [status, setStatus] = useState(null); + + const handleChange = ( + e: React.ChangeEvent + ) => { + setFormData({ ...formData, [e.target.id]: e.target.value }); + }; + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setLoading(true); + setStatus(null); + + try { + const res = await fetch("/api/contact", { + method: "POST", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify(formData), + }); + + if (res.ok) { + setStatus("Message sent successfully!"); + setFormData({ name: "", email: "", subject: "", message: "" }); + } else { + setStatus("Failed to send message. Please try again."); + } + } catch (err) { + setStatus("An error occurred. Please try again later."); + } finally { + setLoading(false); + } + }; + + return ( +
+

Send us a Message

+ +
+
+
+ + +
+ +
+ + +
+
+ +
+ + +
+ +
+ +