diff --git a/app/page.tsx b/app/page.tsx index 5bf3c90..cf7cbaa 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,7 +1,7 @@ 'use client'; -import { useState } from 'react'; -import { Search, Copy, Check, Hash, Key, AlertCircle, Loader2 } from 'lucide-react'; +import { useState, useEffect } from 'react'; +import { Search, Copy, Check, Hash, Key, AlertCircle, Loader2, Database } from 'lucide-react'; interface SearchResult { found: boolean; @@ -30,12 +30,48 @@ interface SearchResult { message?: string; } +interface IndexStats { + documentCount: number; + indexSize: number; +} + +function formatBytes(bytes: number): string { + if (bytes === 0) return '0 B'; + const k = 1024; + const sizes = ['B', 'KB', 'MB', 'GB', 'TB']; + const i = Math.floor(Math.log(bytes) / Math.log(k)); + return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; +} + +function formatNumber(num: number): string { + return num.toLocaleString(); +} + export default function Home() { const [query, setQuery] = useState(''); const [result, setResult] = useState(null); const [loading, setLoading] = useState(false); const [error, setError] = useState(''); const [copiedField, setCopiedField] = useState(null); + const [stats, setStats] = useState(null); + + useEffect(() => { + const fetchStats = async () => { + try { + const response = await fetch('/api/health'); + if (response.ok) { + const data = await response.json(); + if (data.index?.stats) { + setStats(data.index.stats); + } + } + } catch (_err) { + // Silently fail - stats are not critical + } + }; + + fetchStats(); + }, [result]); // Refresh stats after each search result const handleSearch = async (e: React.FormEvent) => { e.preventDefault(); @@ -110,6 +146,18 @@ export default function Home() {

Supports MD5, SHA1, SHA256, SHA512, and Bcrypt

+ {stats && ( +
+
+ + {formatNumber(stats.documentCount)} hashes +
+ +
+ {formatBytes(stats.indexSize)} indexed +
+
+ )} {/* Search Form */}