aidan/aidxnCC
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat (v1.0.0): initial refactor and redesign

Browse source
This commit is contained in:
Aidan 2025-10-09 04:12:05 -04:00
parent 3058aa1ab4
commit fe9b50b30e
134 changed files with 17792 additions and 3670 deletions
Download patch file Download diff file Expand all files Collapse all files

83
app/ai/components/FavoriteTools.tsx
View file

@ -1,5 +1,5 @@
import { Star } from 'lucide-react'
import { TbTool } from 'react-icons/tb'
import PaginatedCardList from '@/components/ui/PaginatedCardList'
import type { AIReview } from '../types'
interface FavoriteToolsProps {
@ -8,51 +8,44 @@ interface FavoriteToolsProps {
export default function FavoriteTools({ reviews }: FavoriteToolsProps) {
return (
<section className="p-4 sm:p-8 border-2 border-gray-700 rounded-lg hover:border-gray-600 transition-colors duration-300">
<div className="flex flex-row justify-between">
<h2 className="text-2xl font-semibold mb-6 text-gray-200 flex items-center gap-2">
<TbTool size={24} />
Favorite Tools
</h2>
<p className="text-muted-foreground italic text-sm">Based on personal preference</p>
</div>
<div className="space-y-4">
{reviews.map((review, index) => (
<div key={index} className="p-4 bg-gray-800/50 rounded-lg">
<div className="flex justify-between items-center mb-3">
<h3 className="font-semibold text-gray-200">{review.tool}</h3>
<div className="flex gap-1">
{[...Array(5)].map((_, i) => (
<Star
key={i}
size={14}
className={i < review.rating ? 'fill-yellow-400 text-yellow-400' : 'text-gray-600'}
/>
))}
</div>
<PaginatedCardList
items={reviews}
title="Favorite Tools"
icon={<TbTool size={24} />}
subtitle="Based on personal preference"
itemsPerPage={3}
getItemKey={(review) => review.tool}
renderItem={(review) => (
<div className="p-3 sm:p-4 bg-gray-800/50 rounded-lg">
<div className="flex justify-between items-center gap-2 mb-2 sm:mb-3">
<h3 className="font-semibold text-sm sm:text-base text-gray-200 truncate flex-1">{review.tool}</h3>
<div className="flex items-center gap-1 px-2 sm:px-3 py-0.5 sm:py-1 bg-yellow-400/10 border border-yellow-400/20 rounded-md flex-shrink-0">
<span className="text-base sm:text-lg font-bold text-yellow-400">
{review.rating.toFixed(1)}
</span>
</div>
<div className="grid grid-cols-2 gap-2 mb-2 text-sm">
<div>
<p className="text-green-400 font-medium mb-1">Pros:</p>
<ul className="text-gray-300 space-y-1">
{review.pros.map((pro, i) => (
<li key={i} className="text-xs">• {pro}</li>
))}
</ul>
</div>
<div>
<p className="text-red-400 font-medium mb-1">Cons:</p>
<ul className="text-gray-300 space-y-1">
{review.cons.map((con, i) => (
<li key={i} className="text-xs">• {con}</li>
))}
</ul>
</div>
</div>
<p className="text-sm text-blue-400 font-medium">{review.verdict}</p>
</div>
))}
</div>
</section>
<div className="grid grid-cols-2 gap-2 mb-2 text-xs sm:text-sm">
<div>
<p className="text-green-400 font-medium mb-1 text-xs sm:text-sm">Pros:</p>
<ul className="text-gray-300 space-y-0.5 sm:space-y-1">
{review.pros.map((pro, i) => (
<li key={i} className="text-xs leading-tight">• {pro}</li>
))}
</ul>
</div>
<div>
<p className="text-red-400 font-medium mb-1 text-xs sm:text-sm">Cons:</p>
<ul className="text-gray-300 space-y-0.5 sm:space-y-1">
{review.cons.map((con, i) => (
<li key={i} className="text-xs leading-tight">• {con}</li>
))}
</ul>
</div>
</div>
<p className="text-xs sm:text-sm text-blue-400 font-medium">{review.verdict}</p>
</div>
)}
/>
)
}