Files
hanzo.ai/app/(marketing)/blockchain/gas/view.tsx
zeekay 081caef236 blockchain: the pages' words go through @hanzo/i18n
BlockchainProductLayout draws every field it is handed with t(), and the
fifteen product views mark their copy with phrase() where it is written.
The index and the chain directory wrap their own words; chain names,
code samples and figures stay as they are. The back arrow and the
call-to-action arrows mirror under dir="rtl", and the two disclosure
heads align to the start instead of the left.
2026-10-22 18:13:04 -07:00

101 lines
3.1 KiB
TypeScript

'use client'
import React from "react";
import {
Zap,
Shield,
Globe,
RefreshCw,
Clock,
Database,
Settings,
BarChart3,
Users,
} from "lucide-react";
import { phrase } from "@hanzo/i18n";
import BlockchainProductLayout, { type CodeExample } from "@/components/blockchain/BlockchainProductLayout";
const HanzoGas = ({ codeExamples }: { codeExamples: CodeExample[] }) => {
return (
<BlockchainProductLayout
slug="gas"
name={phrase("Gas Manager")}
tagline={phrase("Sponsor gas for your users")}
description={phrase("Paymaster-as-a-Service for account abstraction. Sponsor gas fees, set limits per user and per operation, and let users transact without a native token.")}
icon={Zap}
features={[
{
icon: Zap,
title: phrase("Gas Sponsorship"),
description: phrase("Pay gas fees on behalf of your users for frictionless UX."),
},
{
icon: Shield,
title: phrase("Spending Policies"),
description: phrase("Set limits per user, per operation, or per time period."),
},
{
icon: Users,
title: phrase("User Whitelisting"),
description: phrase("Control which users can access sponsored transactions."),
},
{
icon: Globe,
title: phrase("Multi-chain"),
description: phrase("Sponsor gas across Ethereum, Polygon, Arbitrum, and more."),
},
{
icon: Settings,
title: phrase("Custom Paymasters"),
description: phrase("Deploy custom paymaster logic for advanced use cases."),
},
{
icon: Database,
title: phrase("ERC-20 Gas Payment"),
description: phrase("Let users pay gas in stablecoins or your app token."),
},
{
icon: Clock,
title: phrase("Real-time Balance"),
description: phrase("Monitor sponsor balance and usage in real-time."),
},
{
icon: RefreshCw,
title: phrase("Auto-refill"),
description: phrase("Automatic balance top-up when running low."),
},
{
icon: BarChart3,
title: phrase("Usage Analytics"),
description: phrase("Track sponsored gas by user, operation, and chain."),
},
]}
useCases={[
{
title: phrase("Onboarding"),
description: phrase("Remove gas friction for new users entering Web3."),
},
{
title: phrase("Gaming"),
description: phrase("Sponsor in-game transactions so players never stop to buy gas."),
},
{
title: phrase("NFT Minting"),
description: phrase("Cover gas for NFT drops and collection mints."),
},
{
title: phrase("Enterprise Apps"),
description: phrase("Abstract blockchain complexity for business users."),
},
]}
chains={[
"Ethereum", "Polygon", "Arbitrum", "Optimism", "Base",
"BNB Chain", "Avalanche", "zkSync", "Linea",
]}
codeExamples={codeExamples}
/>
);
};
export default HanzoGas;