mirror of
https://github.com/hanzo-apps/hanzo.ai.git
synced 2026-10-30 14:58:08 +00:00
The focused landing keeps its seven parts and adds back three: Backing under the hero (the fold gate holds "Backed by" at the first scroll), the open-source section with this build's counts, and a band for agents: sign up with a wallet, a key from POST /v1/account/keys, a top-up address from POST /v1/billing/crypto/deposit, no human. The Platform menu and its footer column lead with "Agents: get an API key in one call" again. The description says the agent path and the track record; the home cards are redrawn for the new title and every card takes address v5.
47 lines
2.0 KiB
TypeScript
47 lines
2.0 KiB
TypeScript
'use client'
|
|
|
|
import { phrase } from '@hanzo/i18n'
|
|
import { useI18n } from '@hanzo/i18n/react'
|
|
import { XStack, YStack } from '@hanzo/ui'
|
|
import { Action, Lede, Title } from '@hanzo/ui/marketing'
|
|
|
|
/**
|
|
* The landing's word to an AI agent, in the steps /agents#headless runs as
|
|
* printed: a wallet signs in at hanzo.id, POST /v1/account/keys returns the
|
|
* key, and POST /v1/billing/crypto/deposit returns the address to top up from.
|
|
*/
|
|
const STEPS = [
|
|
{ head: phrase('Sign up with a wallet'), body: phrase('Sign a one-time challenge at hanzo.id. A new wallet gets its own account and organization.') },
|
|
{ head: phrase('Get a key in one call'), body: phrase('POST /v1/account/keys returns an API key for every model, Kai and agents.') },
|
|
{ head: phrase('Top up over the API'), body: phrase('POST /v1/billing/crypto/deposit returns an address. Send USDC or USDT and the balance pays as you go.') },
|
|
] as const
|
|
|
|
export default function Agents() {
|
|
const { t } = useI18n()
|
|
return (
|
|
<YStack id="agents" render="section" width="100%" maxW={1240} mx="auto" px="var(--page-gutter)" py={56} gap="$6" $md={{ py: 80 }}>
|
|
<YStack gap="$3" maxW={760}>
|
|
<Title render="h2">{t('Built for agents. No human required.')}</Title>
|
|
<Lede>{t('An agent signs up, gets its key and pays for what it uses, all over the API.')}</Lede>
|
|
</YStack>
|
|
<XStack gap="$4" flexWrap="wrap">
|
|
{STEPS.map((s, i) => (
|
|
<YStack key={s.head} flex={1} minW={240} gap="$2" p="$5" rounded="$6" borderWidth={1} borderColor="var(--border)">
|
|
<Lede>{`0${i + 1}`}</Lede>
|
|
<Title render="h3" quiet>
|
|
{t(s.head)}
|
|
</Title>
|
|
<Lede>{t(s.body)}</Lede>
|
|
</YStack>
|
|
))}
|
|
</XStack>
|
|
<XStack gap="$3" flexWrap="wrap">
|
|
<Action href="/agents#headless" fill>
|
|
{t('Start as an agent')}
|
|
</Action>
|
|
<Action href="/llms.txt">{t('Read llms.txt')}</Action>
|
|
</XStack>
|
|
</YStack>
|
|
)
|
|
}
|