Spaces:
Build error
Build error
| import { useState } from 'react' | |
| import Head from 'next/head' | |
| import { FiGithub, FiTool, FiCode, FiCpu, FiImage, FiFileText } from 'react-icons/fi' | |
| import ToolCard from '../components/ToolCard' | |
| import Header from '../components/Header' | |
| export default function Home() { | |
| const [activeTool, setActiveTool] = useState(null) | |
| const tools = [ | |
| { id: 'code', name: 'Code Assistant', icon: <FiCode size={24} />, color: 'bg-blue-100 text-blue-600' }, | |
| { id: 'image', name: 'Image Generator', icon: <FiImage size={24} />, color: 'bg-purple-100 text-purple-600' }, | |
| { id: 'text', name: 'Text Generator', icon: <FiFileText size={24} />, color: 'bg-green-100 text-green-600' }, | |
| { id: 'summarize', name: 'Text Summarizer', icon: <FiTool size={24} />, color: 'bg-yellow-100 text-yellow-600' }, | |
| { id: 'translate', name: 'Translator', icon: <FiCpu size={24} />, color: 'bg-red-100 text-red-600' }, | |
| ] | |
| return ( | |
| <div className="min-h-screen"> | |
| <Head> | |
| <title>ToolSentry - AI Multi-Tool Platform</title> | |
| <meta name="description" content="All-in-one AI tools platform" /> | |
| </Head> | |
| <Header /> | |
| <main className="container mx-auto px-4 py-8"> | |
| <div className="text-center mb-12"> | |
| <h1 className="text-4xl font-bold text-gray-900 mb-4">ToolSentry AI Platform</h1> | |
| <p className="text-xl text-gray-600 max-w-2xl mx-auto"> | |
| Your all-in-one solution for AI-powered tools. Select a tool below to get started. | |
| </p> | |
| </div> | |
| <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| {tools.map((tool) => ( | |
| <ToolCard | |
| key={tool.id} | |
| tool={tool} | |
| onClick={() => setActiveTool(tool.id)} | |
| /> | |
| ))} | |
| </div> | |
| {activeTool && ( | |
| <div className="mt-12 p-6 bg-white rounded-lg shadow-lg"> | |
| <h2 className="text-2xl font-bold mb-4"> | |
| {tools.find(t => t.id === activeTool)?.name} | |
| </h2> | |
| <div className="border-t pt-4"> | |
| {activeTool === 'code' && <CodeAssistant />} | |
| {activeTool === 'image' && <ImageGenerator />} | |
| {activeTool === 'text' && <TextGenerator />} | |
| {activeTool === 'summarize' && <TextSummarizer />} | |
| {activeTool === 'translate' && <Translator />} | |
| </div> | |
| </div> | |
| )} | |
| </main> | |
| <footer className="bg-gray-100 py-6 mt-12"> | |
| <div className="container mx-auto px-4 text-center text-gray-600"> | |
| <p>© {new Date().getFullYear()} ToolSentry. All rights reserved.</p> | |
| <p className="mt-2"> | |
| Built with <a href="https://huggingface.co/spaces/akhaliq/anycoder" className="text-primary hover:underline">anycoder</a> | |
| </p> | |
| </div> | |
| </footer> | |
| </div> | |
| ) | |
| } | |
| // Placeholder components for each tool | |
| function CodeAssistant() { | |
| return <div>Code Assistant Tool - Coming Soon</div> | |
| } | |
| function ImageGenerator() { | |
| return <div>Image Generator Tool - Coming Soon</div> | |
| } | |
| function TextGenerator() { | |
| return <div>Text Generator Tool - Coming Soon</div> | |
| } | |
| function TextSummarizer() { | |
| return <div>Text Summarizer Tool - Coming Soon</div> | |
| } | |
| function Translator() { | |
| return <div>Translator Tool - Coming Soon</div> | |
| } |