Initial commit
This commit is contained in:
Peter Stockings
13
packages/client/index.html
Normal file
13
packages/client/index.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Torrent Client</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
35
packages/client/package.json
Normal file
35
packages/client/package.json
Normal file
@@ -0,0 +1,35 @@
|
||||
{
|
||||
"name": "@torrent-client/client",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@torrent-client/shared": "*",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"lucide-react": "^0.284.0",
|
||||
"framer-motion": "^10.16.4",
|
||||
"clsx": "^2.0.0",
|
||||
"tailwind-merge": "^1.14.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.2.15",
|
||||
"@types/react-dom": "^18.2.7",
|
||||
"@typescript-eslint/eslint-plugin": "^6.0.0",
|
||||
"@typescript-eslint/parser": "^6.0.0",
|
||||
"@vitejs/plugin-react": "^4.0.3",
|
||||
"autoprefixer": "^10.4.14",
|
||||
"eslint": "^8.45.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.3",
|
||||
"postcss": "^8.4.27",
|
||||
"tailwindcss": "^3.3.3",
|
||||
"vite": "^4.4.5"
|
||||
}
|
||||
}
|
||||
6
packages/client/postcss.config.js
Normal file
6
packages/client/postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
348
packages/client/src/App.tsx
Normal file
348
packages/client/src/App.tsx
Normal file
@@ -0,0 +1,348 @@
|
||||
import { useState, useCallback, useEffect } from 'react'
|
||||
import { Magnet, Info, CheckCircle2, Search, Activity, Network, FileText, Globe, ArrowRight, Trash2, Plus, Zap, Shield, BarChart3, DownloadCloud, Box, Layers, Play } from 'lucide-react'
|
||||
import { motion, AnimatePresence } from 'framer-motion'
|
||||
|
||||
interface TorrentSession {
|
||||
hash: string;
|
||||
name: string;
|
||||
status: 'discovering' | 'ready' | 'downloading' | 'paused' | 'completed' | 'error';
|
||||
progress: number;
|
||||
peers: number;
|
||||
activeConnections: number;
|
||||
files: { name: string, size: number }[];
|
||||
errorMessage: string | null;
|
||||
}
|
||||
|
||||
function App() {
|
||||
const [magnetInput, setMagnetInput] = useState('')
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [torrents, setTorrents] = useState<TorrentSession[]>([])
|
||||
const [isAdding, setIsAdding] = useState(false)
|
||||
|
||||
const fetchTorrents = useCallback(async () => {
|
||||
try {
|
||||
const response = await fetch('/api/torrents')
|
||||
if (response.ok) {
|
||||
const data = await response.json()
|
||||
setTorrents(data)
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Failed to fetch torrents:', err)
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
fetchTorrents()
|
||||
const interval = setInterval(fetchTorrents, 2000)
|
||||
return () => clearInterval(interval)
|
||||
}, [fetchTorrents])
|
||||
|
||||
const handleAddTorrent = async () => {
|
||||
if (!magnetInput.trim()) return
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/torrents', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ magnetURI: magnetInput.trim() })
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
const data = await response.json()
|
||||
throw new Error(data.error || 'Failed to add torrent')
|
||||
}
|
||||
|
||||
setMagnetInput('')
|
||||
setIsAdding(false)
|
||||
fetchTorrents()
|
||||
} catch (err: any) {
|
||||
setError(err.message)
|
||||
}
|
||||
}
|
||||
|
||||
const startDownload = async (hash: string) => {
|
||||
await fetch(`/api/torrents/${hash}/start`, { method: 'POST' })
|
||||
fetchTorrents()
|
||||
}
|
||||
|
||||
const removeTorrent = async (hash: string) => {
|
||||
await fetch(`/api/torrents/${hash}`, { method: 'DELETE' })
|
||||
fetchTorrents()
|
||||
}
|
||||
|
||||
const getStatusColor = (status: string) => {
|
||||
switch (status) {
|
||||
case 'completed': return 'text-emerald-400 bg-emerald-500/10 border-emerald-500/20';
|
||||
case 'downloading': return 'text-blue-400 bg-blue-500/10 border-blue-500/20';
|
||||
case 'error': return 'text-rose-400 bg-rose-500/10 border-rose-500/20';
|
||||
case 'paused': return 'text-amber-400 bg-amber-500/10 border-amber-500/20';
|
||||
default: return 'text-slate-400 bg-slate-500/10 border-slate-500/20';
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="w-full max-w-7xl px-6 py-12 selection:bg-blue-500/30">
|
||||
{/* Header */}
|
||||
<header className="flex items-center justify-between mb-16">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="relative group">
|
||||
<div className="absolute inset-0 bg-blue-600 blur-xl opacity-20 group-hover:opacity-40 transition-opacity duration-500" />
|
||||
<div className="relative w-12 h-12 bg-gradient-to-br from-blue-600 to-indigo-600 rounded-2xl flex items-center justify-center shadow-2xl shadow-blue-500/20 border border-white/10 group-hover:scale-105 transition-transform duration-300">
|
||||
<Zap className="text-white fill-white" size={24} />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-3xl font-black tracking-tight text-white mb-1">
|
||||
GRAVITY <span className="text-transparent bg-clip-text bg-gradient-to-r from-blue-400 to-indigo-400">TORRENT</span>
|
||||
</h1>
|
||||
<div className="flex items-center gap-2 text-[11px] font-bold text-slate-500 tracking-widest uppercase">
|
||||
<span className="w-1.5 h-1.5 rounded-full bg-emerald-500 shadow-[0_0_8px_rgba(16,185,129,0.5)] animate-pulse" />
|
||||
System Operational
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<motion.button
|
||||
whileHover={{ scale: 1.02 }}
|
||||
whileTap={{ scale: 0.98 }}
|
||||
onClick={() => setIsAdding(true)}
|
||||
className="flex items-center gap-2 px-6 py-3 bg-white text-slate-950 rounded-xl font-bold hover:bg-blue-50 transition-colors shadow-[0_0_20px_rgba(255,255,255,0.1)] hover:shadow-[0_0_25px_rgba(255,255,255,0.2)]"
|
||||
>
|
||||
<Plus size={18} strokeWidth={3} />
|
||||
<span>Add Torrent</span>
|
||||
</motion.button>
|
||||
</header>
|
||||
|
||||
{/* Stats Dashboard */}
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 mb-12">
|
||||
{[
|
||||
{ label: 'Network Activity', value: torrents.length + ' Sessions', icon: Activity, color: 'text-blue-400', bg: 'bg-blue-400/10' },
|
||||
{ label: 'Swarm Peers', value: torrents.reduce((a, b) => a + b.peers, 0) + ' Connected', icon: Network, color: 'text-emerald-400', bg: 'bg-emerald-400/10' },
|
||||
{ label: 'Global Progress', value: torrents.length ? (torrents.reduce((a, b) => a + b.progress, 0) / torrents.length).toFixed(0) + '%' : '0%', icon: Layers, color: 'text-indigo-400', bg: 'bg-indigo-400/10' },
|
||||
{ label: 'Protocols', value: 'UDP / TCP', icon: Box, color: 'text-amber-400', bg: 'bg-amber-400/10' },
|
||||
].map((stat, i) => (
|
||||
<motion.div
|
||||
key={i}
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ delay: i * 0.1 }}
|
||||
className="bg-slate-900/50 backdrop-blur-xl border border-white/5 p-5 rounded-3xl hover:border-white/10 transition-colors"
|
||||
>
|
||||
<div className="flex items-start justify-between mb-4">
|
||||
<div className={`p-2.5 rounded-xl ${stat.bg}`}>
|
||||
<stat.icon size={18} className={stat.color} />
|
||||
</div>
|
||||
<span className="text-[10px] uppercase font-bold text-slate-500 tracking-wider">0{i + 1}</span>
|
||||
</div>
|
||||
<p className="text-2xl font-bold text-white mb-1">{stat.value}</p>
|
||||
<p className="text-[11px] font-medium text-slate-500 uppercase tracking-wide">{stat.label}</p>
|
||||
</motion.div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Torrents List */}
|
||||
<div className="space-y-6">
|
||||
<AnimatePresence mode="popLayout">
|
||||
{torrents.length === 0 ? (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.9 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
className="flex flex-col items-center justify-center py-40 border border-dashed border-slate-800/50 rounded-[2.5rem] bg-slate-900/20"
|
||||
>
|
||||
<div className="w-20 h-20 bg-slate-800/50 rounded-full flex items-center justify-center mb-6">
|
||||
<DownloadCloud size={32} className="text-slate-600" />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-slate-300 mb-2">No Active Swarms</h3>
|
||||
<p className="text-slate-500 text-sm max-w-sm text-center leading-relaxed">
|
||||
Initialize a new torrent session to begin the discovery and download process.
|
||||
</p>
|
||||
</motion.div>
|
||||
) : (
|
||||
torrents.map((torrent) => (
|
||||
<motion.div
|
||||
key={torrent.hash}
|
||||
layout
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
exit={{ opacity: 0, scale: 0.95 }}
|
||||
className="group bg-slate-900/40 backdrop-blur-md border border-white/5 rounded-[2rem] p-8 hover:border-blue-500/30 transition-all duration-500 shadow-xl shadow-black/20"
|
||||
>
|
||||
<div className="flex flex-col lg:flex-row gap-8 items-start lg:items-center">
|
||||
{/* Main Info */}
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-3 mb-3">
|
||||
<h3 className="text-xl font-bold text-white truncate pr-4">{torrent.name}</h3>
|
||||
<span className={`px-3 py-1 rounded-full text-[10px] font-black uppercase tracking-wider border ${getStatusColor(torrent.status)}`}>
|
||||
{torrent.status}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-wrap gap-6 text-xs text-slate-400 font-medium">
|
||||
<div className="flex items-center gap-2 px-3 py-1.5 bg-slate-950/50 rounded-lg border border-white/5">
|
||||
<Globe size={14} className="text-emerald-500" />
|
||||
<span>{torrent.peers} peers linked</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 px-3 py-1.5 bg-slate-950/50 rounded-lg border border-white/5">
|
||||
<Network size={14} className="text-blue-500" />
|
||||
<span>{torrent.activeConnections} active pipes</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 px-3 py-1.5 bg-slate-950/50 rounded-lg border border-white/5 font-mono text-slate-500">
|
||||
<span>HASH: {torrent.hash.slice(0, 12)}...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Progress Section */}
|
||||
<div className="w-full lg:w-80">
|
||||
<div className="flex justify-between text-[11px] font-bold text-slate-500 mb-2 uppercase tracking-wider">
|
||||
<span>Completion</span>
|
||||
<span className={torrent.status === 'completed' ? 'text-emerald-400' : 'text-blue-400'}>
|
||||
{torrent.status === 'completed' ? 100 : torrent.progress}%
|
||||
</span>
|
||||
</div>
|
||||
<div className="relative h-2.5 bg-slate-950 rounded-full overflow-hidden shadow-inner border border-white/5">
|
||||
<motion.div
|
||||
className={`absolute inset-y-0 left-0 ${torrent.status === 'completed' ? 'bg-gradient-to-r from-emerald-500 to-teal-400' : 'bg-gradient-to-r from-blue-600 to-indigo-500'}`}
|
||||
initial={{ width: 0 }}
|
||||
animate={{ width: `${torrent.status === 'completed' ? 100 : torrent.progress}%` }}
|
||||
transition={{ type: 'spring', damping: 20 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Action Buttons */}
|
||||
<div className="flex gap-3">
|
||||
{torrent.status === 'ready' && (
|
||||
<motion.button
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
onClick={() => startDownload(torrent.hash)}
|
||||
className="w-12 h-12 rounded-2xl bg-blue-600 flex items-center justify-center text-white shadow-lg shadow-blue-600/20 hover:bg-blue-500 transition-colors"
|
||||
>
|
||||
<Play size={20} fill="currentColor" />
|
||||
</motion.button>
|
||||
)}
|
||||
<motion.button
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
onClick={() => removeTorrent(torrent.hash)}
|
||||
className="w-12 h-12 rounded-2xl bg-slate-800 flex items-center justify-center text-slate-400 hover:text-rose-400 hover:bg-slate-700 transition-colors"
|
||||
>
|
||||
<Trash2 size={20} />
|
||||
</motion.button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* File List */}
|
||||
<AnimatePresence>
|
||||
{torrent.files.length > 0 && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, height: 0 }}
|
||||
animate={{ opacity: 1, height: 'auto' }}
|
||||
className="mt-8 pt-8 border-t border-white/5 overflow-hidden"
|
||||
>
|
||||
<h4 className="text-[10px] font-bold text-slate-500 uppercase tracking-widest mb-4">Payload Contents</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-3">
|
||||
{torrent.files.map((file, i) => (
|
||||
<div key={i} className="group/file flex items-center gap-4 bg-slate-950/30 hover:bg-slate-950/50 p-4 rounded-xl border border-white/5 hover:border-blue-500/20 transition-all duration-300">
|
||||
<div className="p-2 bg-slate-800/50 rounded-lg text-slate-400 group-hover/file:text-blue-400 transition-colors">
|
||||
<FileText size={16} />
|
||||
</div>
|
||||
<div className="min-w-0 flex-1">
|
||||
<p className="text-sm font-semibold text-slate-300 truncate group-hover/file:text-white transition-colors">{file.name}</p>
|
||||
<p className="text-[10px] font-medium text-slate-600">{(file.size / (1024 * 1024)).toFixed(2)} MB</p>
|
||||
</div>
|
||||
{torrent.status === 'completed' && (
|
||||
<a
|
||||
href={`/api/torrents/${torrent.hash}/download/${encodeURIComponent(file.name)}`}
|
||||
target="_blank"
|
||||
title="Download"
|
||||
className="p-2 rounded-lg bg-blue-500/10 text-blue-400 hover:bg-blue-600 hover:text-white opacity-0 group-hover/file:opacity-100 transition-all transform scale-90 group-hover/file:scale-100"
|
||||
>
|
||||
<DownloadCloud size={16} />
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</motion.div>
|
||||
))
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
|
||||
{/* Modal */}
|
||||
<AnimatePresence>
|
||||
{isAdding && (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center p-6 bg-black/60 backdrop-blur-sm">
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
onClick={() => setIsAdding(false)}
|
||||
className="absolute inset-0"
|
||||
/>
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.9, y: 20 }}
|
||||
animate={{ opacity: 1, scale: 1, y: 0 }}
|
||||
exit={{ opacity: 0, scale: 0.9, y: 20 }}
|
||||
className="relative w-full max-w-2xl bg-[#0a0f1c] border border-white/10 rounded-[2rem] p-10 shadow-2xl shadow-black/50"
|
||||
>
|
||||
<h2 className="text-3xl font-black text-white mb-8 tracking-tight">Init Swarm Connection.</h2>
|
||||
|
||||
<div className="space-y-8">
|
||||
<div>
|
||||
<label className="text-xs font-bold text-slate-500 uppercase tracking-widest block mb-3">Target Magnet URI</label>
|
||||
<div className="relative group">
|
||||
<input
|
||||
autoFocus
|
||||
type="text"
|
||||
value={magnetInput}
|
||||
onChange={(e) => setMagnetInput(e.target.value)}
|
||||
placeholder="magnet:?xt=urn:btih:..."
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-2xl px-6 py-5 pr-14 text-slate-200 placeholder:text-slate-700 focus:outline-none focus:border-blue-500/50 focus:ring-4 focus:ring-blue-500/10 transition-all font-mono text-sm"
|
||||
/>
|
||||
<div className="absolute right-5 top-1/2 -translate-y-1/2 text-slate-700 group-focus-within:text-blue-500 transition-colors">
|
||||
<Magnet size={24} />
|
||||
</div>
|
||||
</div>
|
||||
{error && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: -5 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
className="mt-3 flex items-center gap-2 text-rose-400 text-xs font-bold bg-rose-950/30 px-3 py-2 rounded-lg inline-block border border-rose-500/20"
|
||||
>
|
||||
<Info size={12} /> {error}
|
||||
</motion.div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4 pt-2">
|
||||
<button
|
||||
onClick={() => setIsAdding(false)}
|
||||
className="flex-1 py-4 rounded-xl font-bold bg-slate-900 border border-white/5 text-slate-400 hover:bg-slate-800 hover:text-white transition-colors"
|
||||
>
|
||||
Cancel Protocol
|
||||
</button>
|
||||
<button
|
||||
onClick={handleAddTorrent}
|
||||
className="flex-[2] py-4 rounded-xl font-bold bg-gradient-to-r from-blue-600 to-indigo-600 text-white hover:shadow-lg hover:shadow-blue-600/20 hover:scale-[1.02] transition-all flex items-center justify-center gap-3"
|
||||
>
|
||||
<span>Establish Uplink</span>
|
||||
<ArrowRight size={20} strokeWidth={2.5} />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
53
packages/client/src/index.css
Normal file
53
packages/client/src/index.css
Normal file
@@ -0,0 +1,53 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
:root {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
line-height: 1.5;
|
||||
font-weight: 400;
|
||||
|
||||
color-scheme: dark;
|
||||
color: rgba(255, 255, 255, 0.92);
|
||||
background-color: #030712;
|
||||
/* Slate 950 base */
|
||||
|
||||
font-synthesis: none;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
place-items: start;
|
||||
justify-content: center;
|
||||
min-width: 320px;
|
||||
min-height: 100vh;
|
||||
background-image:
|
||||
radial-gradient(circle at 50% 0%, rgba(59, 130, 246, 0.15) 0%, transparent 50%),
|
||||
radial-gradient(circle at 80% 10%, rgba(16, 185, 129, 0.1) 0%, transparent 40%);
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
/* Custom Scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #1e293b;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #334155;
|
||||
}
|
||||
10
packages/client/src/main.tsx
Normal file
10
packages/client/src/main.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App'
|
||||
import './index.css'
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
)
|
||||
11
packages/client/tailwind.config.js
Normal file
11
packages/client/tailwind.config.js
Normal file
@@ -0,0 +1,11 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./index.html",
|
||||
"./src/**/*.{js,ts,jsx,tsx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
31
packages/client/tsconfig.json
Normal file
31
packages/client/tsconfig.json
Normal file
@@ -0,0 +1,31 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": [
|
||||
"DOM",
|
||||
"DOM.Iterable",
|
||||
"ESNext"
|
||||
],
|
||||
"allowJs": false,
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": false,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx"
|
||||
},
|
||||
"include": [
|
||||
"src"
|
||||
],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
12
packages/client/tsconfig.node.json
Normal file
12
packages/client/tsconfig.node.json
Normal file
@@ -0,0 +1,12 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": [
|
||||
"vite.config.ts"
|
||||
]
|
||||
}
|
||||
7
packages/client/vite.config.ts
Normal file
7
packages/client/vite.config.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
})
|
||||
Reference in New Issue
Block a user