consolidate radiogroup id

calblueprint · Dec 23, 2024 · 546451e · 546451e
1 parent ff5465c
commit 546451e
Showing 1 changed file with 22 additions and 19 deletions.
diff --git a/components/RadioGroup/index.tsx b/components/RadioGroup/index.tsx
@@ -35,27 +35,30 @@ export default function RadioGroup<T>({
 
   return (
     <ComponentContainer>
-      {options.map(option => (
-        <RadioButton
-          key={String(option.value)}
-          $isSelected={selectedValue === option.value}
-          onClick={() => handleChange(option.value)}
-        >
-          <RadioLabel
+      {options.map(option => {
+        const id = option.label + '-radio';
+        return (
+          <RadioButton
+            key={String(option.value)}
             $isSelected={selectedValue === option.value}
-            htmlFor={option.label + '-radio'}
+            onClick={() => handleChange(option.value)}
           >
-            {option.label}
-          </RadioLabel>
-          <RadioInput
-            name={name}
-            value={String(option.value)}
-            checked={selectedValue === option.value}
-            onChange={() => handleChange(option.value)}
-            id={option.label + '-radio'}
-          />
-        </RadioButton>
-      ))}
+            <RadioLabel
+              $isSelected={selectedValue === option.value}
+              htmlFor={id}
+            >
+              {option.label}
+            </RadioLabel>
+            <RadioInput
+              name={name}
+              value={String(option.value)}
+              checked={selectedValue === option.value}
+              onChange={() => handleChange(option.value)}
+              id={id}
+            />
+          </RadioButton>
+        );
+      })}
     </ComponentContainer>
   );
 }