mirror of
https://github.com/hanzo-apps/hanzo.ai.git
synced 2026-10-30 14:58:08 +00:00
zeekayandGitHub
e20dc71ad8
The product pages from /s3 to /zap, /university and its course data, /trust, /security, /sdks, /support, /tasks, /startups, /sms-opt-in, the buying specialist, Zen, Kai's guide, Studio, the settings pages, and the shared sales, solutions, zap and ui pieces. Client code draws with t(), server components with <T>, copy held as data is marked with phrase() and drawn through t() where it lands. A link or a figure inside a sentence is a value, so a translator reorders the whole sentence. Rebased on main: every page main moved onto Fold or Steps keeps main's layout, with its words wrapped (label, title, lede, points). Steps now draws a step's body through t, as it already drew the title. Settings keeps main's usage panel, refresh, rewards wallet and sign-in wallet rows, each label wrapped. Left English: the skills page's install line (a command and two URLs), and the solution eyebrow and sibling heading built from a kind label. Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
55 lines
1.7 KiB
TypeScript
55 lines
1.7 KiB
TypeScript
'use client'
|
|
|
|
// /work, as the app. The route's client half.
|
|
//
|
|
// FOUR TABS, because the destination answers four questions a person arrives
|
|
// with: what are my agents doing, what compute are they holding, what else could
|
|
// I add, and what have I added already. Browsing is not watching and neither is
|
|
// paying, which is why the shelf and the leases are tabs here rather than rail
|
|
// entries of their own.
|
|
//
|
|
// The tab is local state and not a route: a tab is a view of one destination,
|
|
// and giving each its own address would put four URLs on a rail entry the rail
|
|
// can only light one of.
|
|
|
|
import { useState } from 'react'
|
|
import { YStack } from '@hanzo/ui'
|
|
import { Room } from '@hanzo/app/Room'
|
|
import { Tabs } from '@hanzo/app/tabs'
|
|
import { Work } from '@hanzo/app/Work'
|
|
import { Boxes } from '@hanzo/app/Boxes'
|
|
import { Market } from '@hanzo/app/Market'
|
|
import { phrase } from '@hanzo/i18n'
|
|
import { useI18n } from '@hanzo/i18n/react'
|
|
|
|
const TABS = [
|
|
{ id: 'working', label: phrase('Working') },
|
|
{ id: 'boxes', label: phrase('Sandboxes') },
|
|
{ id: 'all', label: phrase('All agents') },
|
|
{ id: 'installed', label: phrase('Installed') },
|
|
] as const
|
|
|
|
type Tab = (typeof TABS)[number]['id']
|
|
|
|
export default function WorkRoom() {
|
|
const { t } = useI18n()
|
|
const [tab, setTab] = useState<Tab>('working')
|
|
const tabs = TABS.map((x) => ({ id: x.id, label: t(x.label) }))
|
|
|
|
return (
|
|
<Room mode="agents">
|
|
<YStack flex={1} minH={0}>
|
|
<Tabs tabs={tabs} chosen={tab} onPick={setTab} />
|
|
|
|
{tab === 'working' ? (
|
|
<Work />
|
|
) : tab === 'boxes' ? (
|
|
<Boxes />
|
|
) : (
|
|
<Market scope={tab === 'installed' ? 'installed' : 'all'} />
|
|
)}
|
|
</YStack>
|
|
</Room>
|
|
)
|
|
}
|