From ca8bcfb81b000bc51a816420734ce96e303a5510 Mon Sep 17 00:00:00 2001
From: BOUTIER Charly <charly.boutier@rte-france.com>
Date: Tue, 23 Jan 2024 17:53:39 +0100
Subject: [PATCH] Use the correct styling method to define theme for a
 commons-ui component

Signed-off-by: BOUTIER Charly <charly.boutier@rte-france.com>
---
 .../react-hook-form/utils/cancel-button.js           | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/components/react-hook-form/utils/cancel-button.js b/src/components/react-hook-form/utils/cancel-button.js
index b7cb3288..324dba15 100644
--- a/src/components/react-hook-form/utils/cancel-button.js
+++ b/src/components/react-hook-form/utils/cancel-button.js
@@ -9,16 +9,12 @@ import React from 'react';
 import { Button } from '@mui/material';
 import { FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
+import { useThemeProps } from '@mui/material/styles';
 
-const styles = {
-    cancelButton: (theme) => ({
-        color: theme.palette.text.secondary,
-    }),
-};
-
-const CancelButton = ({ ...buttonProps }) => {
+const CancelButton = ({ ...inProps }) => {
+    const props = useThemeProps({ props: inProps, name: 'CancelButton' });
     return (
-        <Button sx={styles.cancelButton} {...buttonProps}>
+        <Button {...props}>
             <FormattedMessage id="cancel" />
         </Button>
     );