From 13f6f2a451feede8037d18cfbac64843e108ccbd Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Sat, 29 Jul 2023 18:26:24 +0800
Subject: ...

---
 FrontEnd/src/views/common/button/LoadingButton.tsx | 20 +++++++++-----------
 1 file changed, 9 insertions(+), 11 deletions(-)

(limited to 'FrontEnd/src/views/common/button/LoadingButton.tsx')

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;
-- 
cgit v1.2.3

