mirror of
https://github.com/hanzo-apps/hanzo.ai.git
synced 2026-10-30 14:58:08 +00:00
zeekayandGitHub
3df66c3990
Pages from /machines to /risk, the model pages, and the kits they are made of
(page-kit, ProductLanding, LayerPage, Stack, the models kit, band's Head) mark
authored copy where it is written and draw it in the reader's language. A server
page marks a literal phrase('…') or wraps it in <T>; a client page calls t. The
kits translate a string prop through useSay (components/marketing/say), so a
page passes phrase('…') and markup passes as written. An arrow that points
turns over right to left (data-i18n-mirror).
Rebased on main: the fold-based heroes (Fold, PageHero, MachinesHero, the
product and layer pages) keep main's structure and copy, with their label,
title and lede marked phrase. /platform is main's CloudLanding; the deleted
/platform/layers and the old referral components stay deleted.
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
54 lines
1.9 KiB
TypeScript
54 lines
1.9 KiB
TypeScript
'use client'
|
|
|
|
/**
|
|
* ProductFooter — the one block at the bottom of every product page: the
|
|
* product's name and line, its licence and repository, and the two ways to
|
|
* run it (Deploy to Cloud, Self-host). The site's closing call follows it.
|
|
*
|
|
* It used to be two blocks, "Open source" and then "Get <name>" with its own
|
|
* headline, so a product page ended on three headings in a row before the
|
|
* closing call's. One heading now, with the pills under it and the actions
|
|
* beside it from 768px, on the 896 measure the blocks above it stand on. The
|
|
* test ids the products audit reads (oss-attribution, deploy-block,
|
|
* deploy-cta) are the parts' own.
|
|
*/
|
|
|
|
import React from 'react'
|
|
import { YStack } from '@hanzo/ui'
|
|
import { Line } from '@/components/type'
|
|
import { Band } from '@/components/marketing/band'
|
|
import { getProductMetadata } from '@/lib/constants/products-metadata'
|
|
import { OssAttribution } from './OssAttribution'
|
|
import { DeployBlock } from './DeployBlock'
|
|
import { useI18n } from '@hanzo/i18n/react'
|
|
|
|
type Props = {
|
|
slug: string
|
|
name: string
|
|
}
|
|
|
|
export function ProductFooter({ slug, name }: Props) {
|
|
const meta = getProductMetadata(slug)
|
|
const { t } = useI18n()
|
|
return (
|
|
<Band pad="$10" measure={896}>
|
|
<YStack gap={28} $md={{ flexDirection: 'row', items: 'center', justify: 'space-between' }}>
|
|
<YStack gap={12} shrink={1} minW={0}>
|
|
<Line render="h2" size="xl" weight="500" $md={{ fontSize: 'var(--text-2xl)', lineHeight: '1.3333' }}>
|
|
{t('Get {name}', { name })}
|
|
</Line>
|
|
{meta?.tagline ? (
|
|
<Line render="p" size="sm" tone="muted">
|
|
{t(meta.tagline)}
|
|
</Line>
|
|
) : null}
|
|
<OssAttribution slug={slug} meta={meta ?? undefined} />
|
|
</YStack>
|
|
<DeployBlock slug={slug} />
|
|
</YStack>
|
|
</Band>
|
|
)
|
|
}
|
|
|
|
export default ProductFooter
|