fix(calendario): hacer visible LinkedIn en el creador desde el primer paso

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
4Ventures
2026-10-16 04:31:54 +02:00
parent 4a1abd3318
commit 6763613ed4

View File

@@ -541,11 +541,15 @@ Regeneradas: ${regenIds.size} · Conservadas: ${
setErr(null); setErr(null);
setDayZoom(null); setDayZoom(null);
setForm(null); setForm(null);
setCreatorTab('ig-fb');
}} }}
className="ml-auto inline-flex items-center gap-2 rounded-xl bg-gray-900 px-4 py-2.5 text-sm font-semibold text-white hover:bg-gray-800" className="ml-auto inline-flex items-center gap-2 rounded-xl bg-gray-900 px-4 py-2.5 text-sm font-semibold text-white hover:bg-gray-800"
> >
<CalendarPlus className="h-4 w-4" /> <CalendarPlus className="h-4 w-4" />
Crear nuevo calendario Crear calendario
<span className="hidden sm:inline font-normal text-white/70">
· IG/FB + LinkedIn
</span>
</button> </button>
{open ? ( {open ? (
@@ -554,7 +558,7 @@ Regeneradas: ${regenIds.size} · Conservadas: ${
<header className="flex items-center justify-between gap-3 border-b border-gray-200 px-4 py-3"> <header className="flex items-center justify-between gap-3 border-b border-gray-200 px-4 py-3">
<div> <div>
<p className="text-[11px] font-bold uppercase tracking-wider text-sky-600"> <p className="text-[11px] font-bold uppercase tracking-wider text-sky-600">
{tenantLabel} · nuevo mes editorial {tenantLabel} · nuevo mes editorial · IG/FB + LinkedIn
</p> </p>
<h2 className="text-lg font-extrabold text-gray-900"> <h2 className="text-lg font-extrabold text-gray-900">
{step === 'pick' {step === 'pick'
@@ -578,6 +582,67 @@ Regeneradas: ${regenIds.size} · Conservadas: ${
</p> </p>
) : null} ) : null}
{/* Tabs de red siempre visibles (también al elegir mes) */}
<div className="flex flex-wrap items-center gap-2">
<div className="inline-flex rounded-xl border border-gray-200 bg-gray-50 p-0.5">
<button
type="button"
onClick={() => setCreatorTab('ig-fb')}
className={`inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-semibold ${
creatorTab === 'ig-fb'
? 'bg-white text-gray-900 shadow-sm'
: 'text-gray-500'
}`}
>
<Instagram className="h-3.5 w-3.5" />
IG / FB
{step === 'edit' ? (
<span className="text-[10px] text-gray-400">
{
(plan?.pieces || []).filter(
(p) => !/linkedin/i.test(p.platform || '')
).length
}
</span>
) : null}
</button>
<button
type="button"
onClick={() => setCreatorTab('linkedin')}
className={`inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-semibold ${
creatorTab === 'linkedin'
? 'bg-[#7C66B8] text-white shadow-sm'
: 'text-gray-500'
}`}
>
<Linkedin className="h-3.5 w-3.5" />
LinkedIn
{step === 'edit' ? (
<span
className={`text-[10px] ${
creatorTab === 'linkedin'
? 'text-white/70'
: 'text-gray-400'
}`}
>
{
(plan?.pieces || []).filter((p) =>
/linkedin/i.test(p.platform || '')
).length
}
</span>
) : null}
</button>
</div>
{step === 'pick' ? (
<p className="text-[11px] text-gray-500">
{creatorTab === 'linkedin'
? 'Tras elegir el mes podrás generar posts LinkedIn desde la estrategia B2B.'
: 'Tras elegir el mes genera IG/FB o cambia a LinkedIn.'}
</p>
) : null}
</div>
{step === 'pick' ? ( {step === 'pick' ? (
<div className="grid grid-cols-2 sm:grid-cols-3 gap-3"> <div className="grid grid-cols-2 sm:grid-cols-3 gap-3">
{monthChoices.map((ym) => { {monthChoices.map((ym) => {
@@ -611,52 +676,6 @@ Regeneradas: ${regenIds.size} · Conservadas: ${
) : ( ) : (
<> <>
<div className="flex flex-wrap items-center gap-2"> <div className="flex flex-wrap items-center gap-2">
<div className="inline-flex rounded-xl border border-gray-200 bg-gray-50 p-0.5">
<button
type="button"
onClick={() => setCreatorTab('ig-fb')}
className={`inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-semibold ${
creatorTab === 'ig-fb'
? 'bg-white text-gray-900 shadow-sm'
: 'text-gray-500'
}`}
>
<Instagram className="h-3.5 w-3.5" />
IG / FB
<span className="text-[10px] text-gray-400">
{
(plan?.pieces || []).filter(
(p) => !/linkedin/i.test(p.platform || '')
).length
}
</span>
</button>
<button
type="button"
onClick={() => setCreatorTab('linkedin')}
className={`inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-semibold ${
creatorTab === 'linkedin'
? 'bg-[#7C66B8] text-white shadow-sm'
: 'text-gray-500'
}`}
>
<Linkedin className="h-3.5 w-3.5" />
LinkedIn
<span
className={`text-[10px] ${
creatorTab === 'linkedin'
? 'text-white/70'
: 'text-gray-400'
}`}
>
{
(plan?.pieces || []).filter((p) =>
/linkedin/i.test(p.platform || '')
).length
}
</span>
</button>
</div>
<button <button
type="button" type="button"
onClick={() => setStep('pick')} onClick={() => setStep('pick')}
@@ -675,7 +694,9 @@ Regeneradas: ${regenIds.size} · Conservadas: ${
) : ( ) : (
<Sparkles className="h-3.5 w-3.5" /> <Sparkles className="h-3.5 w-3.5" />
)} )}
Generar estrategia del mes {creatorTab === 'linkedin'
? 'Generar LinkedIn del mes'
: 'Generar estrategia del mes'}
</button> </button>
<button <button
type="button" type="button"