105 lines
4.7 KiB
TypeScript
105 lines
4.7 KiB
TypeScript
'use client'
|
|
|
|
import { Badge } from '@/components/ui/badge'
|
|
import { useLanguage } from '@/lib/i18n'
|
|
import { FileText, Sparkles, MessageCircle } from 'lucide-react'
|
|
|
|
export default function AboutSettingsPage() {
|
|
const { t } = useLanguage()
|
|
const version = '1.0.0'
|
|
const buildDate = '2026-01-17'
|
|
|
|
return (
|
|
<div className="space-y-8">
|
|
<div>
|
|
<h1 className="text-2xl font-bold tracking-tight text-foreground">{t('about.title')}</h1>
|
|
<p className="text-muted-foreground mt-1">{t('about.description')}</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
{/* App info */}
|
|
<div className="bg-card rounded-lg border border-border p-6 shadow-sm flex flex-col gap-4">
|
|
<div className="flex items-center gap-3 mb-2">
|
|
<div className="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary shrink-0">
|
|
<FileText className="h-5 w-5" />
|
|
</div>
|
|
<div>
|
|
<h3 className="font-semibold text-foreground">{t('about.appName')}</h3>
|
|
<p className="text-sm text-muted-foreground">{t('about.appDescription')}</p>
|
|
</div>
|
|
</div>
|
|
<div className="space-y-3 pt-2 border-t border-border">
|
|
<div className="flex justify-between items-center text-sm">
|
|
<span className="text-muted-foreground">{t('about.version')}</span>
|
|
<Badge variant="secondary">{version}</Badge>
|
|
</div>
|
|
<div className="flex justify-between items-center text-sm">
|
|
<span className="text-muted-foreground">{t('about.buildDate')}</span>
|
|
<Badge variant="outline">{buildDate}</Badge>
|
|
</div>
|
|
<div className="flex justify-between items-center text-sm">
|
|
<span className="text-muted-foreground">{t('about.platform')}</span>
|
|
<Badge variant="outline">{t('about.platformWeb')}</Badge>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Features */}
|
|
<div className="bg-card rounded-lg border border-border p-6 shadow-sm flex flex-col gap-4">
|
|
<div className="flex items-center gap-3 mb-2">
|
|
<div className="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary shrink-0">
|
|
<Sparkles className="h-5 w-5" />
|
|
</div>
|
|
<div>
|
|
<h3 className="font-semibold text-foreground">{t('about.features.title')}</h3>
|
|
<p className="text-sm text-muted-foreground">{t('about.features.description')}</p>
|
|
</div>
|
|
</div>
|
|
<ul className="space-y-2 pt-2 border-t border-border">
|
|
{[
|
|
t('about.features.titleSuggestions'),
|
|
t('about.features.semanticSearch'),
|
|
t('about.features.paragraphReformulation'),
|
|
t('about.features.memoryEcho'),
|
|
t('about.features.notebookOrganization'),
|
|
t('about.features.dragDrop'),
|
|
t('about.features.labelSystem'),
|
|
t('about.features.multipleProviders'),
|
|
].map((feature) => (
|
|
<li key={feature} className="flex items-center gap-2 text-sm text-foreground">
|
|
<span className="text-primary font-bold">✓</span>
|
|
{feature}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Support — full width */}
|
|
<div className="md:col-span-2 bg-card rounded-lg border border-border p-6 shadow-sm">
|
|
<div className="flex items-center gap-3 mb-4">
|
|
<div className="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary shrink-0">
|
|
<MessageCircle className="h-5 w-5" />
|
|
</div>
|
|
<div>
|
|
<h3 className="font-semibold text-foreground">{t('about.support.title')}</h3>
|
|
<p className="text-sm text-muted-foreground">{t('about.support.description')}</p>
|
|
</div>
|
|
</div>
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 pt-4 border-t border-border">
|
|
{[
|
|
{ title: t('about.support.documentation'), desc: 'Guides détaillés et tutoriels.' },
|
|
{ title: t('about.support.reportIssues'), desc: 'Signalez un bug dans le gestionnaire.' },
|
|
{ title: t('about.support.feedback'), desc: 'Vos retours nous aident à améliorer l\'app.' },
|
|
].map((item) => (
|
|
<div key={item.title} className="p-3 rounded-md bg-muted">
|
|
<p className="font-medium text-sm text-foreground">{item.title}</p>
|
|
<p className="text-xs text-muted-foreground mt-1">{item.desc}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|