Spaces:
Runtime error
Runtime error
| import React from 'react'; | |
| import { motion } from 'framer-motion'; | |
| import { BookOpen } from 'lucide-react'; | |
| import { MathJax } from 'better-react-mathjax'; | |
| import { INDEX_TERMS } from '../../constants'; | |
| export function KnowledgeBaseTab({ stats }) { | |
| const terms = stats?.top_terms || INDEX_TERMS; | |
| return ( | |
| <motion.div | |
| initial={{ opacity: 0, y: 10 }} | |
| animate={{ opacity: 1, y: 0 }} | |
| className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" | |
| > | |
| {terms.map((item, i) => ( | |
| <div key={item.term} className="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 p-6 rounded-3xl hover:shadow-lg transition-all cursor-pointer group"> | |
| <div className="flex items-center justify-between mb-4"> | |
| <div className="w-10 h-10 rounded-2xl bg-brand/5 flex items-center justify-center group-hover:bg-brand/10 transition-colors"> | |
| <BookOpen className="w-5 h-5 text-brand" /> | |
| </div> | |
| <span className="text-[10px] font-bold text-slate-400 uppercase tracking-widest">Entry #{i + 1}</span> | |
| </div> | |
| <MathJax> | |
| <h3 className="text-xl font-bold text-slate-900 dark:text-white mb-2 truncate" title={item.term}> | |
| {String(item.term)} | |
| </h3> | |
| </MathJax> | |
| <div className="flex items-center gap-4 mb-4"> | |
| <div> | |
| <p className="text-[9px] font-bold text-slate-400 uppercase tracking-tighter">Frequency</p> | |
| <p className="text-xs font-bold text-slate-900 dark:text-white">{item.frequency}</p> | |
| </div> | |
| <div> | |
| <p className="text-[9px] font-bold text-slate-400 uppercase tracking-tighter">Docs</p> | |
| <p className="text-xs font-bold text-slate-900 dark:text-white">{item.docs.length}</p> | |
| </div> | |
| </div> | |
| <p className="text-xs text-slate-500 font-medium leading-relaxed mb-4"> | |
| High-dimensional embedding context with semantic mapping. | |
| </p> | |
| <div className="flex flex-wrap gap-2"> | |
| <span className="px-2 py-1 bg-slate-100 dark:bg-slate-800 rounded-md text-[9px] font-bold text-slate-500 dark:text-slate-400 uppercase tracking-tighter">Vectorized</span> | |
| <span className="px-2 py-1 bg-slate-100 dark:bg-slate-800 rounded-md text-[9px] font-bold text-slate-500 dark:text-slate-400 uppercase tracking-tighter">Indexed</span> | |
| </div> | |
| </div> | |
| ))} | |
| </motion.div> | |
| ); | |
| } | |