MythEclipse/GMW
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(leptos): Phase 4 Task 7 - LivePanel composition + app.rs wiring

Browse Source
This commit is contained in:
asepharyana
2026-07-03 22:06:40 +07:00
parent ca89dd7a03
commit 52d53fc7f7
2 changed files with 55 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
services/frontend-leptos/frontend/src/app.rs
+2 -1
View File
@@ -3,6 +3,7 @@ use shared_types::ui_state::Tab;
use crate::auth::AuthOverlay; use crate::auth::AuthOverlay;
use crate::ws::context::WsContext; use crate::ws::context::WsContext;
use crate::features::messages::MessagesPanel; use crate::features::messages::MessagesPanel;
use crate::features::live::LivePanel;
#[derive(Clone)] #[derive(Clone)]
pub struct AppConfig { pub struct AppConfig {
@@ -93,7 +94,7 @@ pub fn App() -> impl IntoView {
<div style="flex: 1; overflow: auto; padding: 1.5rem;"> <div style="flex: 1; overflow: auto; padding: 1.5rem;">
{move || match ui.active_tab.get() { {move || match ui.active_tab.get() {
Tab::Messages => view! { <MessagesPanel /> }.into_any(), Tab::Messages => view! { <MessagesPanel /> }.into_any(),
Tab::Live => view! { <div>"Live Panel"</div> }.into_any(), Tab::Live => view! { <LivePanel /> }.into_any(),
Tab::Dashboard => view! { <div>"Dashboard Panel"</div> }.into_any(), Tab::Dashboard => view! { <div>"Dashboard Panel"</div> }.into_any(),
}} }}
</div> </div>
services/frontend-leptos/frontend/src/features/live/mod.rs
+53 -10
View File
@@ -3,20 +3,63 @@ pub mod hooks;
pub mod audio; pub mod audio;
use leptos::prelude::*; use leptos::prelude::*;
use crate::ui::card::Card; use crate::ws::context::WsContext;
use components::{
VoiceConnectionCard, ActiveSpeakers, AudioVisualizer,
NowPlaying, MusicSubPanel, ScreenSubPanel, RecordingsSubPanel,
};
/// Placeholder LivePanel component for Phase 4 Task 1 /// LivePanel — Composition shell for all voice and media components
/// Will be expanded with voice connection, music player, and recordings components
#[component] #[component]
pub fn LivePanel() -> impl IntoView { pub fn LivePanel() -> impl IntoView {
let ws = use_context::<WsContext>();
view! { view! {
<Card class="p-6"> <div class="live-panel space-y-6">
<div class="space-y-4"> <div class="flex items-center justify-between">
<h2 class="text-xl font-bold">Live Monitoring</h2> <div>
<p class="text-gray-600 dark:text-gray-400"> <h2 class="text-2xl font-bold tracking-tight">"Voice & Media"</h2>
Live panel components coming in Phase 4 <p class="text-sm text-muted-foreground mt-1">
</p> "Monitor voice channels, play music, share your screen, and browse recordings."
</p>
</div>
</div> </div>
</Card>
{/* Top row: Voice connection + speakers + visualizer */}
<div class="grid gap-6 lg:grid-cols-3">
<div class="lg:col-span-2">
<VoiceConnectionCard />
</div>
<div>
<ActiveSpeakers />
</div>
</div>
{/* Audio visualization */}
<div class="card">
<div class="card-header">
<div class="card-title">"Audio Visualization"</div>
</div>
<div class="card-content">
<AudioVisualizer />
</div>
</div>
{/* Media controls: Now Playing + Music + Screen */}
<div class="grid gap-6 lg:grid-cols-3">
<div>
<NowPlaying />
</div>
<div>
<MusicSubPanel />
</div>
<div>
<ScreenSubPanel />
</div>
</div>
{/* Recordings */}
<RecordingsSubPanel />
</div>
} }
} }