76 lines
2.9 KiB
TypeScript
76 lines
2.9 KiB
TypeScript
import { AlertTriangle, KeyRound, Globe, FolderOpen, FileCode } from 'lucide-react'
|
|
|
|
const exposures = [
|
|
{
|
|
icon: KeyRound,
|
|
path: '~/.ssh/',
|
|
label: 'SSH keys',
|
|
desc: 'Private keys, known hosts, agent configs',
|
|
},
|
|
{
|
|
icon: Globe,
|
|
path: '~/.aws/',
|
|
label: 'Cloud credentials',
|
|
desc: 'AWS tokens, GCP configs, Azure secrets',
|
|
},
|
|
{
|
|
icon: FileCode,
|
|
path: '.env',
|
|
label: 'Environment secrets',
|
|
desc: 'API keys, database URLs, auth tokens',
|
|
},
|
|
{
|
|
icon: FolderOpen,
|
|
path: '~/*',
|
|
label: 'Full filesystem',
|
|
desc: 'Every repo, document, and config file',
|
|
},
|
|
]
|
|
|
|
export function Problem() {
|
|
return (
|
|
<section className="py-24 px-6 border-t border-border/30">
|
|
<div className="mx-auto max-w-5xl">
|
|
<div className="max-w-2xl mb-16">
|
|
<div className="flex items-center gap-2 mb-4">
|
|
<AlertTriangle className="h-4 w-4 text-primary" />
|
|
<span className="text-xs font-sans uppercase tracking-wider text-primary font-medium">
|
|
The problem
|
|
</span>
|
|
</div>
|
|
<h2 className="font-serif text-3xl sm:text-4xl font-semibold tracking-tight mb-4">
|
|
Every agent inherits everything.
|
|
</h2>
|
|
<p className="text-muted-foreground font-serif text-lg leading-relaxed">
|
|
AI coding agents run as your user. They see your SSH keys, cloud tokens, env files, and
|
|
entire home directory. The model decides what to access at runtime — guided by weights
|
|
you didn't train, at machine speed. One wrong inference is all it takes.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
|
|
{exposures.map((item) => (
|
|
<div
|
|
key={item.path}
|
|
className="group p-5 rounded-lg border border-border/40 bg-card/30 hover:border-destructive/30 hover:bg-destructive/[0.03] transition-all"
|
|
>
|
|
<item.icon className="h-5 w-5 text-muted-foreground group-hover:text-destructive/70 mb-3 transition-colors" />
|
|
<code className="text-sm font-mono text-foreground block mb-1">{item.path}</code>
|
|
<p className="text-xs text-muted-foreground font-sans">{item.desc}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
<div className="mt-10 p-5 rounded-lg border border-border/30 bg-card/20">
|
|
<p className="text-sm text-muted-foreground font-serif leading-relaxed">
|
|
<span className="text-foreground font-medium">Most setups rely on promises</span> —
|
|
trust the model provider's policies, trust the application code, trust that the
|
|
agent respects boundaries. Greywall replaces trust with enforcement. Constraints are
|
|
applied at the kernel level, below anything the agent or model can circumvent.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|