Something went wrong. Try again.
This repository has no description
Something went wrong. Try again.
995 B · 37 lines
JSX
at main
1234567891011121314151617181920212223242526272829303132333435363738'use client';import React from 'react';import { Volume2, VolumeX } from 'react-feather';import Link from 'next/link';import { useSoundEnabled } from '../SoundEnabledProvider';
import VisuallyHidden from '../VisuallyHidden';import MaxWidthWrapper from '../MaxWidthWrapper';import styles from './Header.module.css';
function Header() { const id = React.useId(); const { soundEnabled, setSoundEnabled } = useSoundEnabled();
// TODO: Global state?
return ( <header className={styles.wrapper}> <MaxWidthWrapper className={styles.innerWrapper}> <Link href="/">Kool Website</Link>
<button onClick={() => { setSoundEnabled(!soundEnabled); }} > {soundEnabled ? <Volume2 /> : <VolumeX />} <VisuallyHidden> {soundEnabled ? 'Disable sound effects' : 'Enable sound effects'} </VisuallyHidden> </button> </MaxWidthWrapper> </header> );}
export default Header;