714f8ccd5e
- Added @emoji-mart/data and @emoji-mart/react dependencies for enhanced emoji support. - Replaced static emoji characters with Emoji component in various UI components for consistency and improved rendering. - Updated generateDateTitle function to return an object with emoji and text for better structure. - Marked the task for removing emojis from the UI as complete in TODO.md.
65 lines
2.4 KiB
TypeScript
65 lines
2.4 KiB
TypeScript
'use client';
|
|
|
|
import { Card, CardContent } from '@/components/ui/Card';
|
|
import Link from 'next/link';
|
|
import { ChevronRight } from 'lucide-react';
|
|
import { Emoji } from '@/components/ui/Emoji';
|
|
|
|
interface SettingsPage {
|
|
href: string;
|
|
icon: string;
|
|
title: string;
|
|
description: string;
|
|
status: string;
|
|
}
|
|
|
|
interface SettingsNavigationProps {
|
|
settingsPages: SettingsPage[];
|
|
}
|
|
|
|
export function SettingsNavigation({ settingsPages }: SettingsNavigationProps) {
|
|
return (
|
|
<div className="space-y-4">
|
|
<h2 className="text-xl font-semibold text-[var(--foreground)] mb-4">
|
|
Sections de configuration
|
|
</h2>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-1 gap-4">
|
|
{settingsPages.map((page) => (
|
|
<Link key={page.href} href={page.href}>
|
|
<Card className="transition-all hover:shadow-md hover:border-[var(--primary)]/30 cursor-pointer">
|
|
<CardContent className="p-6">
|
|
<div className="flex items-start justify-between">
|
|
<div className="flex items-start gap-4">
|
|
<span className="text-3xl"><Emoji emoji={page.icon} size={30} /></span>
|
|
<div className="flex-1">
|
|
<h3 className="text-lg font-semibold text-[var(--foreground)] mb-1">
|
|
{page.title}
|
|
</h3>
|
|
<p className="text-[var(--muted-foreground)] mb-2">
|
|
{page.description}
|
|
</p>
|
|
<div className="flex items-center gap-2">
|
|
<span className={`px-2 py-1 rounded text-xs font-medium ${
|
|
page.status === 'Fonctionnel'
|
|
? 'bg-[var(--success)]/20 text-[var(--success)]'
|
|
: page.status === 'En développement'
|
|
? 'bg-[var(--warning)]/20 text-[var(--warning)]'
|
|
: 'bg-[var(--muted)]/20 text-[var(--muted-foreground)]'
|
|
}`}>
|
|
{page.status}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<ChevronRight className="w-5 h-5 text-[var(--muted-foreground)]" />
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|