fix(SchemaForm): Extending the Button component

ui/src/components/SchemaForm/components/Button.tsx

@@ -1,5 +1,5 @@
 import React, { FC, useState } from 'react';
-import { Button } from 'react-bootstrap';
+import { Button, ButtonProps } from 'react-bootstrap';
 
 import { request } from '@/utils';
 import type * as Type from '@/common/interface';
@@ -11,14 +11,18 @@ interface Props {
   action: UIAction | undefined;
   formData: Type.FormDataType;
   readOnly: boolean;
+  variant?: ButtonProps['variant'];
+  size?: ButtonProps['size'];
 }
 const Index: FC<Props> = ({
   fieldName,
   action,
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   formData,
-  readOnly = false,
   text = '',
+  readOnly = false,
+  variant = 'primary',
+  size,
 }) => {
   const [isLoading, setLoading] = useState(false);
   const handleAction = async () => {
@@ -33,7 +37,12 @@ const Index: FC<Props> = ({
   const disabled = isLoading || readOnly;
   return (
     <div className="d-flex">
-      <Button name={fieldName} onClick={handleAction} disabled={disabled}>
+      <Button
+        name={fieldName}
+        onClick={handleAction}
+        disabled={disabled}
+        size={size}
+        variant={variant}>
         {text || fieldName}
         {isLoading ? '...' : ''}
       </Button>

ui/src/components/SchemaForm/index.tsx

@@ -4,7 +4,7 @@ import React, {
   useImperativeHandle,
   useEffect,
 } from 'react';
-import { Form, Button } from 'react-bootstrap';
+import { Form, Button, ButtonProps } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
 
 import classnames from 'classnames';
@@ -100,6 +100,8 @@ export interface ButtonOptions extends BaseUIOptions {
   text: string;
   icon?: string;
   action?: UIAction;
+  variant?: ButtonProps['variant'];
+  size?: ButtonProps['size'];
 }
 
 export type UIOptions =
@@ -439,6 +441,10 @@ const SchemaForm: ForwardRefRenderFunction<IRef, IProps> = (
                 action={uiOpt && 'action' in uiOpt ? uiOpt.action : undefined}
                 formData={formData}
                 readOnly={readOnly}
+                variant={
+                  uiOpt && 'variant' in uiOpt ? uiOpt.variant : undefined
+                }
+                size={uiOpt && 'size' in uiOpt ? uiOpt.size : undefined}
               />
             ) : null}
             {/* Unified handling of `Feedback` and `Text` */}

ui/src/pages/Users/Login/index.tsx

@@ -16,7 +16,7 @@ import {
   loginSettingStore,
   userCenterStore,
 } from '@/stores';
-import { guard, handleFormError } from '@/utils';
+import { floppyNavigation, guard, handleFormError, userCenter } from '@/utils';
 import { login, checkImgCode, UcAgent } from '@/services';
 import { PicAuthCodeModal } from '@/components/Modal';
 
@@ -246,7 +246,10 @@ const Index: React.FC = () => {
             <div className="text-center mt-5">
               <Trans i18nKey="login.info_sign" ns="translation">
                 Don’t have an account?
-                <Link to="/users/register" tabIndex={2}>
+                <Link
+                  to={userCenter.getSignUpUrl()}
+                  tabIndex={2}
+                  onClick={floppyNavigation.handleRouteLinkClick}>
                   Sign up
                 </Link>
               </Trans>