Publication IA: - 4 templates (magazine, brief, essay, simple) avec CSS riche - Rewrite IA (article/exercises/tutorial/reference/mixed) - Modération avec timeout 12s + fallback safe - Quotas publish_enhance par tier (basic=2, pro=15, business=100) - Détection contenu stale (hash) - Migration DB publishedContent/publishedTemplate/publishedSourceHash Fixes: - cheerio v1.2: Element -> AnyNode (domhandler), decodeEntities cast - _isShared ajouté au type Note (champ virtuel serveur) - callout colors PDF export: extraction fonction pure testable - admin/published: guard note.userId null - Cmd+S fonctionne en mode dialog (pas seulement fullPage) i18n: - 23 clés publish* traduites dans les 15 locales - Extension Web Clipper: 13 locales mise à jour Tests: - callout-colors.test.ts (6 tests) - note-visible-in-view.test.ts (5 tests) - entitlements.test.ts + byok-entitlements.test.ts: mock usageLog + unstubAllEnvs - 199/199 tests passent Tracker: user-stories.md sync avec sprint-status.yaml
109 lines
3.7 KiB
TypeScript
109 lines
3.7 KiB
TypeScript
'use client'
|
|
|
|
import { Columns3, Database, Table2, Wand2, 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
|
|
onOpenWizard?: () => void
|
|
}
|
|
|
|
export function StructuredViewsIntro({ target, enabling, onEnable, onOpenWizard }: 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>
|
|
<div className="flex items-center gap-3 flex-wrap">
|
|
<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>
|
|
{onOpenWizard && (
|
|
<button
|
|
type="button"
|
|
onClick={onOpenWizard}
|
|
className="flex items-center gap-1.5 px-4 py-2.5 rounded-full text-[11px] font-semibold transition-all border border-border/60 text-muted-foreground hover:text-foreground hover:border-border"
|
|
>
|
|
<Wand2 size={13} />
|
|
{t('structuredViews.wizard.openFromKanban') || 'Configurer avec l\'assistant'}
|
|
</button>
|
|
)}
|
|
</div>
|
|
</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>
|
|
)
|
|
}
|