From 3a77a12a216230b5c33d82ff28ad831fb591be6f Mon Sep 17 00:00:00 2001
From: "Carlos (Almeira)" <carlos@almeira.com.co>
Date: Sun, 29 Mar 2026 22:41:35 -0500
Subject: [PATCH] feat: implement live Radio signal and complete live signals
 integration

---
 src/app/radio/page.tsx | 22 ++++++----------------
 1 file changed, 6 insertions(+), 16 deletions(-)

diff --git a/src/app/radio/page.tsx b/src/app/radio/page.tsx
index 36fb900..54deb0a 100644
--- a/src/app/radio/page.tsx
+++ b/src/app/radio/page.tsx
@@ -1,12 +1,15 @@
 import { APPWRITE_ALMEIRA_CONFIG } from '@/lib/appwrite';
 import { createAdminClient } from '@/lib/appwrite.server';
 import ProgrammingSchedule from '@/components/ProgrammingSchedule';
-import { RadioTower, PlayCircle, Headphones } from 'lucide-react';
+import { RadioTower, Headphones } from 'lucide-react';
+import { getEntityConfig } from '@/app/actions/entity';
+import { LivePlayer } from '@/components/media/LivePlayer';
 
 export const revalidate = 60; // Revalida la Radio cada minuto
 
 export default async function RadioPage() {
     let matrixData = {};
+    let entity = null;
     
     try {
         const client = await createAdminClient();
@@ -16,6 +19,7 @@ export default async function RadioPage() {
             'matrix_radio'
         );
         matrixData = JSON.parse(doc.matrix_data);
+        entity = await getEntityConfig();
     } catch(e) {
         console.error("No se pudo cargar parrilla de radio", e);
     }
@@ -40,21 +44,7 @@ export default async function RadioPage() {
 
             {/* Audio Player Container */}
             <div className="container mx-auto px-4 -mt-10 relative z-10 mb-20 max-w-4xl">
-                <div className="h-48 bg-black rounded-3xl overflow-hidden border border-slate-800 shadow-2xl relative flex items-center justify-center group overflow-hidden">
-                    <div className="absolute inset-0 bg-gradient-to-r from-rose-600/20 to-orange-600/20 mix-blend-screen pointer-events-none"></div>
-                    
-                    {/* Placeholder gráfico tipo ecualizador */}
-                    <div className="absolute bottom-0 w-full h-1/2 flex items-end justify-center gap-1 opacity-20">
-                         {Array.from({length: 40}).map((_, i) => (
-                             <div key={i} className="w-2 bg-rose-500 rounded-t-sm animate-pulse" style={{ height: `${Math.random() * 100}%`, animationDuration: `${0.5 + Math.random()}s` }}></div>
-                         ))}
-                    </div>
-
-                    <div className="relative z-10 flex flex-col items-center">
-                        <PlayCircle size={64} className="text-slate-300 group-hover:scale-110 transition-transform group-hover:text-rose-500 cursor-pointer shadow-lg rounded-full mb-2" />
-                        <p className="text-slate-500 text-xs text-center px-4">Inserta aquí el iframe/embed de tu servidor ShoutCast/Icecast.</p>
-                    </div>
-                </div>
+                <LivePlayer url={entity?.radio_url} type="radio" title={entity?.razon_social} />
             </div>
 
             {/* Parrilla */}