Ajoute la base organisable par carnet (schéma, champs partagés, valeurs par note) avec activation guidée, tableau éditable, kanban et suppression de colonnes. Corrige le multiselect en vue tableau et enrichit sidebar, grille et i18n FR/EN. Inclut aussi les améliorations flashcards SM-2, l'audit consentement IA et la robustesse du serveur MCP (config, validation, rate-limit, métriques). Co-authored-by: Cursor <cursoragent@cursor.com>
96 lines
3.0 KiB
TypeScript
96 lines
3.0 KiB
TypeScript
'use client'
|
|
|
|
import { Columns3, Database, Table2, type LucideIcon } from 'lucide-react'
|
|
import { useLanguage } from '@/lib/i18n'
|
|
import { cn } from '@/lib/utils'
|
|
import type { BootstrapStructuredTarget } from '@/lib/structured-views/bootstrap-structured-notebook'
|
|
|
|
type StructuredViewsIntroProps = {
|
|
target: BootstrapStructuredTarget
|
|
enabling?: boolean
|
|
onEnable: () => void
|
|
}
|
|
|
|
export function StructuredViewsIntro({ target, enabling, onEnable }: StructuredViewsIntroProps) {
|
|
const { t } = useLanguage()
|
|
|
|
return (
|
|
<div className="max-w-2xl mx-auto space-y-8 py-6">
|
|
<div className="space-y-3">
|
|
<div className="flex items-center gap-2 text-brand-accent">
|
|
<Database size={18} />
|
|
<h2 className="font-memento-serif text-2xl text-foreground">{t('structuredViews.intro.databaseTitle')}</h2>
|
|
</div>
|
|
<p className="text-[14px] leading-relaxed text-muted-foreground">
|
|
{t('structuredViews.intro.databaseBody')}
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
<IntroCard
|
|
icon={Table2}
|
|
title={t('structuredViews.intro.tableTitle')}
|
|
body={t('structuredViews.intro.tableBody')}
|
|
active={target === 'table'}
|
|
/>
|
|
<IntroCard
|
|
icon={Columns3}
|
|
title={t('structuredViews.intro.kanbanTitle')}
|
|
body={t('structuredViews.intro.kanbanBody')}
|
|
active={target === 'kanban'}
|
|
/>
|
|
</div>
|
|
|
|
<div className="rounded-2xl border border-border/50 bg-foreground/[0.02] px-5 py-4 space-y-4">
|
|
<p className="text-[13px] text-muted-foreground leading-relaxed">
|
|
{target === 'kanban'
|
|
? t('structuredViews.intro.activateKanbanHint')
|
|
: t('structuredViews.intro.activateTableHint')}
|
|
</p>
|
|
<button
|
|
type="button"
|
|
disabled={enabling}
|
|
onClick={onEnable}
|
|
className={cn(
|
|
'px-6 py-2.5 rounded-full text-[11px] font-bold uppercase tracking-wider transition-all',
|
|
'bg-foreground text-background hover:opacity-90 disabled:opacity-50',
|
|
)}
|
|
>
|
|
{enabling
|
|
? t('structuredViews.intro.enabling')
|
|
: target === 'kanban'
|
|
? t('structuredViews.intro.enableKanban')
|
|
: t('structuredViews.intro.enableTable')}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function IntroCard({
|
|
icon: Icon,
|
|
title,
|
|
body,
|
|
active,
|
|
}: {
|
|
icon: LucideIcon
|
|
title: string
|
|
body: string
|
|
active?: boolean
|
|
}) {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'rounded-2xl border p-4 space-y-2 transition-colors',
|
|
active ? 'border-brand-accent/40 bg-brand-accent/[0.04]' : 'border-border/40 bg-card/40',
|
|
)}
|
|
>
|
|
<div className="flex items-center gap-2">
|
|
<Icon size={16} className={active ? 'text-brand-accent' : 'text-muted-foreground'} />
|
|
<h3 className="text-[13px] font-semibold text-foreground">{title}</h3>
|
|
</div>
|
|
<p className="text-[12px] leading-relaxed text-muted-foreground">{body}</p>
|
|
</div>
|
|
)
|
|
}
|