From 7e0a9afb179d228301effe00575c2f67b426e3da Mon Sep 17 00:00:00 2001
From: MAZE <remvze@proton.me>
Date: Fri, 27 Oct 2023 12:51:45 +0330
Subject: [PATCH] fix: set aria label to ID

---
 src/components/sound/range/range.tsx | 5 ++---
 src/components/sound/sound.tsx       | 4 ++--
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/sound/range/range.tsx b/src/components/sound/range/range.tsx
index e96d09b..249eef0 100644
--- a/src/components/sound/range/range.tsx
+++ b/src/components/sound/range/range.tsx
@@ -4,17 +4,16 @@ import styles from './range.module.css';
 
 interface RangeProps {
   id: string;
-  label: string;
 }
 
-export function Range({ id, label }: RangeProps) {
+export function Range({ id }: RangeProps) {
   const setVolume = useSoundStore(state => state.setVolume);
   const volume = useSoundStore(state => state.sounds[id].volume);
   const isSelected = useSoundStore(state => state.sounds[id].isSelected);
 
   return (
     <input
-      aria-labelledby={label}
+      aria-labelledby={id}
       autoComplete="off"
       className={styles.range}
       disabled={!isSelected}
diff --git a/src/components/sound/sound.tsx b/src/components/sound/sound.tsx
index 5696ed9..afda6cd 100644
--- a/src/components/sound/sound.tsx
+++ b/src/components/sound/sound.tsx
@@ -79,8 +79,8 @@ export function Sound({
     >
       <Like id={id} />
       <div className={styles.icon}>{icon}</div>
-      <h3 id={label}>{label}</h3>
-      <Range id={id} label={label} />
+      <h3 id={id}>{label}</h3>
+      <Range id={id} />
     </div>
   );
 }