fix(glossary): hide create section by default when glossaries exist - only shown on demand via toggle button
All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 3m11s
All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 3m11s
This commit is contained in:
@@ -153,6 +153,7 @@ export default function GlossariesPage() {
|
|||||||
const [searchQuery, setSearchQuery] = useState('');
|
const [searchQuery, setSearchQuery] = useState('');
|
||||||
const [importingPresetId, setImportingPresetId] = useState<string | null>(null);
|
const [importingPresetId, setImportingPresetId] = useState<string | null>(null);
|
||||||
const [activeTab, setActiveTab] = useState<'glossaries' | 'context'>('glossaries');
|
const [activeTab, setActiveTab] = useState<'glossaries' | 'context'>('glossaries');
|
||||||
|
const [showCreateSection, setShowCreateSection] = useState(false);
|
||||||
|
|
||||||
const isPro = user?.tier === 'pro';
|
const isPro = user?.tier === 'pro';
|
||||||
const isLoading = isLoadingUser || isLoadingGlossaries;
|
const isLoading = isLoadingUser || isLoadingGlossaries;
|
||||||
@@ -583,17 +584,41 @@ export default function GlossariesPage() {
|
|||||||
)}
|
)}
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* ── Bouton Ajouter (visible seulement si l'utilisateur a déjà des glossaires) ── */}
|
||||||
|
{glossaries.length > 0 && !showCreateSection && (
|
||||||
|
<div className="flex justify-center">
|
||||||
|
<button
|
||||||
|
onClick={() => setShowCreateSection(true)}
|
||||||
|
className="flex items-center gap-2 px-6 py-3 rounded-xl border border-dashed border-brand-accent/40 text-brand-accent text-xs font-bold uppercase tracking-widest hover:bg-brand-accent/5 transition-all cursor-pointer"
|
||||||
|
>
|
||||||
|
<Plus size={14} />
|
||||||
|
Ajouter un glossaire
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* ── Section 2 : Créer ou Importer ─────────────────────────── */}
|
{/* ── Section 2 : Créer ou Importer ─────────────────────────── */}
|
||||||
|
{(glossaries.length === 0 || showCreateSection) && (
|
||||||
<section className="editorial-card p-8 lg:p-10 bg-white dark:bg-[#141414] border border-black/5 dark:border-white/5 rounded-2xl shadow-sm">
|
<section className="editorial-card p-8 lg:p-10 bg-white dark:bg-[#141414] border border-black/5 dark:border-white/5 rounded-2xl shadow-sm">
|
||||||
<div className="mb-6">
|
<div className="mb-6">
|
||||||
<div className="flex items-center gap-2 text-brand-accent mb-2">
|
<div className="flex items-center justify-between gap-4 mb-2">
|
||||||
<Zap size={18} />
|
<div className="flex items-center gap-2 text-brand-accent">
|
||||||
<h2 className="text-sm font-serif font-medium text-brand-dark dark:text-white tracking-tight">
|
<Zap size={18} />
|
||||||
{t('glossaries.presets.whatForBold') || 'Créer un nouveau glossaire'}
|
<h2 className="text-sm font-serif font-medium text-brand-dark dark:text-white tracking-tight">
|
||||||
</h2>
|
Ajouter un glossaire
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
{showCreateSection && (
|
||||||
|
<button
|
||||||
|
onClick={() => setShowCreateSection(false)}
|
||||||
|
className="text-[10px] font-bold uppercase tracking-wider text-brand-dark/30 dark:text-white/25 hover:text-brand-dark dark:hover:text-white transition-colors cursor-pointer"
|
||||||
|
>
|
||||||
|
Fermer ✕
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
<p className="text-xs text-brand-dark/50 dark:text-white/40 font-light">
|
<p className="text-xs text-brand-dark/50 dark:text-white/40 font-light">
|
||||||
{t('glossaries.presets.whatForDesc') || 'Choisissez un modèle professionnel pré-rempli ou importez vos propres termes.'}
|
Choisissez un modèle professionnel, importez un fichier CSV ou créez manuellement.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -699,6 +724,7 @@ export default function GlossariesPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user