Create/edit constraint adjustments

frontend/src/component/common/ConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/ConstraintAccordionEditBody.styles.ts

@@ -3,7 +3,7 @@ import {makeStyles} from 'tss-react/mui';
 export const useStyles = makeStyles()(theme => ({
     inputContainer: {
         padding: '1rem',
-        backgroundColor: theme.palette.grey[100]
+        backgroundColor: theme.palette.grey[100],
     },
     buttonContainer: {
         display: 'flex',

frontend/src/component/common/ConstraintAccordion/ConstraintAccordionEdit/StyledToggleButton/CaseSensitiveButton/CaseSensitiveButton.tsx

@@ -19,33 +19,28 @@ export const CaseSensitiveButton = ({
     setCaseInsensitive,
 }: CaseSensitiveButtonProps) => {
     return (
-        <Tooltip
-            title={
-                localConstraint.caseInsensitive
-                    ? 'Make it case sensitive'
-                    : 'Remove case sensitive'
-            }
-            arrow
-        >
         <ConditionallyRender
             condition={Boolean(localConstraint.caseInsensitive)}
             show={
+                <Tooltip title="Make it case sensitive" arrow>
                     <StyledToggleButtonOff
                         onClick={setCaseInsensitive}
                         disableRipple
                     >
                         <CaseSensitiveOff />
                     </StyledToggleButtonOff>
+                </Tooltip>
             }
             elseShow={
+                <Tooltip title="Remove case sensitive" arrow>
                     <StyledToggleButtonOn
                         onClick={setCaseInsensitive}
                         disableRipple
                     >
                         <CaseSensitive />
                     </StyledToggleButtonOn>
+                </Tooltip>
             }
         />
-        </Tooltip>
     );
 };