feat(web): add apps/web Next.js app src, tailwind, tsconfig and pages

2026-08-31 01:21:32 +08:00
parent acc5274a1e
commit 7e554402b2
14 changed files with 1163 additions and 2 deletions
@@ -0,0 +1,10 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+body {
+  background-color: #090A0F;
+  color: #F3F4F6;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  overflow-x: hidden;
+}
@@ -0,0 +1,21 @@
+import './globals.css';
+import React from 'react';
+
+export const metadata = {
+  title: 'WTFX | Next-Gen Prediction Market & Liquidity Protocol',
+  description: 'Ultra-low latency prediction markets powered by Power LDA Bonding Curves',
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="zh-CN" className="dark">
+      <body className="bg-[#090A0F] text-slate-100 antialiased min-h-screen">
+        {children}
+      </body>
+    </html>
+  );
+}
@@ -0,0 +1,57 @@
+'use client';
+
+import React, { useState } from 'react';
+import { Web3Provider } from '../context/Web3Context';
+import { WebNavbar } from '../components/WebNavbar';
+import { MarketExplore, MarketItem } from '../features/explore/MarketExplore';
+import { TradingTerminal } from '../features/trading/TradingTerminal';
+import { PortfolioView } from '../features/portfolio/PortfolioView';
+
+const DEFAULT_MARKET: MarketItem = {
+  id: 'm-1',
+  marketAddress: '0xc0E24E152771C588B21AEB654b30B1cBAf381c1a',
+  title: 'Will Bitcoin break above $120,000 before end of Q4 2026?',
+  category: 'Crypto',
+  tier: 1,
+  outcomes: [
+    { label: 'YES', price: 0.68, percentage: 68 },
+    { label: 'NO', price: 0.32, percentage: 32 }
+  ],
+  poolLiquidity: 1250000,
+  volume24h: 384000,
+  endTime: '2026-12-31',
+  status: 'ACTIVE'
+};
+
+export default function WebApp() {
+  const [activeTab, setActiveTab] = useState<string>('explore');
+  const [selectedMarket, setSelectedMarket] = useState<MarketItem>(DEFAULT_MARKET);
+
+  const handleSelectMarket = (m: MarketItem) => {
+    setSelectedMarket(m);
+    setActiveTab('trade');
+  };
+
+  return (
+    <Web3Provider>
+      <div className="min-h-screen bg-[#090A0F] text-slate-100 flex flex-col selection:bg-cyan-500 selection:text-white">
+        <WebNavbar activeTab={activeTab} setActiveTab={setActiveTab} />
+
+        <main className="flex-1 max-w-7xl w-full mx-auto px-4 sm:px-6 lg:px-8 py-8">
+          {activeTab === 'explore' && <MarketExplore onSelectMarket={handleSelectMarket} />}
+          {activeTab === 'trade' && <TradingTerminal market={selectedMarket} />}
+          {activeTab === 'portfolio' && <PortfolioView />}
+        </main>
+
+        <footer className="border-t border-slate-900 py-8 text-center text-xs text-slate-600 space-y-2">
+          <div>
+            WTFX Prediction Markets &bull; Powered by Power LDA Bonding Curves on Robinhood Chain (ID: 46630)
+          </div>
+          <div className="text-[11px] text-slate-700">
+            All positions and ledger settlements are guaranteed deterministically.
+          </div>
+        </footer>
+      </div>
+    </Web3Provider>
+  );
+}