diff --git a/packages/broadcast-panel/package.json b/packages/broadcast-panel/package.json new file mode 100644 index 0000000..dd3bd69 --- /dev/null +++ b/packages/broadcast-panel/package.json @@ -0,0 +1,6 @@ +{ + "name": "broadcast-panel", + "version": "0.1.0", + "main": "src/index.ts", + "type": "module" +} diff --git a/packages/broadcast-panel/src/components/Header.tsx b/packages/broadcast-panel/src/components/Header.tsx new file mode 100644 index 0000000..b19b1b5 --- /dev/null +++ b/packages/broadcast-panel/src/components/Header.tsx @@ -0,0 +1,29 @@ +import React from 'react' + +const Header: React.FC = () => { + const handleLogout = () => { + localStorage.removeItem('mock_user') + window.location.href = '/auth/login' + } + + return ( +
+
+ logo +
+ +
+ +
+
+ avatar +
+
Demo User
+
+ +
+
+ ) +} + +export default Header diff --git a/packages/broadcast-panel/src/components/PageContainer.tsx b/packages/broadcast-panel/src/components/PageContainer.tsx new file mode 100644 index 0000000..40c01c8 --- /dev/null +++ b/packages/broadcast-panel/src/components/PageContainer.tsx @@ -0,0 +1,28 @@ +import React from 'react' +import Sidebar from './Sidebar' +import Header from './Header' +import TransmissionsTable from './TransmissionsTable' + +const PageContainer: React.FC = () => { + return ( +
+ +
+
+
+
+

Transmisiones

+
+ + +
+
+ + +
+
+
+ ) +} + +export default PageContainer diff --git a/packages/broadcast-panel/src/components/Sidebar.tsx b/packages/broadcast-panel/src/components/Sidebar.tsx new file mode 100644 index 0000000..8aa9b38 --- /dev/null +++ b/packages/broadcast-panel/src/components/Sidebar.tsx @@ -0,0 +1,52 @@ +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 ( + + ) +} + +export default Sidebar diff --git a/packages/broadcast-panel/src/components/TransmissionsTable.tsx b/packages/broadcast-panel/src/components/TransmissionsTable.tsx new file mode 100644 index 0000000..d4812b0 --- /dev/null +++ b/packages/broadcast-panel/src/components/TransmissionsTable.tsx @@ -0,0 +1,51 @@ +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 ( +
+
+ + +
+ +
+ + + + + + + + + + + {filtered.map(t => ( + + + + + + + ))} + +
TítuloPlataformaFechaAcciones
{t.title}{t.platform}{t.scheduled} + + +
+
+
+ ) +} + +export default TransmissionsTable diff --git a/packages/broadcast-panel/src/index.ts b/packages/broadcast-panel/src/index.ts new file mode 100644 index 0000000..6d440cf --- /dev/null +++ b/packages/broadcast-panel/src/index.ts @@ -0,0 +1,4 @@ +export { default as PageContainer } from './components/PageContainer' +export { default as Sidebar } from './components/Sidebar' +export { default as Header } from './components/Header' +export { default as TransmissionsTable } from './components/TransmissionsTable' diff --git a/packages/landing-page/public/assets/logo-dark.png b/packages/landing-page/public/assets/logo-dark.png new file mode 100644 index 0000000..26d858e Binary files /dev/null and b/packages/landing-page/public/assets/logo-dark.png differ diff --git a/packages/landing-page/public/assets/logo-icon.png b/packages/landing-page/public/assets/logo-icon.png new file mode 100644 index 0000000..fa2e0eb Binary files /dev/null and b/packages/landing-page/public/assets/logo-icon.png differ diff --git a/packages/landing-page/public/assets/logo-light.png b/packages/landing-page/public/assets/logo-light.png new file mode 100644 index 0000000..37625bd Binary files /dev/null and b/packages/landing-page/public/assets/logo-light.png differ diff --git a/packages/landing-page/public/fonts/materialdesignicons-webfont.woff2 b/packages/landing-page/public/fonts/materialdesignicons-webfont.woff2 new file mode 100644 index 0000000..cbefe23 Binary files /dev/null and b/packages/landing-page/public/fonts/materialdesignicons-webfont.woff2 differ diff --git a/packages/landing-page/src/components/broadcast/Header.tsx b/packages/landing-page/src/components/broadcast/Header.tsx new file mode 100644 index 0000000..b19b1b5 --- /dev/null +++ b/packages/landing-page/src/components/broadcast/Header.tsx @@ -0,0 +1,29 @@ +import React from 'react' + +const Header: React.FC = () => { + const handleLogout = () => { + localStorage.removeItem('mock_user') + window.location.href = '/auth/login' + } + + return ( +
+
+ logo +
+ +
+ +
+
+ avatar +
+
Demo User
+
+ +
+
+ ) +} + +export default Header diff --git a/packages/landing-page/src/components/broadcast/PageContainer.tsx b/packages/landing-page/src/components/broadcast/PageContainer.tsx new file mode 100644 index 0000000..40c01c8 --- /dev/null +++ b/packages/landing-page/src/components/broadcast/PageContainer.tsx @@ -0,0 +1,28 @@ +import React from 'react' +import Sidebar from './Sidebar' +import Header from './Header' +import TransmissionsTable from './TransmissionsTable' + +const PageContainer: React.FC = () => { + return ( +
+ +
+
+
+
+

Transmisiones

+
+ + +
+
+ + +
+
+
+ ) +} + +export default PageContainer diff --git a/packages/landing-page/src/components/broadcast/README.md b/packages/landing-page/src/components/broadcast/README.md new file mode 100644 index 0000000..8544376 --- /dev/null +++ b/packages/landing-page/src/components/broadcast/README.md @@ -0,0 +1,12 @@ +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`. diff --git a/packages/landing-page/src/components/broadcast/Sidebar.tsx b/packages/landing-page/src/components/broadcast/Sidebar.tsx new file mode 100644 index 0000000..8aa9b38 --- /dev/null +++ b/packages/landing-page/src/components/broadcast/Sidebar.tsx @@ -0,0 +1,52 @@ +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 ( + + ) +} + +export default Sidebar diff --git a/packages/landing-page/src/components/broadcast/TransmissionsTable.tsx b/packages/landing-page/src/components/broadcast/TransmissionsTable.tsx new file mode 100644 index 0000000..d4812b0 --- /dev/null +++ b/packages/landing-page/src/components/broadcast/TransmissionsTable.tsx @@ -0,0 +1,51 @@ +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 ( +
+
+ + +
+ +
+ + + + + + + + + + + {filtered.map(t => ( + + + + + + + ))} + +
TítuloPlataformaFechaAcciones
{t.title}{t.platform}{t.scheduled} + + +
+
+
+ ) +} + +export default TransmissionsTable diff --git a/packages/landing-page/src/components/broadcast/index.ts b/packages/landing-page/src/components/broadcast/index.ts new file mode 100644 index 0000000..391ade9 --- /dev/null +++ b/packages/landing-page/src/components/broadcast/index.ts @@ -0,0 +1,2 @@ +// Re-exports to migrate broadcast components to the new `broadcast-panel` package +export { PageContainer, Sidebar, Header, TransmissionsTable } from 'broadcast-panel' diff --git a/packages/landing-page/src/pages/auth/login.tsx b/packages/landing-page/src/pages/auth/login.tsx new file mode 100644 index 0000000..bdbaccf --- /dev/null +++ b/packages/landing-page/src/pages/auth/login.tsx @@ -0,0 +1,32 @@ +import React, { useState } from 'react' + +const Login: React.FC = () => { + const [email, setEmail] = useState('') + const [password, setPassword] = useState('') + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault() + // Mock authentication: accept any email/password + const mockUser = { id: 'user-1', name: 'Demo User', email } + localStorage.setItem('mock_user', JSON.stringify(mockUser)) + // Redirect to broadcast panel + window.location.href = '/broadcast' + } + + return ( +
+
+

Iniciar sesión (Mock)

+
+ + setEmail(e.target.value)} /> + + setPassword(e.target.value)} /> + +
+
+
+ ) +} + +export default Login diff --git a/packages/landing-page/src/pages/broadcast.tsx b/packages/landing-page/src/pages/broadcast.tsx new file mode 100644 index 0000000..20e5f28 --- /dev/null +++ b/packages/landing-page/src/pages/broadcast.tsx @@ -0,0 +1,20 @@ +import React, { useEffect } from 'react' +import { useRouter } from 'next/navigation' +import PageContainer from '../components/broadcast/PageContainer' + +const BroadcastPage: React.FC = () => { + const router = useRouter() + + useEffect(() => { + const user = localStorage.getItem('mock_user') + if (!user) { + router.push('/auth/login') + } + }, []) + + return ( + + ) +} + +export default BroadcastPage diff --git a/packages/broadcast-studio/index.html b/packages/studio-panel/index.html similarity index 100% rename from packages/broadcast-studio/index.html rename to packages/studio-panel/index.html diff --git a/packages/broadcast-studio/package.json b/packages/studio-panel/package.json similarity index 100% rename from packages/broadcast-studio/package.json rename to packages/studio-panel/package.json diff --git a/packages/broadcast-studio/postcss.config.cjs b/packages/studio-panel/postcss.config.cjs similarity index 100% rename from packages/broadcast-studio/postcss.config.cjs rename to packages/studio-panel/postcss.config.cjs diff --git a/packages/broadcast-studio/src/App.tsx b/packages/studio-panel/src/App.tsx similarity index 100% rename from packages/broadcast-studio/src/App.tsx rename to packages/studio-panel/src/App.tsx diff --git a/packages/broadcast-studio/src/index.css b/packages/studio-panel/src/index.css similarity index 100% rename from packages/broadcast-studio/src/index.css rename to packages/studio-panel/src/index.css diff --git a/packages/broadcast-studio/src/main.tsx b/packages/studio-panel/src/main.tsx similarity index 100% rename from packages/broadcast-studio/src/main.tsx rename to packages/studio-panel/src/main.tsx diff --git a/packages/broadcast-studio/tailwind.config.cjs b/packages/studio-panel/tailwind.config.cjs similarity index 100% rename from packages/broadcast-studio/tailwind.config.cjs rename to packages/studio-panel/tailwind.config.cjs diff --git a/packages/broadcast-studio/tsconfig.json b/packages/studio-panel/tsconfig.json similarity index 100% rename from packages/broadcast-studio/tsconfig.json rename to packages/studio-panel/tsconfig.json diff --git a/packages/broadcast-studio/tsconfig.node.json b/packages/studio-panel/tsconfig.node.json similarity index 100% rename from packages/broadcast-studio/tsconfig.node.json rename to packages/studio-panel/tsconfig.node.json diff --git a/packages/broadcast-studio/vite.config.ts b/packages/studio-panel/vite.config.ts similarity index 100% rename from packages/broadcast-studio/vite.config.ts rename to packages/studio-panel/vite.config.ts