feat(midsummer): sidebar frog toggle + jingle toggle (sound stubbed)
This commit is contained in:
parent
580fd6fbc5
commit
2fb6fd2f3e
3 changed files with 38 additions and 0 deletions
34
frontend/src/components/midsummer/FrogToggle.tsx
Normal file
34
frontend/src/components/midsummer/FrogToggle.tsx
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
import React from 'react';
|
||||
import { useMidsummer } from '../../hooks/useMidsummer';
|
||||
import { playSmaGrodorna } from '../../hooks/useMidsummerSound';
|
||||
|
||||
/** 🐸 theme toggle + 🔊 jingle toggle, rendered among the sidebar tool links. */
|
||||
export const FrogToggle: React.FC = () => {
|
||||
const { enabled, toggle, soundOn, toggleSound } = useMidsummer();
|
||||
return (
|
||||
<>
|
||||
<span
|
||||
className="ml-tool-link"
|
||||
style={{ cursor: 'pointer' }}
|
||||
title={enabled ? 'Turn off the midsummer theme' : 'Turn on the midsummer theme'}
|
||||
onClick={toggle}
|
||||
>
|
||||
🐸 Midsommar {enabled ? 'on' : 'off'}
|
||||
</span>
|
||||
{enabled && (
|
||||
<span
|
||||
className="ml-tool-link"
|
||||
style={{ cursor: 'pointer' }}
|
||||
title={soundOn ? 'Mute the Små grodorna jingle' : 'Unmute the Små grodorna jingle'}
|
||||
onClick={() => {
|
||||
const turningOn = !soundOn;
|
||||
toggleSound();
|
||||
if (turningOn) playSmaGrodorna(); // this click is a user gesture
|
||||
}}
|
||||
>
|
||||
{soundOn ? '🔊' : '🔇'} Jingle
|
||||
</span>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
@ -2,6 +2,7 @@ import React, { useCallback } from 'react';
|
|||
import { useWindowManager } from '../../contexts/WindowManagerContext';
|
||||
import { useCurrentUser } from '../../hooks/useCurrentUser';
|
||||
import { logout } from '../../api/endpoints';
|
||||
import { FrogToggle } from '../midsummer/FrogToggle';
|
||||
|
||||
export const SidebarWindowButtons: React.FC = () => {
|
||||
const { openWindow } = useWindowManager();
|
||||
|
|
@ -15,6 +16,7 @@ export const SidebarWindowButtons: React.FC = () => {
|
|||
|
||||
return (
|
||||
<div className="ml-tool-links">
|
||||
<FrogToggle />
|
||||
<span className="ml-tool-link" style={{ cursor: 'pointer' }}
|
||||
onClick={() => openWindow('agent', 'Overlord Assistant')}>🤖 Assistant</span>
|
||||
<span className="ml-tool-link" style={{ cursor: 'pointer' }}
|
||||
|
|
|
|||
2
frontend/src/hooks/useMidsummerSound.ts
Normal file
2
frontend/src/hooks/useMidsummerSound.ts
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
// Stub — replaced with the full WebAudio synth in Task 8.
|
||||
export function playSmaGrodorna(): void {}
|
||||
Loading…
Add table
Add a link
Reference in a new issue