chore: remove broadcast components from landing-page (moved to broadcast-panel)
This commit is contained in:
parent
408e3b24b9
commit
ec88eeeadc
@ -1,29 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
const Header: React.FC = () => {
|
||||
const handleLogout = () => {
|
||||
localStorage.removeItem('mock_user')
|
||||
window.location.href = '/auth/login'
|
||||
}
|
||||
|
||||
return (
|
||||
<header className="h-16 bg-white border-b flex items-center justify-between px-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<img src="/assets/logo-dark.png" alt="logo" className="w-28 h-auto object-contain" />
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4">
|
||||
<button className="px-3 py-2 border rounded flex items-center gap-2"><i className="mdi mdi-help-circle-outline"></i> Ayuda</button>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-8 h-8 rounded-full bg-slate-100 flex items-center justify-center overflow-hidden">
|
||||
<img src="/assets/logo-icon.png" alt="avatar" className="w-full h-full object-cover" />
|
||||
</div>
|
||||
<div className="text-sm">Demo User</div>
|
||||
</div>
|
||||
<button onClick={handleLogout} className="px-3 py-2 bg-red-50 text-red-600 border rounded">Cerrar sesión</button>
|
||||
</div>
|
||||
</header>
|
||||
)
|
||||
}
|
||||
|
||||
export default Header
|
||||
@ -1,28 +0,0 @@
|
||||
import React from 'react'
|
||||
import Sidebar from './Sidebar'
|
||||
import Header from './Header'
|
||||
import TransmissionsTable from './TransmissionsTable'
|
||||
|
||||
const PageContainer: React.FC = () => {
|
||||
return (
|
||||
<div className="min-h-screen flex bg-[#f7f8fa]">
|
||||
<Sidebar />
|
||||
<div className="flex-1 flex flex-col">
|
||||
<Header />
|
||||
<main className="p-8">
|
||||
<div className="mb-6 flex items-center justify-between">
|
||||
<h1 className="text-2xl font-semibold">Transmisiones</h1>
|
||||
<div className="flex items-center gap-3">
|
||||
<button className="px-4 py-2 bg-indigo-600 text-white rounded">Nueva transmisión</button>
|
||||
<button className="px-3 py-2 border rounded">Importar</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<TransmissionsTable />
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default PageContainer
|
||||
@ -1,12 +0,0 @@
|
||||
Panel Broadcast - Instrucciones rápidas
|
||||
|
||||
Cómo probar el panel broadcast (mock):
|
||||
|
||||
1. Abre la app (npm run dev en el workspace `packages/landing-page`).
|
||||
2. Ve a `/auth/login` y usa cualquier correo/contraseña para "loguearte". Esto guardará `mock_user` en localStorage.
|
||||
3. Serás redirigido a `/broadcast`, que carga el panel con los assets del template.
|
||||
4. Para cerrar sesión, usa el botón "Cerrar sesión" en la cabecera.
|
||||
|
||||
Notas:
|
||||
- Este es un mock inicial para la UX; la autenticación real y llamadas al backend deben implementarse posteriormente.
|
||||
- Los assets (logos, icon font) se copiaron desde el template Techwind adjunto y están en `public/assets` y `public/fonts`.
|
||||
@ -1,52 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
const Sidebar: React.FC = () => {
|
||||
const navItems = [
|
||||
{ id: 'dashboard', label: 'Inicio' },
|
||||
{ id: 'create', label: 'Crear' },
|
||||
{ id: 'transmissions', label: 'Transmisiones' },
|
||||
{ id: 'recordings', label: 'Grabaciones' },
|
||||
{ id: 'settings', label: 'Ajustes' },
|
||||
]
|
||||
|
||||
return (
|
||||
<aside className="w-64 bg-white border-r shadow-sm flex flex-col">
|
||||
<div className="p-4 border-b flex items-center gap-3">
|
||||
<img src="/assets/logo-light.png" alt="logo" className="w-10 h-10 object-contain" />
|
||||
<div>
|
||||
<div className="text-lg font-semibold">AvanzaCast</div>
|
||||
<div className="text-sm text-slate-500">Cuenta Demo</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav className="p-4 flex-1 overflow-y-auto">
|
||||
<ul className="space-y-1">
|
||||
{navItems.map(item => (
|
||||
<li key={item.id}>
|
||||
<a href="#" className="flex items-center gap-3 px-3 py-2 rounded hover:bg-indigo-50 text-sm">
|
||||
<i className="mdi mdi-view-dashboard text-lg text-slate-400"></i>
|
||||
<span>{item.label}</span>
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div className="mt-auto p-4 border-t">
|
||||
<div className="flex items-center gap-3 mb-3">
|
||||
<div className="w-10 h-10 rounded-full bg-slate-100 flex items-center justify-center overflow-hidden">
|
||||
<img src="/assets/logo-icon.png" alt="avatar" className="w-full h-full object-cover" />
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm font-medium">Demo User</div>
|
||||
<div className="text-xs text-slate-500">demo@avanzacast.test</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-sm text-slate-600 mb-3">Almacenamiento: <strong>0</strong> de 5 GB</div>
|
||||
<button className="mt-3 w-full py-2 bg-indigo-600 text-white rounded">Comprar más</button>
|
||||
</div>
|
||||
</aside>
|
||||
)
|
||||
}
|
||||
|
||||
export default Sidebar
|
||||
@ -1,51 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
|
||||
interface Transmission { id: string, title: string, platform: string, scheduled: string }
|
||||
|
||||
const mockTransmissions: Transmission[] = [
|
||||
{ id: 't1', title: 'Demo Stream - Producto A', platform: 'YouTube', scheduled: '2025-11-10 18:00' },
|
||||
{ id: 't2', title: 'Webinar - Marketing', platform: 'Facebook', scheduled: '2025-11-12 16:00' },
|
||||
]
|
||||
|
||||
const TransmissionsTable: React.FC = () => {
|
||||
const [activeTab, setActiveTab] = useState<'upcoming' | 'past'>('upcoming')
|
||||
|
||||
const filtered = mockTransmissions
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="mb-4 flex items-center gap-3">
|
||||
<button onClick={() => setActiveTab('upcoming')} className={`px-3 py-1 rounded ${activeTab==='upcoming' ? 'bg-indigo-600 text-white' : 'bg-white border'}`}>Próximamente</button>
|
||||
<button onClick={() => setActiveTab('past')} className={`px-3 py-1 rounded ${activeTab==='past' ? 'bg-indigo-600 text-white' : 'bg-white border'}`}>Anteriores</button>
|
||||
</div>
|
||||
|
||||
<div className="bg-white border rounded">
|
||||
<table className="w-full">
|
||||
<thead className="bg-gray-50">
|
||||
<tr>
|
||||
<th className="text-left p-3">Título</th>
|
||||
<th className="text-left p-3">Plataforma</th>
|
||||
<th className="text-left p-3">Fecha</th>
|
||||
<th className="text-right p-3">Acciones</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{filtered.map(t => (
|
||||
<tr key={t.id} className="border-t">
|
||||
<td className="p-3">{t.title}</td>
|
||||
<td className="p-3">{t.platform}</td>
|
||||
<td className="p-3">{t.scheduled}</td>
|
||||
<td className="p-3 text-right">
|
||||
<button className="px-3 py-1 bg-indigo-600 text-white rounded mr-2">Entrar</button>
|
||||
<button className="px-3 py-1 border rounded">Opciones</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default TransmissionsTable
|
||||
@ -1,2 +0,0 @@
|
||||
// Re-exports to migrate broadcast components to the new `broadcast-panel` package
|
||||
export { PageContainer, Sidebar, Header, TransmissionsTable } from 'broadcast-panel'
|
||||
Loading…
x
Reference in New Issue
Block a user