From 290aec4b14e0bc86ba38ac0caf0f496af4531f45 Mon Sep 17 00:00:00 2001
From: Aleksandar Petkov <aleksandar.petkov@lab08.com>
Date: Sat, 7 Dec 2024 00:59:59 +0200
Subject: [PATCH] chore: Change color of radio buttons if disabled

---
 src/components/common/form/RadioButton.tsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/common/form/RadioButton.tsx b/src/components/common/form/RadioButton.tsx
index f630754dc..c843c4a99 100644
--- a/src/components/common/form/RadioButton.tsx
+++ b/src/components/common/form/RadioButton.tsx
@@ -70,13 +70,21 @@ type RadioButtonProps = {
   error?: boolean
 }
 
-function RadioButton({ checked, label, muiRadioButtonProps, value, error }: RadioButtonProps) {
+function RadioButton({
+  checked,
+  label,
+  muiRadioButtonProps,
+  value,
+  disabled,
+  error,
+}: RadioButtonProps) {
   return (
     <StyledRadioButton error={error}>
       <FormControlLabel
         value={value}
-        className={`${classes.radioWrapper} ${checked ? classes.checked : null}`}
-        sx={checked ? {} : undefined}
+        disabled={disabled}
+        sx={disabled ? { backgroundColor: '#e0e0e0', opacity: 0.7 } : {}}
+        className={`${classes.radioWrapper} ${checked && !disabled ? classes.checked : null}`}
         label={
           <Typography className={classes.label} sx={{ wordBreak: 'break-word' }}>
             {label}
@@ -84,6 +92,7 @@ function RadioButton({ checked, label, muiRadioButtonProps, value, error }: Radi
         }
         control={
           <Radio
+            disabled={disabled}
             icon={<div className={`${classes.circle}`} />}
             checkedIcon={
               <Check color="primary" className={checked ? classes.checkIcon : undefined} />