diff --git a/src/components/AppSidebar.tsx b/src/components/AppSidebar.tsx
index d57abb8..ddd01a4 100644
--- a/src/components/AppSidebar.tsx
+++ b/src/components/AppSidebar.tsx
@@ -18,6 +18,7 @@ import {
import { CreditsNav } from './nav/CreditsNav'
import { NavGroup } from './nav/NavGroup'
import { NavItem } from './nav/NavItem'
+import { StopSoundsButton } from './nav/StopSoundsButton'
import { UserNav } from './nav/UserNav'
import { CompactPlayer } from './player/CompactPlayer'
@@ -67,6 +68,8 @@ export function AppSidebar({ showCompactPlayer = false }: AppSidebarProps) {
>
)}
+
+
diff --git a/src/components/nav/StopSoundsButton.tsx b/src/components/nav/StopSoundsButton.tsx
new file mode 100644
index 0000000..bc13dc0
--- /dev/null
+++ b/src/components/nav/StopSoundsButton.tsx
@@ -0,0 +1,44 @@
+import { useState } from 'react'
+import { Square } from 'lucide-react'
+import { SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar'
+import { soundsService } from '@/lib/api/services/sounds'
+import { toast } from 'sonner'
+
+export function StopSoundsButton() {
+ const [isLoading, setIsLoading] = useState(false)
+
+ const handleStopSounds = async () => {
+ setIsLoading(true)
+ try {
+ await soundsService.stopSounds()
+ toast.success('All sounds stopped')
+ } catch (error) {
+ toast.error(
+ `Failed to stop sounds: ${error instanceof Error ? error.message : 'Unknown error'}`
+ )
+ } finally {
+ setIsLoading(false)
+ }
+ }
+
+ const tooltipText = isLoading ? 'Stopping sounds...' : 'Stop All Sounds'
+
+ return (
+
+
+
+
+
+ {isLoading ? 'Stopping...' : 'Stop All Sounds'}
+
+
+
+
+ )
+}
\ No newline at end of file