hanzo.ai/app/(marketing)/ide/view.tsx

'use client'

import type { ReactNode } from 'react'
import {
  Activity,
  Blocks,
  Brain,
  Cloud,
  Code2,
  GitBranch,
  Lock,
  Network,
  Puzzle,
  Rocket,
  ShieldCheck,
  Users,
} from 'lucide-react'
import { ProductLanding } from '@/components/product/ProductLanding'
import { ProductFooter } from '@/components/products/ProductFooter'
import { useI18n } from '@hanzo/i18n/react'

const IDE = 'https://ide.hanzo.ai'
const GITHUB = 'https://github.com/hanzoai/ide'
const CONSOLE = 'https://platform.hanzo.ai'

export default function IdePage({ source }: { source: ReactNode }) {
  const { t } = useI18n()
  return (
    <>
      <ProductLanding
        badge={t("Hanzo IDE · Developers")}
        badgeIcon={Code2}
        title={t("An IDE that remembers your codebase")}
        lede={t("The editor you already know, on a Rust engine that is ours. The agent keeps a memory of your project across sessions, reads the call graph before it changes a line, and runs every tool in a sandbox.")}
        ctas={[
          { label: t('Open the IDE'), href: IDE, icon: Rocket },
          { label: t('View on GitHub'), href: GITHUB },
        ]}
        note={{ icon: Cloud, text: t('Open source (Apache 2.0). The VS Code workbench on a Rust engine. Open VSX extensions run as they are.') }}
        what={{
          eyebrow: t('What is Hanzo IDE'),
          title: t('The workbench you know, on an engine that is ours'),
          sub: t('The editor surface, the extension model and the keybindings are the ones you use today. Everything under them is Rust: the agent loop, the memory, the indexing, the sandbox.'),
          pillars: [
            {
              icon: Brain,
              title: t('It remembers'),
              body: t('Engram gives the agent a memory that lasts past the conversation: what happened, what is true about the project, and how things are done here. Memories are consolidated, decay when unused, and come back when they matter.'),
            },
            {
              icon: Network,
              title: t('It understands structure'),
              body: t('Tree-sitter indexing gives the agent the call graph, the type hierarchy and the impact radius of a change, so it reads the code that matters instead of every file.'),
            },
            {
              icon: ShieldCheck,
              title: t('It is safe by default'),
              body: t('Tool calls run in a sandbox. Secrets live in the keychain, sensitive fields are encrypted at rest, and every action lands in an audit trail. All of it is in the core, none of it is a plugin.'),
            },
          ],
        }}
        code={{
          head: { eyebrow: t('Get started'), title: t('Open it in the browser, or build it on your machine') },
          lang: 'bash',
          source,
          ctas: [
            { label: t('Open the IDE'), href: IDE, icon: Rocket },
            { label: t('View on GitHub'), href: GITHUB },
          ],
        }}
        features={{
          eyebrow: t('Capabilities'),
          title: t('What the window carries'),
          items: [
            { icon: Brain, title: t('Three tiers of memory'), body: t('A sensory buffer for the turn, working memory for the session, and a long-term graph of episodic, semantic and procedural memory that survives a restart.') },
            { icon: Blocks, title: t('Recall that ranks'), body: t('Full-text and vector search run together across every store, fused and reranked, and every answer arrives with a quality score.') },
            { icon: Users, title: t('Agent profiles'), body: t('Name what an agent may touch, which model it runs on, and how far it may go on its own. Switch profiles per task.') },
            { icon: Activity, title: t('An activity feed'), body: t('Every tool call, every decision and every approval the agent made, in real time, in one column.') },
            { icon: Puzzle, title: t('Open VSX extensions'), body: t('The extensions you rely on install from Open VSX and run natively. Language servers, themes, keymaps.') },
            { icon: Lock, title: t('Ten layers of security'), body: t('PII detection, field-level encryption, sandbox enforcement, keychain integration and audit trails, built into the engine.') },
          ],
        }}
        finalCta={{
          icon: GitBranch,
          title: t('Open the IDE. It already knows the way around.'),
          sub: t('Your project, its call graph, and what the agent learned last week, in one window.'),
          buttons: [
            { label: t('Open the IDE'), href: IDE, icon: Rocket },
            { label: 'GitHub', href: GITHUB },
            { label: t('Hanzo Cloud'), href: CONSOLE },
          ],
        }}
      />
      <ProductFooter slug="ide" name="IDE" />
    </>
  )
}