feat: notification sound

Author: agmmtoo

components/borrows/DropdownMenuBorrow.tsx

@@ -24,7 +24,7 @@ export function DropdownMenuBorrow() {
         <DropdownMenuGroup>
           <DropdownMenuItem>
             <BookUser className="mr-2 size-4" />
-            <Link href="/borrows/new">Borrow a book</Link>
+            <Link href="/admin/borrows/new">Borrow a book</Link>
           </DropdownMenuItem>
         </DropdownMenuGroup>
       </DropdownMenuContent>

components/dashboard/HeatmapChart.tsx

@@ -99,7 +99,7 @@ export const HeatmapChart: React.FC<HeatmapChartProps> = ({
       return {
         x: decimalHour,
         y: localDayOfWeek,
-        z: count * 100, // Scale up for bubble size
+        z: count * 20, // Scale up for bubble size
         count,
         day: dayNames[localDayOfWeek],
         time: formatTime(localHour, localMinute),

components/nav-user.tsx

@@ -29,8 +29,66 @@ export function NavUser({
     unread_notifications_count: number
   }
 }) {
+  // Play iOS-inspired notification sound using Web Audio API
+  const playNotificationSound = () => {
+    const ctx = new window.AudioContext()
+    const masterGain = ctx.createGain()
+    masterGain.gain.setValueAtTime(0.2, ctx.currentTime)
+    masterGain.connect(ctx.destination)
+
+    // iOS "Tri-tone" inspired melody with bell-like harmonics
+    const fundamentalNotes = [
+      { freq: 659.25, time: 0.0, duration: 0.35 }, // E5
+      { freq: 783.99, time: 0.1, duration: 0.35 }, // G5
+      { freq: 1046.5, time: 0.2, duration: 0.4 }, // C6
+    ]
+
+    fundamentalNotes.forEach(({ freq, time, duration }) => {
+      // Main tone
+      const osc1 = ctx.createOscillator()
+      const gain1 = ctx.createGain()
+      osc1.type = 'sine'
+      osc1.frequency.setValueAtTime(freq, ctx.currentTime + time)
+      gain1.gain.setValueAtTime(0.4, ctx.currentTime + time)
+      gain1.gain.exponentialRampToValueAtTime(
+        0.01,
+        ctx.currentTime + time + duration
+      )
+      osc1.connect(gain1)
+      gain1.connect(masterGain)
+      osc1.start(ctx.currentTime + time)
+      osc1.stop(ctx.currentTime + time + duration)
+
+      // Harmonic (octave higher for bell-like quality)
+      const osc2 = ctx.createOscillator()
+      const gain2 = ctx.createGain()
+      osc2.type = 'triangle'
+      osc2.frequency.setValueAtTime(freq * 2, ctx.currentTime + time)
+      gain2.gain.setValueAtTime(0.15, ctx.currentTime + time)
+      gain2.gain.exponentialRampToValueAtTime(
+        0.001,
+        ctx.currentTime + time + duration * 0.7
+      )
+      osc2.connect(gain2)
+      gain2.connect(masterGain)
+      osc2.start(ctx.currentTime + time)
+      osc2.stop(ctx.currentTime + time + duration * 0.7)
+
+      // Cleanup oscillators
+      osc1.onended = () => osc1.disconnect()
+      osc2.onended = () => osc2.disconnect()
+    })
+
+    // Close audio context after sound completes
+    setTimeout(() => {
+      masterGain.disconnect()
+      ctx.close()
+    }, 800)
+  }
+
   useEffect(() => {
     function onMessage(data: Notification) {
+      playNotificationSound()
       toast.info(data.title, {
         description: data.message,
       })