10x every page: real interactions, kill fake content, wire everything

- ChatWidget: remove illegal seeds, real localStorage per-handle chat,
  honest bot replies about market/forum/funds
- ForumBoard: wire to real forumState (loadForum/addThread/vote), kill
  fake stats and illegal seed posts
- Home page: privacy features list reflects reality, footer links real
- Links: kill all alert() calls, replace fake onions with real clearnet
  privacy resources + internal route grid
- Support: per-coin copied state, env-driven addresses, real BTC addr
- Inner circle: wire to AccountContext, tier system from LUX balance,
  remove hardcoded admin/shadow credentials and fake trading signals
- Drop box: real sealed-note localStorage system, honest about no
  anonymous upload capability, real file picker with receipt
- Messages: fully functional per-handle localStorage chat, AI-style
  contextual bot replies, clear history, honest about local storage
- Wallets: pivot from fake PayPal accounts to Digital Access Passes,
  wire Buy Now to cart via ShopProduct interface
- Testimonials: wire submit form to localStorage, interactive star
  rating 1-10, display submitted reviews above the fold
- Raffle: use real merchant BTC address, real per-handle entry storage,
  honest LUX-only prize disclaimer, fix 0x address
- Drops/Lotto: real number picker 1-49 with Quick Pick, ticket
  submission, match display against drawn numbers, demo disclaimer
- Sanctuary: real 4-4-6-2 breathing timer, meditation passage with
  timer, candle-lighting with localStorage notes
- Game: full playable Void Pong with canvas physics, CPU AI, scoring,
  rally counter, localStorage high score
- Security analysis: honest architecture breakdown with real grades,
  layer-by-layer analysis, practical OPSEC guide, fiction banner
- Trust: compute real scores from actual localStorage data (LUX,
  USD, forum posts, testimonials), FAQ accordion

Made-with: Cursor
This commit is contained in:
drjones
2026-04-16 00:55:28 -07:00
parent 9da373a190
commit 2f928fbdc4
36 changed files with 3837 additions and 2354 deletions

View File

@@ -1,237 +1,226 @@
"use client";
import { useState, useEffect } from "react";
import Link from "next/link";
import { useAccount } from "@/contexts/AccountContext";
import { useWallet } from "@/contexts/WalletContext";
type ActivityMetric = { label: string; value: string; raw: number; max: number; description: string };
function buildMetrics(
luxCredits: number,
usdBalance: number,
testimonials: number,
forumPosts: number,
): ActivityMetric[] {
return [
{
label: "LUX Balance",
value: luxCredits.toLocaleString() + " LUX",
raw: Math.min(luxCredits / 8000, 1) * 100,
max: 8000,
description: "Earned via purchases. Drives Inner Circle tier.",
},
{
label: "USD Balance",
value: "$" + usdBalance.toFixed(2),
raw: Math.min(usdBalance / 500, 1) * 100,
max: 500,
description: "Bitcoin-funded USD credit on your handle.",
},
{
label: "Forum Activity",
value: forumPosts + " posts",
raw: Math.min(forumPosts / 20, 1) * 100,
max: 20,
description: "Threads and replies posted to the Void Aggregate.",
},
{
label: "Testimonials",
value: testimonials + " submitted",
raw: Math.min(testimonials / 5, 1) * 100,
max: 5,
description: "Testimonials written and stored locally.",
},
];
}
function loadForumPostCount(username: string): number {
if (typeof window === "undefined") return 0;
try {
const raw = localStorage.getItem("cyberlux-forum-v3");
if (!raw) return 0;
const data = JSON.parse(raw) as { threads?: { authorHandle: string }[] };
return (data.threads ?? []).filter((t) => t.authorHandle === username).length;
} catch {
return 0;
}
}
function loadTestimonialCount(): number {
if (typeof window === "undefined") return 0;
try {
const raw = localStorage.getItem("cyberlux-testimonials-v1");
if (!raw) return 0;
return (JSON.parse(raw) as unknown[]).length;
} catch {
return 0;
}
}
const WHAT_IS = [
{ q: "What does this score reflect?", a: "Your own activity on this device — LUX credits, USD balance, forum posts, and testimonials you've submitted. Scores are computed locally from your localStorage data." },
{ q: "Is this a global reputation system?", a: "No. Data never leaves your browser. There is no server-side scoring. This page is a personal activity dashboard dressed in the CyberLux aesthetic." },
{ q: "How do I improve my score?", a: "Fund your account via Bitcoin at /account/add-funds, make purchases (earns LUX), post in /forum, and submit testimonials at /testimonials." },
{ q: "What happens if I clear my browser data?", a: "All local data is lost. Export your account bundle from /dashboard before clearing site data to preserve your handle and vault." },
];
export default function TrustPage() {
const trustMetrics = [
{ label: "Overall Trust Score", value: "9.8", max: "10", trend: "+0.2" },
{ label: "Transaction Success", value: "98.7%", max: "100%", trend: "stable" },
{ label: "Dispute Resolution", value: "94%", max: "100%", trend: "+5%" },
{ label: "Encryption Audit", value: "A+", max: "A+", trend: "unchanged" },
{ label: "User Satisfaction", value: "9.5", max: "10", trend: "+0.3" },
{ label: "OnTime Delivery", value: "96.2%", max: "100%", trend: "+1.1%" },
];
const { user } = useAccount();
const { luxCredits, usdStoreCredit } = useWallet();
const [metrics, setMetrics] = useState<ActivityMetric[]>([]);
const [hydrated, setHydrated] = useState(false);
const [openFaq, setOpenFaq] = useState<number | null>(null);
const recentReviews = [
{ user: "VoidWalker", rating: 10, comment: "Flawless transaction. Packaging was indistinguishable from legitimate mail.", date: "20260317" },
{ user: "NeonSpectre", rating: 9, comment: "Product exceeded expectations. Encryption level is militarygrade.", date: "20260316" },
{ user: "QuantumGhost", rating: 10, comment: "The only marketplace I trust for highvalue items. No leaks, no hassles.", date: "20260315" },
{ user: "CipherQueen", rating: 8, comment: "UI is stunning but could be slightly faster on mobile. Otherwise perfect.", date: "20260314" },
{ user: "ShadowBroker", rating: 10, comment: "After three years on darknet markets, CyberLux is the first that feels truly secure.", date: "20260313" },
{ user: "DataPhantom", rating: 9, comment: "Excellent customer support. They resolved a shipping issue within 24 hours.", date: "20260312" },
];
useEffect(() => {
const forumPosts = user ? loadForumPostCount(user.username) : 0;
const testimonials = loadTestimonialCount();
setMetrics(buildMetrics(luxCredits, usdStoreCredit, testimonials, forumPosts));
setHydrated(true);
}, [luxCredits, usdStoreCredit, user]);
const overallScore = hydrated
? Math.round(metrics.reduce((s, m) => s + m.raw, 0) / metrics.length)
: 0;
return (
<div className="min-h-screen bg-gradient-to-b from-gray-950 to-black text-gray-100">
{/* Header */}
<header className="border-b border-gray-800">
<div className="container mx-auto max-w-6xl px-4 py-6">
<div className="flex items-center justify-between">
<div className="flex items-center gap-4">
<div className="h-10 w-10 rounded-full bg-gradient-to-r from-green-500 to-emerald-600"></div>
<div className="container mx-auto max-w-6xl px-4 py-5">
<div className="flex flex-wrap items-center justify-between gap-4">
<div className="flex items-center gap-3">
<div className="h-9 w-9 rounded-full bg-gradient-to-r from-green-500 to-emerald-600" />
<div>
<h1 className="text-2xl font-bold">DarkNet Trust Score</h1>
<p className="text-sm text-gray-400">Communitydriven reputation platform</p>
<h1 className="text-xl font-bold">Activity Dashboard</h1>
<p className="text-xs text-gray-400">Your CyberLux score computed from this device</p>
</div>
</div>
<nav className="hidden md:flex items-center gap-8">
<Link href="/trust" className="font-medium hover:text-green-400">Dashboard</Link>
<Link href="/trust#metrics" className="font-medium hover:text-green-400">Metrics</Link>
<Link href="/trust#reviews" className="font-medium hover:text-green-400">Reviews</Link>
<Link href="/trust#methodology" className="font-medium hover:text-green-400">Methodology</Link>
<a href="/" className="rounded-full bg-green-600 px-6 py-2 font-bold hover:bg-green-700">Back to CyberLux</a>
<nav className="flex flex-wrap items-center gap-4 text-sm">
<Link href="/testimonials" className="text-gray-300 hover:text-green-400">Testimonials</Link>
<Link href="/forum" className="text-gray-300 hover:text-green-400">Forum</Link>
<Link href="/" className="rounded-full bg-green-600 px-5 py-2 font-bold hover:bg-green-700">Hub</Link>
</nav>
</div>
</div>
</header>
{/* Hero */}
<section className="container mx-auto max-w-6xl px-4 py-16">
<div className="rounded-2xl bg-gradient-to-r from-gray-900 to-gray-800 p-10 md:p-16">
<div className="max-w-3xl">
<span className="rounded-full bg-green-900/50 px-4 py-2 text-sm font-bold text-green-300">LIVE SCORE</span>
<h1 className="mt-6 text-5xl font-bold md:text-6xl">
CyberLux Trust Score: <span className="text-green-400">9.8 / 10</span>
</h1>
<p className="mt-6 text-xl text-gray-300">
Based on 2,418 verified transactions and 340 community reviews, CyberLux holds the highest trust rating of any active darknet marketplace.
</p>
<div className="mt-10 flex flex-wrap items-center gap-6">
<div className="flex items-center gap-4">
<div className="text-5xl font-bold">🥇</div>
<div>
<div className="text-lg font-bold">Rank #1</div>
<div className="text-gray-400">out of 47 tracked markets</div>
</div>
</div>
<div className="h-12 w-px bg-gray-700"></div>
<div>
<div className="text-lg font-bold">STATUS</div>
<div className="text-2xl font-bold text-green-400">TRUSTED & VERIFIED</div>
</div>
</div>
</div>
</div>
</section>
{/* Metrics Grid */}
<section id="metrics" className="container mx-auto max-w-6xl px-4 py-12">
<h2 className="mb-8 text-3xl font-bold">Trust Metrics</h2>
<div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
{trustMetrics.map((metric) => (
<div
key={metric.label}
className="rounded-2xl bg-gray-900/50 p-8 backdrop-blur-sm"
>
<div className="flex items-center justify-between">
<h3 className="text-xl font-bold">{metric.label}</h3>
<span className={`rounded-full px-3 py-1 text-xs font-bold ${metric.trend.startsWith('+') ? 'bg-green-900/30 text-green-400' : metric.trend === 'unchanged' ? 'bg-gray-800 text-gray-400' : 'bg-yellow-900/30 text-yellow-400'}`}>
{metric.trend}
</span>
</div>
<div className="mt-6 flex items-end justify-between">
<div>
<div className="text-4xl font-bold">{metric.value}</div>
<div className="text-gray-400">out of {metric.max}</div>
</div>
<div className="text-3xl">
{metric.label.includes("Score") ? "⭐" : metric.label.includes("Success") ? "✅" : metric.label.includes("Dispute") ? "⚖️" : metric.label.includes("Encryption") ? "🔐" : metric.label.includes("Satisfaction") ? "😊" : "📦"}
</div>
</div>
<div className="mt-6 h-2 rounded-full bg-gray-800">
<div
className="h-full rounded-full bg-gradient-to-r from-green-500 to-emerald-500"
style={{
width: `${
metric.value.includes('%')
? parseFloat(metric.value)
: metric.value === 'A+'
? 100
: (parseFloat(metric.value) / parseFloat(metric.max)) * 100
}%`,
}}
></div>
</div>
</div>
))}
</div>
</section>
{/* Recent Reviews */}
<section id="reviews" className="container mx-auto max-w-6xl px-4 py-12">
<div className="mb-8 flex items-center justify-between">
<h2 className="text-3xl font-bold">Recent Community Reviews</h2>
<button className="rounded-full border border-green-500 px-6 py-3 font-bold text-green-400 hover:bg-green-900/30">
Submit Your Review
</button>
</div>
<div className="grid grid-cols-1 gap-6 md:grid-cols-2">
{recentReviews.map((review) => (
<div
key={review.user + review.date}
className="rounded-2xl bg-gray-900/50 p-8 backdrop-blur-sm"
>
<div className="mb-6 flex items-center justify-between">
<div className="flex items-center gap-4">
<div className="h-12 w-12 rounded-full bg-gradient-to-r from-green-700 to-emerald-800 flex items-center justify-center text-xl font-bold">
{review.user.charAt(0)}
</div>
<div>
<div className="font-bold">{review.user}</div>
<div className="text-sm text-gray-400">{review.date}</div>
</div>
</div>
<div className="text-3xl font-bold text-green-400">{review.rating}.0</div>
</div>
<p className="text-gray-300">{review.comment}</p>
<div className="mt-6 flex gap-2">
{Array.from({ length: 5 }).map((_, i) => (
<div
key={i}
className={`h-2 flex-1 rounded-full ${i < Math.floor(review.rating / 2) ? 'bg-green-500' : 'bg-gray-800'}`}
></div>
))}
</div>
</div>
))}
</div>
</section>
{/* Methodology */}
<section id="methodology" className="container mx-auto max-w-6xl px-4 py-12">
<div className="rounded-2xl bg-gradient-to-br from-gray-900 to-black p-10">
<h2 className="text-3xl font-bold">How We Calculate Trust</h2>
<p className="mt-6 text-gray-300">
Our score is derived from seven independent factors, each weighted based on communityvoted importance:
<section className="container mx-auto max-w-6xl px-4 py-12">
<div className="rounded-2xl border border-emerald-900/30 bg-gradient-to-r from-gray-900 to-gray-800 p-10">
<span className="rounded-full bg-emerald-900/30 px-3 py-1 text-xs font-bold text-emerald-300">
LOCAL SCORE · YOUR DEVICE ONLY
</span>
<h1 className="mt-5 text-4xl font-bold md:text-5xl">
{user ? (
<>
@{user.username} Trust Score:{" "}
<span className="text-emerald-400">{overallScore}/100</span>
</>
) : (
<>
Activity Score: <span className="text-emerald-400">{overallScore}/100</span>
</>
)}
</h1>
<p className="mt-4 max-w-2xl text-gray-300">
Computed from your actual local data: LUX credits, USD balance, forum posts, and testimonials stored
in this browser. Not a global ranking your data never leaves your device.
</p>
<div className="mt-10 grid grid-cols-1 gap-8 md:grid-cols-2">
<div>
<h3 className="text-xl font-bold">1. Transaction Success Rate</h3>
<p className="mt-2 text-gray-400">Percentage of orders that are delivered as described, with no disputes.</p>
</div>
<div>
<h3 className="text-xl font-bold">2. Encryption Audit Score</h3>
<p className="mt-2 text-gray-400">Independent security researchers evaluate the platforms cryptographic implementation.</p>
</div>
<div>
<h3 className="text-xl font-bold">3. User Satisfaction Surveys</h3>
<p className="mt-2 text-gray-400">Anonymous feedback collected from verified buyers via encrypted channels.</p>
</div>
<div>
<h3 className="text-xl font-bold">4. Dispute Resolution Efficiency</h3>
<p className="mt-2 text-gray-400">How fairly and quickly the platform resolves conflicts between buyers and sellers.</p>
</div>
<div>
<h3 className="text-xl font-bold">5. Operational Longevity</h3>
<p className="mt-2 text-gray-400">Markets that survive longer without exitscamming gain higher trust.</p>
</div>
<div>
<h3 className="text-xl font-bold">6. Community Sentiment Analysis</h3>
<p className="mt-2 text-gray-400">Naturallanguage processing of forum discussions and review mentions.</p>
</div>
</div>
<div className="mt-12 rounded-2xl bg-green-900/20 p-8">
<h3 className="text-2xl font-bold">Transparency Note</h3>
<p className="mt-4 text-gray-300">
Scores blend uptime telemetry, dispute volume, and sentiment scrapes weights change when the model is re-tuned. Use this board as a first pass, not the final word on any vendor.
{!user && (
<p className="mt-4 text-sm text-amber-300">
<Link href="/sign-in?next=/trust" className="underline">Sign in</Link> to see per-handle scores.
</p>
</div>
)}
</div>
</section>
{/* Footer */}
<footer className="border-t border-gray-800 px-4 py-12">
<div className="container mx-auto max-w-6xl">
<div className="grid grid-cols-1 gap-10 md:grid-cols-3">
<div>
<h3 className="mb-4 text-xl font-bold">DarkNet Trust Score</h3>
<p className="text-gray-400">
An independent, communitydriven reputation platform for darknet marketplaces. Our goal is to reduce fraud and increase transparency.
</p>
</div>
<div>
<h3 className="mb-4 font-bold">LIMITATION</h3>
<p className="text-sm text-gray-500">
Heuristic scores are not legal, financial, or operational guarantees. Wash trading and brigading happen cross-check with escrow receipts you control.
</p>
</div>
<div>
<h3 className="mb-4 font-bold">CONTACT</h3>
<p className="text-gray-400">
Encrypted contact: <span className="text-green-400">trust@darknetscore.example</span>
</p>
<div className="mt-6 flex gap-4">
<button className="rounded-full bg-gray-800 p-3 hover:bg-gray-700">🔒</button>
<button className="rounded-full bg-gray-800 p-3 hover:bg-gray-700">📊</button>
<button className="rounded-full bg-gray-800 p-3 hover:bg-gray-700"></button>
<section id="metrics" className="container mx-auto max-w-6xl px-4 pb-16">
<h2 className="mb-6 text-2xl font-bold">Your Metrics</h2>
{!hydrated ? (
<div className="text-gray-500">Loading</div>
) : (
<div className="grid grid-cols-1 gap-5 md:grid-cols-2">
{metrics.map((m) => (
<div key={m.label} className="rounded-2xl border border-gray-800 bg-gray-900/50 p-7">
<div className="mb-4 flex items-start justify-between gap-2">
<h3 className="text-lg font-bold">{m.label}</h3>
<span className="text-2xl font-bold text-emerald-400">{m.value}</span>
</div>
<p className="mb-4 text-sm text-gray-400">{m.description}</p>
<div className="h-2 rounded-full bg-gray-800">
<div
className="h-full rounded-full bg-gradient-to-r from-emerald-600 to-green-400 transition-all"
style={{ width: `${m.raw}%` }}
/>
</div>
<div className="mt-1 text-right text-xs text-gray-600">{Math.round(m.raw)}%</div>
</div>
))}
</div>
)}
</section>
<section className="container mx-auto max-w-6xl px-4 pb-16">
<h2 className="mb-6 text-2xl font-bold">Improve Your Score</h2>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
{[
{ label: "Add Bitcoin funds", sub: "Boosts USD balance", href: "/account/add-funds", color: "border-orange-700/40 text-orange-400" },
{ label: "Make a purchase", sub: "Earns LUX credits", href: "/market", color: "border-cyan-700/40 text-cyan-400" },
{ label: "Post in forum", sub: "Grows forum activity", href: "/forum", color: "border-purple-700/40 text-purple-400" },
{ label: "Write a testimonial", sub: "Adds to your score", href: "/testimonials#submit", color: "border-emerald-700/40 text-emerald-400" },
].map((item) => (
<Link
key={item.href}
href={item.href}
className={`rounded-xl border p-5 transition-all hover:bg-white/[0.03] ${item.color}`}
>
<div className={`font-bold ${item.color.split(" ")[1]}`}>{item.label}</div>
<p className="mt-1 text-xs text-gray-500">{item.sub}</p>
</Link>
))}
</div>
</section>
<section id="methodology" className="container mx-auto max-w-6xl px-4 pb-16">
<h2 className="mb-6 text-2xl font-bold">FAQ</h2>
<div className="space-y-3 max-w-3xl">
{WHAT_IS.map((item, i) => (
<div key={i} className="rounded-xl border border-gray-800 bg-gray-900/30">
<button
type="button"
onClick={() => setOpenFaq(openFaq === i ? null : i)}
className="flex w-full items-center justify-between px-6 py-4 text-left font-medium hover:text-green-300"
>
{item.q}
<span className={`transition-transform ${openFaq === i ? "rotate-180" : ""}`}></span>
</button>
{openFaq === i && (
<div className="border-t border-gray-800 px-6 py-4 text-sm text-gray-400 leading-relaxed">
{item.a}
</div>
)}
</div>
</div>
<div className="mt-12 border-t border-gray-800 pt-8 text-center text-sm text-gray-500">
<p>© 2026 DarkNet Trust Score · Signal only verify every claim on-chain or in signed messages</p>
</div>
))}
</div>
</section>
<footer className="border-t border-gray-800 px-4 py-8 text-center text-sm text-gray-600">
<p>CyberLux Activity Dashboard · All data client-side · No tracking</p>
<div className="mt-2 flex justify-center gap-6">
<Link href="/" className="hover:text-gray-300">Hub</Link>
<Link href="/testimonials" className="hover:text-gray-300">Testimonials</Link>
<Link href="/reviews" className="hover:text-gray-300">Reviews</Link>
</div>
</footer>
</div>
);
}
}