diff options
Diffstat (limited to 'FrontEnd/src/views/common/button/LoadingButton.tsx')
-rw-r--r-- | FrontEnd/src/views/common/button/LoadingButton.tsx | 20 |
1 files changed, 9 insertions, 11 deletions
diff --git a/FrontEnd/src/views/common/button/LoadingButton.tsx b/FrontEnd/src/views/common/button/LoadingButton.tsx index 249f3e1d..f23369de 100644 --- a/FrontEnd/src/views/common/button/LoadingButton.tsx +++ b/FrontEnd/src/views/common/button/LoadingButton.tsx @@ -1,19 +1,19 @@ -import * as React from "react"; import classNames from "classnames"; -import { useTranslation } from "react-i18next"; -import { I18nText, ThemeColor, convertI18nText } from "../common"; +import { I18nText, ThemeColor, useC } from "../common"; import Spinner from "../Spinner"; +import "./LoadingButton.css"; + interface LoadingButtonProps extends React.ComponentPropsWithoutRef<"button"> { color?: ThemeColor; text?: I18nText; loading?: boolean; } -function LoadingButton(props: LoadingButtonProps): JSX.Element { - const { t } = useTranslation(); +export default function LoadingButton(props: LoadingButtonProps) { + const c = useC(); const { color, text, loading, className, children, ...otherProps } = props; @@ -23,17 +23,15 @@ function LoadingButton(props: LoadingButtonProps): JSX.Element { return ( <button + disabled={loading} className={classNames( - "cru-" + (color ?? "primary"), - "cru-button outline", + `cru-${color ?? "primary"} cru-button outline cru-loading-button`, className, )} {...otherProps} > - {text != null ? convertI18nText(text, t) : children} - {loading && <Spinner />} + {text != null ? c(text) : children} + {loading && <Spinner className="cru-loading-button-spinner" />} </button> ); } - -export default LoadingButton; |