# Project export: Shard This document was generated by HackStack to give an AI agent context about a hackathon project. Sections are labeled with their provenance; content marked as truncated was cut to keep this document small. ## Project metadata - Hackathon: Cal Hacks 12.0 - Tagline: Do you have a laptop? You're potentially losing on making at least $10/day side income with Shard. Introducing Shard to make use of unutilized resources from 1.5 billion devices globally. - Devpost: https://devpost.com/software/shard-2kvsch - GitHub: https://github.com/atharvalade/Shard - Demo: http://shard-alpha.vercel.app/ - Video: https://www.youtube.com/embed/umudwop1TdY?enablejsapi=1&hl=en_US&rel=0&start=&version=3&wmode=transparent - Result: winner (Sui: Best Use of Sui) - Team: 1 GitHub contributor(s) — Atharva Lade (13 commits) ## Devpost submission (written by the team) ### Overview The inspiration for Shard came from observing two key problems in the modern computing landscape: Wasted Computing Power: Millions of high-performance Macs sit idle for hours each day, their powerful Apple Silicon chips underutilized while consuming electricity. Wasted Computing Power: Millions of high-performance Macs sit idle for hours each day, their powerful Apple Silicon chips underutilized while consuming electricity. Centralized AI Infrastructure: Running AI inference and compute-intensive tasks typically requires expensive cloud infrastructure or centralized services, creating bottlenecks and single points of failure. Centralized AI Infrastructure: Running AI inference and compute-intensive tasks typically requires expensive cloud infrastructure or centralized services, creating bottlenecks and single points of failure. I asked myself: What if I could create a decentralized marketplace where anyone could contribute their idle computing power and earn cryptocurrency, while others could access distributed compute resources at a fraction of traditional cloud costs? The name "Shard" reflects the core innovation—breaking large computational jobs into tiny micro-task fragments that can be processed independently across a distributed network, similar to how blockchain shards distribute data and computation. Shard is a decentralized compute network built on the Sui blockchain that transforms idle Mac computers into a distributed supercomputer. Here's how it works: For Job Submitters (via Web Interface) Submit Computational Tasks: Upload a CSV file with 100 sentences for AI content moderation or provide parameters for Monte Carlo simulations Automatic Fragmentation: The system breaks your job into tiny independent fragments (1 sentence per fragment) Privacy-First Encryption: Each fragment is encrypted using Sui Seal threshold encryption Decentralized Storage: Encrypted data is stored on Sui Walrus (decentralized blob storage) On-Chain Job Posting: The job and all fragments are published to the Sui blockchain with USDC bounties (0.01 USDC per fragment) Real-Time Progress: Watch as workers around the world claim and process your fragments Automatic Result Aggregation: Get your completed results delivered in the original order For Computing Providers (via macOS App) Beautiful System Monitor: Track CPU, GPU, and memory usage in a Robinhood-like interface One-Click Worker: Click "Start Worker" to begin earning USDC AI-Powered Chat: Built-in Gemma 3-4B chatbot for local AI assistance Auto-Discovery: The app polls the blockchain for available work Secure Processing: Downloads encrypted fragments, decrypts locally using Seal Local AI Inference: Runs Gemma AI model to classify content (safe/unsafe) Upload Results: Encrypts and uploads results to Walrus, submits completion on-chain Instant Payment: Receives 0.01 USDC per completed fragment (sponsored transaction—zero gas fees) Multi-Worker Support: Spawn multiple worker windows to process tasks in parallel Key Features Zero Gas Fees for Workers: All transactions are sponsored by job creators Privacy-Preserving: Workers never see raw sensitive data—only encrypted fragments Fault-Tolerant: Uncompleted fragments are automatically re-queued Native Performance: Leverages Apple Silicon's Metal acceleration for AI inference Real-Time Transparency: Both submitters and workers see live progress updates I built Shard solo over 15 hours during the hackathon, integrating cutting-edge blockchain technologies with native macOS development. Tech Stack Frontend (Next.js 14 + React + TypeScript) UI Framework: shadcn/ui components with Tailwind CSS for a minimalist, dark-mode-first design Animations: Framer Motion for smooth transitions and progress indicators Real-Time Updates: Polling-based live fragment status tracking Features: Job submission portal, AI inference configuration, Monte Carlo simulation setup Backend (Node.js + Express + TypeScript) API Server: RESTful endpoints for job management, fragment lifecycle, and wallet queries Sui Integration: @mysten/sui SDK for blockchain interactions and USDC transfers Walrus Client: Custom implementation for uploading/downloading encrypted blobs Seal Encryption: @mysten/seal SDK for threshold encryption with session keys Job Orchestration: Automatic fragmentation, encryption, and on-chain publishing macOS App (SwiftUI + Combine) System Monitoring: Real-time CPU/GPU/Memory tracking using IOKit and Mach APIs AI Integration: Embedded llama.cpp server running Gemma 3-4B-it-q4_0.gguf model Metal Acceleration: Native Apple Silicon GPU support for AI inference Worker Engine: Multi-threaded fragment discovery, claiming, processing, and completion Multi-Window Architecture: Spawn independent worker windows for parallel processing Live Dashboard: Beautiful glassmorphic UI with animated charts (inspired by Apple's design language) Blockchain (Sui + Move) Sui Network: Testnet deployment for job and fragment state management Smart Contracts: Move modules for access control policies (Seal) Walrus Storage: Decentralized blob storage with erasure coding Seal Encryption: Threshold encryption with programmable access control Sponsored Transactions: Job creators pay all gas fees for workers Development Highlights 1. Micro-Task Fragment Protocol I designed a novel fragmentation system where each sentence becomes an independent TaskFragment with: Unique fragment ID and job ID Encrypted data blob stored on Walrus USDC bounty (0.01 per fragment) Status lifecycle: pending → claimed → completed 2. Sui Seal Integration I implemented end-to-end encryption using Seal's threshold encryption: Generated session keys with TTL for time-limited access Created Move access policy contracts (seal_approve) Encrypted fragments using AES256GCM Workers decrypt using session keys without exposing raw data 3. llama.cpp Embedding I bundled the Gemma AI model and llama-server binary directly into the macOS app: Built static llama-server to avoid dynamic library issues Spawned server as subprocess with Metal GPU acceleration Implemented streaming HTTP client for real-time inference Created beautiful chat UI with gradient avatars and suggestion chips 4. Multi-Worker Architecture I built a sophisticated worker management system: @Environment(\.openWindow) for spawning new worker windows Shared WorkerService instances with independent worker IDs Competitive claiming (first worker to claim gets the fragment) Real-time USDC balance tracking across all workers 5. Production Deployment Frontend: Deployed to Vercel (https://shard-alpha.vercel.app) Backend: Deployed to Vercel with Cloudflare Tunnel for local testing CORS: Dynamic subdomain support for *.trycloudflare.com Config Management: Centralized API URLs for easy environment switching Blockchain & Cryptography Sui Blockchain: I dove deep into the Sui ecosystem, learning about Move smart contracts, sponsored transactions, and how to structure on-chain state for a compute marketplace. Sui Walrus: I implemented decentralized storage for both job inputs and results, learning how erasure coding provides redundancy without centralized servers. Sui Seal: I mastered threshold encryption and programmable access control, enabling workers to decrypt job data without ever exposing it to centralized parties. BCS Encoding: I learned about Sui's Binary Canonical Serialization for efficient data encoding. Native macOS Development I built a production-grade SwiftUI application with real-time system monitoring (CPU, GPU, Memory). I integrated llama.cpp and Gemma 3-4B for local AI inference using Apple Silicon's Metal acceleration. I learned advanced Swift concepts: Combine framework, @Published properties, URLSession streaming, and multi-window architecture. I mastered IOKit for low-level hardware metrics and Mach APIs for system-level monitoring. Distributed Systems Design I implemented a micro-task fragment protocol where jobs are broken into independent units that can be processed in parallel. I designed fault-tolerant execution with fragment re-queuing if workers go offline. I built a polling-based worker discovery system that scales to multiple simultaneous workers. I learned about eventual consistency and how to handle race conditions in distributed claiming. Full-Stack Integration I connected React/Next.js frontend → Express.js backend → Sui blockchain → macOS worker app in a seamless end-to-end flow. I implemented real-time progress tracking with polling-based live fragment status updates. I managed CORS, API design, environment configuration, and production deployment. I debugged complex multi-component issues (e.g., USDC transfers, fragment completion, UI state synchronization). Performance Optimization I optimized SwiftUI rendering by removing continuous animations and using .drawingGroup() for Metal acceleration. I reduced CPU usage from 50% to <5% by simplifying chart rendering and using efficient update intervals. I implemented smart batching for blockchain queries to minimize network overhead. Short-Term (Next 3 Months) Mainnet Launch: Deploy to Sui mainnet with real USDC incentives More Task Types: Support image processing, video transcoding, and scientific simulations Advanced Reputation System: Track worker reliability and completion rates with on-chain NFTs Mobile Support: Build iOS/Android worker apps to expand the provider network Job Verification: Implement cryptographic proofs of correct computation Long-Term Vision Cross-Chain Support: Integrate with Ethereum, Solana, and other L1s for broader adoption Specialized Hardware: Support GPU-intensive tasks (3D rendering, AI training) with CUDA/ROCm Enterprise Partnerships: Offer B2B solutions for companies needing distributed compute DAO Governance: Community-driven protocol upgrades and fee structures Carbon Credits: Reward providers for using renewable energy sources Technical Improvements WebSocket Real-Time Updates: Replace polling with push notifications for instant updates Smart Contract Upgrades: On-chain fragment verification and slashing for malicious workers Result Validation: Implement consensus mechanisms (multiple workers verify the same fragment) Benchmarking System: Automatically test worker capabilities and assign appropriate tasks Dynamic Pricing: Market-driven bounty pricing based on task complexity and demand Shard demonstrates that it's possible to build a fully functional decentralized compute network in a single weekend. By leveraging Sui's innovative blockchain architecture, Walrus's decentralized storage, and Seal's privacy-preserving encryption, I created a platform that turns idle Macs into a global supercomputer—while ensuring privacy, fault tolerance, and instant micropayments. This is just the beginning. The future of computing is decentralized, and Shard is proof that we can build it today. ## README (from the GitHub repository) No README available. ## Detected evidence (automated analysis) Indexed codebase: 43 recognized source files, 251 KB. - CSS (language) — detected in the code - Express (technology) — detected in the code - JavaScript (language) — detected in the code - Next.js (technology) — detected in the code - React (technology) — detected in the code - Swift (language) — detected in the code - Tailwind CSS (technology) — detected in the code - TypeScript (language) — detected in the code ## Codebase structure (from repository index) ### Files (64 of 64) ``` .gitignore DEVPOST_SUBMISSION.md Shard-Backend/.gitignore Shard-Backend/move/Move.lock Shard-Backend/move/Move.toml Shard-Backend/move/sources/public_access.move Shard-Backend/move/sources/shard_jobs.move Shard-Backend/package.json Shard-Backend/README.md Shard-Backend/src/blockchain/sui-client.ts Shard-Backend/src/encryption/seal.ts Shard-Backend/src/fragmentation/fragmenter.ts Shard-Backend/src/server.ts Shard-Backend/src/storage/walrus.ts Shard-Backend/src/test-seal.ts Shard-Backend/src/test-walrus.ts Shard-Backend/src/transfer-usdc.ts Shard-Backend/src/types/index.ts Shard-Backend/src/types/job.ts Shard-Backend/tsconfig.json Shard-Frontend/.gitignore Shard-Frontend/app/globals.css Shard-Frontend/app/jobs/page.tsx Shard-Frontend/app/layout.tsx Shard-Frontend/app/page.tsx Shard-Frontend/app/submit/page.tsx Shard-Frontend/components/ui/button.tsx Shard-Frontend/components/ui/input.tsx Shard-Frontend/components/ui/label.tsx Shard-Frontend/components/ui/tabs.tsx Shard-Frontend/components/ui/textarea.tsx Shard-Frontend/lib/config.ts Shard-Frontend/lib/utils.ts Shard-Frontend/next.config.js Shard-Frontend/package.json Shard-Frontend/postcss.config.js Shard-Frontend/tailwind.config.ts Shard-Frontend/tsconfig.json Shard/.gitignore Shard/Shard.xcodeproj/project.pbxproj Shard/Shard.xcodeproj/project.xcworkspace/contents.xcworkspacedata Shard/Shard.xcodeproj/project.xcworkspace/xcuserdata/atharvalade.xcuserdatad/UserInterfaceState.xcuserstate Shard/Shard.xcodeproj/xcuserdata/atharvalade.xcuserdatad/xcschemes/xcschememanagement.plist Shard/Shard/.gitignore Shard/Shard/Assets.xcassets/AccentColor.colorset/Contents.json Shard/Shard/Assets.xcassets/AppIcon.appiconset/Contents.json Shard/Shard/Assets.xcassets/Contents.json Shard/Shard/ContentView.swift Shard/Shard/Models/SystemMonitor.swift Shard/Shard/Services/ChatService.swift Shard/Shard/Services/LlamaServerManager.swift Shard/Shard/Services/WorkerService.swift Shard/Shard/ShardApp.swift Shard/Shard/Views/AnimatedNumberView.swift Shard/Shard/Views/ChatView.swift Shard/Shard/Views/CircularProgressView.swift Shard/Shard/Views/CompactMetricWidget.swift Shard/Shard/Views/EnhancedLineChartView.swift Shard/Shard/Views/GlassCard.swift Shard/Shard/Views/JobsView.swift Shard/Shard/Views/MiniSparklineView.swift Shard/Shard/Views/PremiumMetricCard.swift Shard/Shard/Views/WorkerWindow.swift test-sentences.csv ``` ### Dependencies - Shard-Backend/package.json: @mysten/bcs@^1.9.1, @mysten/seal@^0.9.1, @mysten/sui@^1.43.1, @types/cors@^2.8.17, @types/express@^4.17.21, @types/multer@^2.0.0, @types/node@^20.10.4, @types/uuid@^9.0.7, axios@^1.6.2, cors@^2.8.5, dotenv@^16.3.1, express@^4.18.2, form-data@^4.0.0, multer@^2.0.2, tsx@^4.7.0, typescript@^5.3.3, uuid@^9.0.1 - Shard-Frontend/package.json: @types/node@^20.11.0, @types/react@^18.3.0, @types/react-dom@^18.3.0, autoprefixer@^10.4.17, class-variance-authority@^0.7.0, clsx@^2.1.0, eslint@^8.56.0, eslint-config-next@^14.2.0, framer-motion@^11.0.0, lucide-react@^0.344.0, next@^14.2.0, postcss@^8.4.35, react@^18.3.0, react-dom@^18.3.0, tailwind-merge@^2.2.0, tailwindcss@^3.4.1, tailwindcss-animate@^1.0.7, typescript@^5.3.3 ### Recent commits (newest first) - chore: URL - chore: backend URL - chore: refactor code to include single change backend URL and CORS update - chore: vercel config - feat: add ability to add multiple workers - Shard backend for USDC transfer, MacOS app - jobs section added, listen to blockchain events - fix: remove extra parentheses - major feat: added local Gemma 3 model inference using GPU in Native MacOS app - feat: add frontend landing page for Shard - feat: Complete backend infrastructure with Walrus, Seal, and Move integration - chore: folder structure - fix: resource intensive UI updates - feat: baseline native MacOS App to monitor current resource activity - add MacOS Swift App ## Key source files (fetched from GitHub, selected and truncated for size) ### DEVPOST_SUBMISSION.md ```markdown # 🌟 Inspiration The inspiration for **Shard** came from observing two key problems in the modern computing landscape: 1. **Wasted Computing Power**: Millions of high-performance Macs sit idle for hours each day, their powerful Apple Silicon chips underutilized while consuming electricity. 2. **Centralized AI Infrastructure**: Running AI inference and compute-intensive tasks typically requires expensive cloud infrastructure or centralized services, creating bottlenecks and single points of failure. I asked myself: *What if I could create a decentralized marketplace where anyone could contribute their idle computing power and earn cryptocurrency, while others could access distributed compute resources at a fraction of traditional cloud costs?* The name "Shard" reflects the core innovation—breaking large computational jobs into tiny **micro-task fragments** that can be processed independently across a distributed network, similar to how blockchain shards distribute data and computation. --- # 🛠️ What It Does **Shard** is a decentralized compute network built on the Sui blockchain that transforms idle Mac computers into a distributed supercomputer. Here's how it works: ## For Job Submitters (via Web Interface) 1. **Submit Computational Tasks**: Upload a CSV file with 100 sentences for AI content moderation or provide parameters for Monte Carlo simulations 2. **Automatic Fragmentation**: The system breaks your job into tiny independent fragments (1 sentence per fragment) 3. **Privacy-First Encryption**: Each fragment is encrypted using **Sui Seal** threshold encryption 4. **Decentralized Storage**: Encrypted data is stored on **Sui Walrus** (decentralized blob storage) 5. **On-Chain Job Posting**: The job and all fragments are published to the Sui blockchain with USDC bounties (0.01 USDC per fragment) 6. **Real-Time Progress**: Watch as workers around the world claim and process your fragments 7. **Automatic Result Aggregation**: Get your completed results delivered in the original order ## For Computing Providers (via macOS App) 1. **Beautiful System Monitor**: Track CPU, GPU, and memory usage in a Robinhood-like interface 2. **One-Click Worker**: Click "Start Worker" to begin earning USDC 3. **AI-Powered Chat**: Built-in Gemma 3-4B chatbot for local AI assistance 4. **Auto-Discovery**: The app polls the blockchain for available work 5. **Secure Processing**: Downloads encrypted fragments, decrypts locally using Seal 6. **Local AI Inference**: Runs Gemma AI model to classify content (safe/unsafe) 7. **Upload Results**: Encrypts and uploads results to Walrus, submits completion on-chain 8. **Instant Payment**: Receives 0.01 USDC per completed fragment (sponsored transaction—zero gas fees) 9. **Multi-Worker Support**: Spawn multiple worker windows to process tasks in parallel ## Key Features - **Zero Gas Fees for Workers**: All transactions are sponsored by job creators - **Privacy-Preserving**: Workers never see raw sensitive data—only en [truncated — 8335 more characters] ``` ### Shard-Frontend/package.json ``` { "name": "shard-frontend", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "framer-motion": "^11.0.0", "lucide-react": "^0.344.0", "next": "^14.2.0", "react": "^18.3.0", "react-dom": "^18.3.0", "tailwind-merge": "^2.2.0", "tailwindcss-animate": "^1.0.7" }, "devDependencies": { "@types/node": "^20.11.0", "@types/react": "^18.3.0", "@types/react-dom": "^18.3.0", "autoprefixer": "^10.4.17", "eslint": "^8.56.0", "eslint-config-next": "^14.2.0", "postcss": "^8.4.35", "tailwindcss": "^3.4.1", "typescript": "^5.3.3" } } ``` ### Shard-Backend/package.json ``` { "name": "shard-backend", "version": "1.0.0", "description": "Shard Decentralized Compute Backend", "main": "dist/server.js", "scripts": { "dev": "tsx watch src/server.ts", "build": "tsc", "start": "node dist/server.js", "test:walrus": "tsx src/test-walrus.ts", "test:seal": "tsx src/test-seal.ts" }, "dependencies": { "@mysten/bcs": "^1.9.1", "@mysten/seal": "^0.9.1", "@mysten/sui": "^1.43.1", "@types/multer": "^2.0.0", "axios": "^1.6.2", "cors": "^2.8.5", "dotenv": "^16.3.1", "express": "^4.18.2", "form-data": "^4.0.0", "multer": "^2.0.2", "uuid": "^9.0.1" }, "devDependencies": { "@types/cors": "^2.8.17", "@types/express": "^4.17.21", "@types/node": "^20.10.4", "@types/uuid": "^9.0.7", "tsx": "^4.7.0", "typescript": "^5.3.3" } } ``` ### Shard-Frontend/app/layout.tsx ```typescript import type { Metadata } from "next"; import { Inter } from "next/font/google"; import "./globals.css"; const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { title: "Shard - Decentralized Compute on Sui", description: "Harness the power of idle Macs for AI inference and simulations. Earn passive USDC while you sleep.", }; export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode; }>) { return ( {children} ); } ``` ### Shard-Backend/src/server.ts ```typescript import express from 'express'; import cors from 'cors'; import dotenv from 'dotenv'; import { Fragmenter } from './fragmentation/fragmenter'; import { WalrusClient } from './storage/walrus'; import { ShardSuiClient } from './blockchain/sui-client'; import { Job, TaskFragment } from './types'; // Load environment variables dotenv.config(); const app = express(); const PORT = process.env.PORT || 3000; // Middleware - CORS configuration for production app.use(cors({ origin: (origin, callback) => { // Allow requests with no origin (mobile apps, Postman, etc.) if (!origin) return callback(null, true); // Allow all trycloudflare.com subdomains if (origin.endsWith('.trycloudflare.com')) { return callback(null, true); } // Allow specific domains const allowedOrigins = [ 'https://shard-alpha.vercel.app', 'http://localhost:3000', 'http://localhost:3001' ]; if (allowedOrigins.includes(origin)) { return callback(null, true); } callback(new Error('Not allowed by CORS')); }, credentials: true, methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'], allowedHeaders: ['Content-Type', 'Authorization'] })); app.use(express.json({ limit: '50mb' })); // Initialize clients const walrusClient = new WalrusClient( process.env.WALRUS_PUBLISHER_URL || 'https://publisher.walrus-testnet.walrus.space', process.env.WALRUS_AGGREGATOR_URL || 'https://aggregator.walrus-testnet.walrus.space' ); const suiClient = new ShardSuiClient(); // In-memory storage (for hackathon - replace with DB later) const jobs = new Map(); const availableFragments: TaskFragment[] = []; const claimedFragments = new Map(); const completedFragments = new Map(); // ============= API ROUTES ============= /** * Health check */ app.get('/health', (req, res) => { res.json({ status: 'ok', timestamp: Date.now() }); }); /** * Get wallet balances */ app.get('/api/wallets', async (req, res) => { try { const [suiA, suiB, suiC, usdcA, usdcB, usdcC] = await Promise.all([ suiClient.getSUIBalance('A'), suiClient.getSUIBalance('B'), suiClient.getSUIBalance('C'), suiClient.getUSDCBalance('A'), suiClient.getUSDCBalance('B'), suiClient.getUSDCBalance('C'), ]); res.json({ walletA: { address: suiClient.getAddress('A'), sui: suiA, usdc: usdcA }, walletB: { address: suiClient.getAddress('B'), sui: suiB, usdc: usdcB }, walletC: { address: suiClient.getAddress('C'), sui: suiC, usdc: usdcC }, }); } catch (error: any) { res.status(500).json({ error: error.message }); } }); /** * Submit a job * POST /api/jobs * Body: { data: any[], jobType: string, bountyPerFragment: number } */ app.post('/api/jobs', async (req, res) => { try { const { data, jobType, bountyPerFragment } = req.body; if (!data || !Array.isArray(data)) { return res.status(400).json({ error: 'data must be an array' }); } if (!jobType || !['gemma-text-classification', 'monte-carlo-simulation'].includes(jobType)) { return res.status(400).json({ error: 'Invalid jobType' }); } if (!bountyPerFragment || bountyPerFragment <= 0) { return res.status(400).json({ error: 'bountyPerFragment must be > 0' }); } console.log(`Creating job: ${jobType}, ${data.length} items`); // Create fragments const creator = suiClient.getAddress('B'); // Wallet B is job creator const job = Fragmenter.fragmentJSON(data, jobType as any, bountyPerFragment, creator); // Upload each fragment to Walrus console.log('Uploading fragments to Walrus...'); for (const fragment of job.fragments) { try { const uploadResult = await walrusClient.upload({ fragmentId: fragment.fragmentId, data: fragment.data, bounty: fragment.bountyAmount, }); fragment.walrusUrl = uploadResult.url; fragment.blobId = uploadResult.blobId; // Generate a placeholder encryption ID (in production, this would be from Seal) fragment.encryptionId = `0x${fragment.fragmentId.replace(/-/g, '').substring(0, 32)}`; console.log(`Fragment ${fragment.fragmentIndex} uploaded: ${uploadResult.blobId}`); } catch (error: any) { console.error(`Failed to upload fragment ${fragment.fragmentIndex}:`, error.message); fragment.status = 'failed'; } } // Update job status job.status = 'ready'; // Store job jobs.set(job.jobId, job); // Add fragments to available pool job.fragments .filter(f => f.status === 'pending' && f.walrusUrl) .forEach(f => availableFragments.push(f)); console.log(`Job ${job.jobId} created with ${job.fragments.length} fragments`); res.json({ jobId: job.jobId, totalFragments: job.totalFragments, totalBounty: job.totalBounty, status: job.status, }); } catch (error: any) { console.error('Job creation failed:', error); res.status(500).json({ error: error.message }); } }); /** * Get job status */ app.get('/api/jobs/:jobId', (req, res) => { const job = jobs.get(req.params.jobId); if (!job) { return res.status(404).json({ error: 'Job not found' }); } res.json(job); }); /** * Get available fragments for workers * GET /api/fragments/available?capability=gemma-text-classification */ app.get('/api/fragments/available', (req, res) => { const capability = req.query.capability as string; let fragments = availableFragments.filter(f => f.status === 'pending'); if (capability) { fragments = fragments.filter(f => { const job = jobs.get(f.jobId); return job?.jobType === capability; }); } res.json({ count: fragments.length, fragments: fragments.slice(0, 10), // Return first 10 }); }); /** * Claim a fragment (for workers) * POST /api/fragments/:fragmentId/claim * Body: { [truncated — 4675 more characters] ``` ### Shard-Frontend/app/page.tsx ```typescript "use client"; import { useState, useEffect } from "react"; import { motion } from "framer-motion"; import { Cpu, Zap, Shield, Coins, GitBranch, Blocks, ArrowRight, ChevronDown, Sparkles, Brain, TrendingUp, Server, CheckCircle2 } from "lucide-react"; import Link from "next/link"; export default function Home() { const [mounted, setMounted] = useState(false); useEffect(() => { setMounted(true); }, []); if (!mounted) return null; return (
{/* Animated background elements */}
{/* Navigation */} {/* Hero Section */}
Powered by Sui Blockchain • Walrus • Seal Decentralized Compute,
Fragment by Fragment Harness the untapped power of millions of idle Macs for AI inference and simulations. 10,000x cheaper than AWS. Zero gas fees for providers. Submit Your First Job {/* Stats */} {[ { label: "Cost Reduction", value: "10,000x", icon: Zap }, { label: "Macs Available", value: "~100M", icon: Cpu }, { label: "Fragments/sec", value: "10K+", icon: GitBranch }, { label: "USDC Rewards", value: "$$$", icon: Coins }, ].map((stat, i) => (
{stat.value}
(null); const [csvContent, setCsvContent] = useState(""); const [prompt, setPrompt] = useState("Classify the following text as 'safe' or 'unsafe' based on whether it contains hate speech, violence, or harmful content."); const [isSubmitting, setIsSubmitting] = useState(false); const [submitted, setSubmitted] = useState(false); const [jobId, setJobId] = useState(""); const [jobStatus, setJobStatus] = useState(null); const handleFileChange = (e: ChangeEvent) => { const file = e.target.files?.[0]; if (file) { setCsvFile(file); // Read file content const reader = new FileReader(); reader.onload = (event) => { const content = event.target?.result as string; setCsvContent(content); }; reader.readAsText(file); } }; // Poll for job status updates useEffect(() => { if (!jobId || !submitted) return; const pollInterval = setInterval(async () => { try { const response = await fetch(getApiUrl(`/api/jobs/${jobId}`)); if (response.ok) { const data = await response.json(); setJobStatus(data); } } catch (error) { console.error("Error polling job status:", error); } }, 2000); // Poll every 2 seconds // Initial fetch fetch(getApiUrl(`/api/jobs/${jobId}`)) .then(res => res.json()) .then(data => setJobStatus(data)) .catch(console.error); return () => clearInterval(pollInterval); }, [jobId, submitted]); const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); if (!csvContent || !prompt) { alert('Please upload a CSV file and provide a prompt'); return; } setIsSubmitting(true); try { const lines = csvContent.split('\n').slice(1).filter(line => line.trim()); const data = lines.map(line => ({ text: line.replace(/^["']|["']$/g, '').trim() })); const response = await fetch(getApiUrl('/api/jobs'), { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ data, jobType: 'gemma-text-classification', bountyPerFragment: 0.01, prompt, }), }); if (!response.ok) { const errorData = await response.json(); throw new Error(errorData.error || "Failed to submit job"); } const result = await response.json(); setJobId(result.jobId); setSubmitted(true); } catch (error: any) { console.error("Error submitting job:", error); alert(`Error: ${error.message}`); } finally { setIsSubmitting(false); } }; const getStatusColor = (status: string) => { switch (status) { case 'pending': return 'border-blue-500/30 bg-blue-500/5'; case 'claimed': return 'border-orange-500/30 bg-orange-500/5'; case 'completed': return 'border-green-500/30 bg-green-500/5'; default: return 'border-gray-500/30 bg-gray-500/5'; } }; const getStatusIcon = (status: string) => { switch (status) { case 'pending': return ; case 'claimed': return ; case 'completed': return ; default: return ; } }; if (submitted) { const totalFragments = jobStatus?.totalFragments || 0; const completedFragments = jobStatus?.completedFragments || 0; const progress = totalFragments > 0 ? (completedFragments / totalFragments) * 100 : 0; return (
{/* Navigation */}
{/* Header */}

Job Processing

Job ID: {jobId.substring(0, 8)}...{jobId.substring(jobId.length - 8)}

(null); const [submissionLogs, setSubmissionLogs] = useState([]); const [creatingFragments, setCreatingFragments] = useState([]); // AI Form State const [aiText, setAiText] = useState(""); const [aiFile, setAiFile] = useState(null); const [aiPrompt, setAiPrompt] = useState("Classify the following text as 'safe' or 'unsafe' based on harmful content (hate speech, violence, sexual content, etc.). Respond with only 'safe' or 'unsafe'."); const addLog = (type: SubmissionLog['type'], message: string) => { setSubmissionLogs(prev => [...prev, { type, message, timestamp: Date.now() }]); }; // Poll for job status updates useEffect(() => { if (!jobId || !submitted || isSubmitting) return; const pollInterval = setInterval(async () => { try { const response = await fetch(getApiUrl(`/api/jobs/${jobId}`)); if (response.ok) { const data = await response.json(); setJobStatus(data); } } catch (error) { console.error("Error polling job status:", error); } }, 2000); fetch(getApiUrl(`/api/jobs/${jobId}`)) .then(res => res.json()) .then(data => setJobStatus(data)) .catch(console.error); return () => clearInterval(pollInterval); }, [jobId, submitted, isSubmitting]); const handleAISubmit = async (e: React.FormEvent) => { e.preventDefault(); if (!aiText && !aiFile) { alert("Please enter text or upload a file."); return; } setIsSubmitting(true); setSubmissionLogs([]); setCreatingFragments([]); addLog('info', '🚀 Starting job submission...'); let dataToSend: any[] = []; if (aiFile) { addLog('info', `📁 Reading file: ${aiFile.name}`); const fileContent = await aiFile.text(); const lines = fileContent.split('\n').slice(1).filter(line => line.trim() !== ''); dataToSend = lines.map((line, i) => ({ text: line.replace(/^["']|["']$/g, '').trim() })); addLog('success', `✅ Loaded ${dataToSend.length} sentences from CSV`); } else if (aiText) { dataToSend = [{ text: aiText }]; addLog('info', `📝 Processing single text input`); } // Initialize fragment creation display const initialFragments: CreatingFragment[] = dataToSend.map((item, i) => ({ index: i, text: item.text, status: 'creating' })); setCreatingFragments(initialFragments); try { addLog('info', `🔗 Connecting to Shard backend...`); addLog('info', `📦 Creating ${dataToSend.length} fragments...`); addLog('info', `💰 Total bounty: ${(dataToSend.length * 0.01).toFixed(2)} USDC`); // Simulate fragment creation progress for (let i = 0; i < dataToSend.length; i++) { await new Promise(resolve => setTimeout(resolve, 200)); setCreatingFragments(prev => prev.map((f, idx) => idx === i ? { ...f, status: 'uploading' } : f )); addLog('info', `📤 Uploading fragment #${i} to Walrus...`); await new Promise(resolve => setTimeout(resolve, 300)); setCreatingFragments(prev => prev.map((f, idx) => idx === i ? { ...f, status: 'encrypting' } : f )); addLog('info', `🔐 Encrypting fragment #${i} with Seal...`); } const response = await fetch(getApiUrl('/api/jobs'), { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ data: dataToSend, jobType: 'gemma-text-classification', bountyPerFragment: 0.01, prompt: aiPrompt, }), }); if (!response.ok) { const errorData = await response.json(); throw new Error(errorData.error || "Failed to submit job"); } const result = await response.json(); // Fetch the full job details to get Walrus URLs const jobDetailsResponse = await fetch(getApiUrl(`/api/jobs/${result.jobId}`)); const jobDetails = await jobDetailsResponse.json(); // Update fragments with real Walrus data one by one for (let i = 0; i < jobDetails.fragments.length; i++) { const fragment = jobDetails.fragments[i]; await new Promise(resolve => setTimeout(resolve, 150)); setCreatingFragments(prev => prev.map((f, idx) => [truncated — 28189 more characters] ``` ### Shard-Frontend/postcss.config.js ```javascript module.exports = { plugins: { tailwindcss: {}, autoprefixer: {}, }, } ``` [34 more indexed source files omitted to keep this export small. The full file list is in the Codebase structure section above.]