asepharyana
4e0c21d86c
- Recordings: custom RecordingAudioPlayer (play/pause, buffering spinner, click-to-seek, time label, eq bars, single-playback antar kartu) + highlight kartu now-playing - Media: thumbnail di disc hero + queue row, equalizer saat playing, badge 'up next', label Paused vs Now playing - MiniPlayer global di AppFrame (fixed bottom-right, hidden on /media) menggantikan use-media-player.tsx dead provider (dihapus) - Voice: mic level meter live (AnalyserNode RMS) + slider mic/listen volume
31 lines
1.2 KiB
TypeScript
31 lines
1.2 KiB
TypeScript
import { MiniPlayer } from "@/components/media/mini-player";
|
|
import { MobileNav } from "./mobile-nav";
|
|
import { NavRail } from "./nav-rail";
|
|
import { TopBar } from "./topbar";
|
|
|
|
/**
|
|
* App chrome: slim nav rail + sticky top bar + scrollable content region.
|
|
* Sits above the fixed AmbientCanvas. Providers (Ambient + WS) are mounted in
|
|
* the route layout so every page shares one live link and signal context.
|
|
*
|
|
* < md the side rail collapses (hidden) and a bottom tab bar (MobileNav)
|
|
* takes over navigation; the content region gains bottom padding so the last
|
|
* panel never hides behind the dock. A persistent MiniPlayer floats at the
|
|
* bottom-right whenever a media track is loaded outside /media.
|
|
*/
|
|
export function AppFrame({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<div className="flex h-dvh w-full overflow-hidden">
|
|
<NavRail />
|
|
<div className="flex min-w-0 flex-1 flex-col">
|
|
<TopBar />
|
|
<main className="min-h-0 flex-1 overflow-y-auto px-4 pb-[calc(2rem+env(safe-area-inset-bottom))] pt-4 sm:px-5 sm:pb-[calc(2.5rem+env(safe-area-inset-bottom))]">
|
|
{children}
|
|
</main>
|
|
</div>
|
|
<MobileNav />
|
|
<MiniPlayer />
|
|
</div>
|
|
);
|
|
}
|