292 lines
12 KiB
TypeScript
292 lines
12 KiB
TypeScript
"use client"
|
|
|
|
import { useSectionReveal } from "@/hooks/use-section-reveal"
|
|
|
|
export function LegacySection() {
|
|
const sectionRef = useSectionReveal()
|
|
|
|
return (
|
|
<section ref={sectionRef} className="relative py-32 px-6 noise-overlay">
|
|
<div className="mycelial-divider mb-20" />
|
|
|
|
<div className="max-w-4xl mx-auto space-y-16">
|
|
{/* Header */}
|
|
<div className="section-reveal space-y-4 text-center">
|
|
<h2 className="font-serif text-4xl sm:text-5xl md:text-6xl font-bold">
|
|
The Roots
|
|
</h2>
|
|
<p className="text-lg sm:text-xl opacity-70 max-w-2xl mx-auto">
|
|
Every network grows from somewhere. Ours grows from the Commons
|
|
Stack, the P2P Foundation, and the broader commons movement.
|
|
</p>
|
|
</div>
|
|
|
|
{/* P2P Foundation */}
|
|
<div className="section-reveal max-w-3xl mx-auto space-y-6">
|
|
<h3 className="font-serif text-2xl sm:text-3xl font-semibold">
|
|
The P2P Foundation
|
|
</h3>
|
|
<div className="space-y-4 text-base leading-relaxed opacity-80">
|
|
<p>
|
|
The{" "}
|
|
<a
|
|
href="https://wiki.p2pfoundation.net/"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="domain-link"
|
|
>
|
|
P2P Foundation Wiki
|
|
</a>
|
|
, started by Michel Bauwens and shaped by
|
|
hundreds of contributors, documents the emerging landscape of
|
|
peer-to-peer collaboration and commons-based alternatives. Over
|
|
25,000 pages of case studies, theoretical frameworks, policy
|
|
proposals, and practical guides — an open knowledge base
|
|
that continues to inform projects worldwide.
|
|
</p>
|
|
<p>
|
|
Out of this work came key frameworks:{" "}
|
|
<strong>commons-based peer production</strong>, the{" "}
|
|
<strong>partner state</strong>, and{" "}
|
|
<strong>cosmo-localism</strong> (“design global, manufacture
|
|
local”). These ideas didn’t belong to any one person
|
|
— they emerged from a network of researchers, practitioners,
|
|
and communities building alternatives in the open.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Three modes */}
|
|
<div className="section-reveal glass-card p-6 sm:p-8 max-w-3xl mx-auto">
|
|
<h4 className="font-serif text-lg font-semibold mb-4 opacity-70">
|
|
Three Modes of Production
|
|
</h4>
|
|
<div className="grid gap-4 sm:grid-cols-3 font-mono text-sm">
|
|
<div className="space-y-1">
|
|
<div className="opacity-40">01</div>
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
State / Hierarchy
|
|
</div>
|
|
<div className="opacity-60">Top-down coordination</div>
|
|
</div>
|
|
<div className="space-y-1">
|
|
<div className="opacity-40">02</div>
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
Market / Exchange
|
|
</div>
|
|
<div className="opacity-60">
|
|
Price-coordinated transactions
|
|
</div>
|
|
</div>
|
|
<div className="space-y-1">
|
|
<div className="opacity-40">03</div>
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
Commons / P2P
|
|
</div>
|
|
<div className="opacity-60">
|
|
Contributory, needs-based collaboration
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p className="mt-4 text-sm opacity-50">
|
|
MycoStack lives in the third mode — and builds the tools to
|
|
make it thrive.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Commons Stack history */}
|
|
<div
|
|
className="section-reveal max-w-3xl mx-auto space-y-6"
|
|
style={{ transitionDelay: "0.15s" }}
|
|
>
|
|
<h3 className="font-serif text-2xl sm:text-3xl font-semibold">
|
|
The Commons Stack
|
|
</h3>
|
|
<div className="space-y-4 text-base leading-relaxed opacity-80">
|
|
<p>
|
|
The{" "}
|
|
<a
|
|
href="https://commonsstack.org"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="domain-link"
|
|
>
|
|
Commons Stack
|
|
</a>{" "}
|
|
was born from this intellectual tradition. Its mission:{" "}
|
|
<em>fund and govern the commons</em>. Through pioneering work in
|
|
token engineering, augmented bonding curves, and conviction
|
|
voting, the Commons Stack and its{" "}
|
|
<strong>Trusted Seed</strong> community developed regenerative
|
|
funding mechanisms for commons infrastructure.
|
|
</p>
|
|
<p>
|
|
But tools alone aren’t enough. The Commons Stack taught us
|
|
that technology must be wrapped in culture — in shared
|
|
values, governance practices, and communities of care. The
|
|
Trusted Seed wasn’t just a token-holder registry; it was an
|
|
experiment in building trust at the speed of consensus.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Flow Funding */}
|
|
<div
|
|
className="section-reveal max-w-3xl mx-auto space-y-6"
|
|
style={{ transitionDelay: "0.18s" }}
|
|
>
|
|
<h3 className="font-serif text-2xl sm:text-3xl font-semibold">
|
|
Flow Funding
|
|
</h3>
|
|
<div className="space-y-4 text-base leading-relaxed opacity-80">
|
|
<p>
|
|
The Commons Stack pioneered the Augmented Bonding Curve — a
|
|
breakthrough in sustainable funding for the commons. Flow Funding
|
|
is its natural evolution: less mechanism, more ecology. Where the
|
|
ABC created a single reservoir, Flow Funding cultivates{" "}
|
|
<em>enmeshed ecologies</em> of inter- and intra-organizational
|
|
flow — resources circulating continuously between nested
|
|
communities the way nutrients cycle through a forest floor.
|
|
</p>
|
|
<p>
|
|
At the heart of Flow Funding is a threshold-based model rooted in
|
|
the concept of <strong>“enoughness”</strong> —
|
|
enabling an economics of sufficiency rather than accumulation. When
|
|
a node in the network has enough, surplus flows onward to where
|
|
it’s needed. No hoarding, no artificial scarcity. Just the
|
|
continuous circulation that living systems have practiced for
|
|
billions of years.
|
|
</p>
|
|
<p>
|
|
This is economics as ecology: not designing incentives from above,
|
|
but cultivating the conditions for resources to find their own
|
|
path — rooted, reciprocal, and regenerative by nature.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* P4P framework */}
|
|
<div
|
|
className="section-reveal max-w-3xl mx-auto space-y-6"
|
|
style={{ transitionDelay: "0.24s" }}
|
|
>
|
|
<h3 className="font-serif text-3xl sm:text-4xl md:text-5xl font-bold text-center">
|
|
The Birth of the
|
|
<br />
|
|
Peer-for-Peer (P4P) Movement
|
|
</h3>
|
|
<div className="space-y-4 text-base leading-relaxed opacity-80">
|
|
<p>
|
|
MycoStack carries this legacy forward by giving birth to a
|
|
movement: <strong>Peer-for-Peer (P4P)</strong> — an
|
|
evolution of P2P thinking that shifts from peers exchanging{" "}
|
|
<em>with</em> each other to peers acting <em>for</em> each other.
|
|
Mutual care and regeneration as core protocols. Active stewardship
|
|
rather than passive participation. Solidarity economics in
|
|
practice.
|
|
</p>
|
|
<p>
|
|
Where the original Commons Stack built tools, MycoStack grows
|
|
ecosystems. Where P2P described a relational dynamic, P4P demands
|
|
a commitment. The mycelium doesn’t just connect — it
|
|
nourishes.
|
|
</p>
|
|
</div>
|
|
|
|
{/* P4P meanings */}
|
|
<div className="glass-card p-6 sm:p-8 space-y-4">
|
|
<h4 className="font-serif text-lg font-semibold opacity-70 text-center">
|
|
P4P is a fractal — the same ethic, many expressions
|
|
</h4>
|
|
<div className="grid gap-3 sm:grid-cols-2 font-mono text-sm">
|
|
<div className="space-y-1">
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
Peer for Peer
|
|
</div>
|
|
<div className="opacity-60">
|
|
Individuals acting in service of one another
|
|
</div>
|
|
</div>
|
|
<div className="space-y-1">
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
People for Planet
|
|
</div>
|
|
<div className="opacity-60">
|
|
Collective stewardship of our shared home
|
|
</div>
|
|
</div>
|
|
<div className="space-y-1">
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
Protocols for Participation
|
|
</div>
|
|
<div className="opacity-60">
|
|
Governance tools that encode mutual care
|
|
</div>
|
|
</div>
|
|
<div className="space-y-1">
|
|
<div className="font-serif text-base font-semibold not-italic">
|
|
Platforms for the Public
|
|
</div>
|
|
<div className="opacity-60">
|
|
Infrastructure owned by the communities it serves
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p className="text-sm opacity-50 text-center pt-2">
|
|
Every reading of P4P converges on the same principle: mutual
|
|
flourishing over extraction.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Pillars */}
|
|
<div
|
|
className="section-reveal grid gap-6 sm:grid-cols-2 max-w-3xl mx-auto"
|
|
style={{ transitionDelay: "0.25s" }}
|
|
>
|
|
{[
|
|
{
|
|
title: "Preserve",
|
|
text: "Steward the knowledge commons. The P2P Foundation Wiki, oral histories, theoretical frameworks \u2014 ensuring decades of accumulated wisdom remain living resources, not static monuments.",
|
|
},
|
|
{
|
|
title: "Sustain",
|
|
text: "Build regenerative funding loops for commons infrastructure. Quadratic funding, mutual credit, contributor support systems \u2014 economics that feed the network instead of extracting from it.",
|
|
},
|
|
{
|
|
title: "Evolve",
|
|
text: "Update the theoretical frameworks for current conditions. Bridge Web3 and traditional commons movements. Experiment with emerging technologies in service of collective flourishing.",
|
|
},
|
|
{
|
|
title: "Propagate",
|
|
text: "Spread the spores. Educational resources, onboarding pathways, translation and localization. Grow the network of people who understand and practice commons governance.",
|
|
},
|
|
].map((pillar, i) => (
|
|
<div
|
|
key={pillar.title}
|
|
className="glass-card p-5 space-y-2"
|
|
>
|
|
<h4 className="font-serif text-lg font-semibold">
|
|
{pillar.title}
|
|
</h4>
|
|
<p className="text-sm leading-relaxed opacity-70">
|
|
{pillar.text}
|
|
</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Quote */}
|
|
<blockquote className="section-reveal max-w-2xl mx-auto text-center">
|
|
<p className="font-serif text-xl sm:text-2xl italic leading-relaxed opacity-70">
|
|
“The more we share, the more we have.”
|
|
</p>
|
|
<cite className="block mt-3 text-sm opacity-40 not-italic">
|
|
— a commons proverb
|
|
</cite>
|
|
</blockquote>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|