Animate between IconX and IconReload (#13949)

Closes #13866 

An animation of 150ms has been introduced to all icons that are rendered
inside `OverridableCheckbox`. Attaching a recording of the same.
[Loom
Recording](https://www.loom.com/share/65293c13171a4bf8934c577eecbca9a0)

packages/twenty-front/src/modules/settings/roles/role-permissions/object-level-permissions/object-form/components/OverridableCheckbox.tsx

@@ -2,6 +2,7 @@ import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { IconReload, IconX } from 'twenty-ui/display';
 import { Checkbox } from 'twenty-ui/input';
+import { AnimatedRotate } from 'twenty-ui/utilities';
 
 export type OverridableCheckboxType = 'default' | 'override' | 'no_cta';
 
@@ -60,10 +61,12 @@ export const OverridableCheckbox = ({
               isDisabled={disabled}
             >
               {!disabled && (
-                <IconX
-                  size={theme.icon.size.md}
-                  color={theme.font.color.secondary}
-                />
+                <AnimatedRotate>
+                  <IconX
+                    size={theme.icon.size.md}
+                    color={theme.font.color.secondary}
+                  />
+                </AnimatedRotate>
               )}
             </StyledIconWrapper>
           </StyledOverridableCheckboxContainerItem>
@@ -79,17 +82,25 @@ export const OverridableCheckbox = ({
               onClick={disabled ? undefined : onChange}
               isDisabled={disabled}
             >
-              <IconReload
-                size={theme.icon.size.md}
-                color={theme.adaptiveColors.orange4}
-              />
+              <AnimatedRotate animateOnHover>
+                <IconReload
+                  size={theme.icon.size.md}
+                  color={theme.adaptiveColors.orange4}
+                />
+              </AnimatedRotate>
             </StyledIconWrapper>
           </StyledOverridableCheckboxContainerItem>
         </>
       )}
       {type === 'no_cta' && (
         <StyledOverridableCheckboxContainerItem>
-          <Checkbox checked={checked} disabled={disabled} onChange={onChange} />
+          <AnimatedRotate>
+            <Checkbox
+              checked={checked}
+              disabled={disabled}
+              onChange={onChange}
+            />
+          </AnimatedRotate>
         </StyledOverridableCheckboxContainerItem>
       )}
     </StyledOverridableCheckboxContainer>