fix(glossary): eliminate all redundant elements - filter imported templates, remove duplicate buttons and links
Some checks failed
Deploy to Production / Build and Deploy (push) Has been cancelled

This commit is contained in:
2026-06-20 19:03:44 +02:00
parent 489df66c0f
commit 4a8f33d36f
2 changed files with 214 additions and 33 deletions

View File

@@ -619,49 +619,24 @@ export default function GlossariesPage() {
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
{availableTemplates.map((template) => {
const Icon = TEMPLATE_ICONS[template.id] || BookText;
const isImported = importedTemplateIds.has(template.id);
const isProcessingThis = importingPresetId === template.id;
return (
<div
key={template.id}
className={cn(
'relative p-4 rounded-xl text-left border transition-all min-h-[110px] flex flex-col justify-between group',
isImported
? 'bg-emerald-500/5 dark:bg-emerald-500/5 border-emerald-500/20 dark:border-emerald-500/10 opacity-90'
: 'bg-brand-muted/40 dark:bg-white/5 border-black/5 dark:border-white/5 hover:border-brand-accent/20 hover:bg-brand-accent/[0.02]'
)}
className="relative p-4 rounded-xl text-left border transition-all min-h-[110px] flex flex-col justify-between group bg-brand-muted/40 dark:bg-white/5 border-black/5 dark:border-white/5 hover:border-brand-accent/20 hover:bg-brand-accent/[0.02]"
>
<div className="flex items-center justify-between gap-2 w-full">
<div className="p-1.5 bg-brand-accent/10 rounded-lg text-brand-accent group-hover:scale-115 transition-transform">
{isProcessingThis ? <Loader2 size={16} className="animate-spin" /> : <Icon className="size-4" />}
</div>
{isImported ? (
<div className="flex items-center gap-2">
<span className="flex items-center gap-1 text-[9px] font-bold uppercase tracking-wider text-emerald-600 dark:text-emerald-400 bg-emerald-500/10 px-2 py-0.5 rounded-full border border-emerald-500/20">
<CheckCircle2 size={9} /> {t('glossaries.presets.alreadyImported') || 'Importé'}
</span>
{(() => {
const matchingGlossary = glossaries.find((g) => g.template_id === template.id);
return matchingGlossary ? (
<Link
href={`/dashboard/glossaries/${matchingGlossary.id}`}
className="text-[9px] font-bold uppercase tracking-wider text-brand-accent hover:underline flex items-center gap-0.5"
>
Modifier
</Link>
) : null;
})()}
</div>
) : (
<button
disabled={isProcessing}
onClick={() => handleImportPreset(template.id, template.name)}
className="accent-pill !px-3 !py-1 !text-[9px] font-bold uppercase tracking-wider bg-brand-accent text-white hover:bg-brand-accent/90 rounded-md transition-colors cursor-pointer"
>
{t('glossaries.presets.importBtn') || 'Importer'}
</button>
)}
<button
disabled={isProcessing}
onClick={() => handleImportPreset(template.id, template.name)}
className="accent-pill !px-3 !py-1 !text-[9px] font-bold uppercase tracking-wider bg-brand-accent text-white hover:bg-brand-accent/90 rounded-md transition-colors cursor-pointer"
>
{t('glossaries.presets.importBtn') || 'Importer'}
</button>
</div>
<div className="mt-3">
<div className="flex justify-between items-baseline gap-2">