fix: remove loadingText prop

.vscode/settings.json

@@ -1,7 +1,7 @@
 {
   "typescript.tsdk": "node_modules/typescript/lib",
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
+    "source.fixAll.eslint": "explicit"
   },
   "eslint.validate": ["typescript", "typescriptreact", "javascript", "javascriptreact"],
   "javascript.preferences.importModuleSpecifier": "non-relative",

apps/web/src/components/forms/forgot-password.tsx

@@ -82,8 +82,8 @@ export const ForgotPasswordForm = ({ className }: ForgotPasswordFormProps) => {
           />
         </fieldset>
 
-        <Button size="lg" loading={isSubmitting} loadingText="Sending Reset Email...">
+        <Button size="lg" loading={isSubmitting}>
-          Reset Password
+          {isSubmitting ? 'Sending Reset Email...' : 'Reset Password'}
         </Button>
       </form>
     </Form>

apps/web/src/components/forms/password.tsx

@@ -4,7 +4,7 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
-import { User } from '@documenso/prisma/client';
+import type { User } from '@documenso/prisma/client';
 import { TRPCClientError } from '@documenso/trpc/client';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -146,8 +146,8 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
         </fieldset>
 
         <div className="mt-4">
-          <Button type="submit" loadingText="Updating password..." loading={isSubmitting}>
+          <Button type="submit" loading={isSubmitting}>
-            Update password
+            {isSubmitting ? 'Updating password...' : 'Update password'}
           </Button>
         </div>
       </form>

apps/web/src/components/forms/profile.tsx

@@ -6,7 +6,7 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
-import { User } from '@documenso/prisma/client';
+import type { User } from '@documenso/prisma/client';
 import { TRPCClientError } from '@documenso/trpc/client';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -133,8 +133,8 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
           />
         </fieldset>
 
-        <Button type="submit" loadingText="Updating profile..." loading={isSubmitting}>
+        <Button type="submit" loading={isSubmitting}>
-          Update profile
+          {isSubmitting ? 'Updating profile...' : 'Update profile'}
         </Button>
       </form>
     </Form>

apps/web/src/components/forms/reset-password.tsx

@@ -125,8 +125,8 @@ export const ResetPasswordForm = ({ className, token }: ResetPasswordFormProps)
           />
         </fieldset>
 
-        <Button type="submit" loadingText="Resetting Password..." size="lg" loading={isSubmitting}>
+        <Button type="submit" size="lg" loading={isSubmitting}>
-          Reset Password
+          {isSubmitting ? 'Resetting Password...' : 'Reset Password'}
         </Button>
       </form>
     </Form>

apps/web/src/components/forms/signin.tsx

@@ -199,9 +199,8 @@ export const SignInForm = ({ className }: SignInFormProps) => {
           size="lg"
           loading={isSubmitting}
           className="dark:bg-documenso dark:hover:opacity-90"
-          loadingText="Signing in..."
         >
-          Sign In
+          {isSubmitting ? 'Signing in...' : 'Sign In'}
         </Button>
 
         <div className="relative flex items-center justify-center gap-x-4 py-2 text-xs uppercase">
@@ -275,8 +274,8 @@ export const SignInForm = ({ className }: SignInFormProps) => {
                 {twoFactorAuthenticationMethod === 'totp' ? 'Use Backup Code' : 'Use Authenticator'}
               </Button>
 
-              <Button type="submit" loadingText="Signing in..." loading={isSubmitting}>
+              <Button type="submit" loading={isSubmitting}>
-                Sign In
+                {isSubmitting ? 'Signing in...' : 'Sign In'}
               </Button>
             </div>
           </form>

apps/web/src/components/forms/signup.tsx

@@ -162,10 +162,9 @@ export const SignUpForm = ({ className }: SignUpFormProps) => {
           type="submit"
           size="lg"
           loading={isSubmitting}
-          loadingText="Signing up..."
           className="dark:bg-documenso dark:hover:opacity-90"
         >
-          Sign Up
+          {isSubmitting ? 'Signing up...' : 'Sign Up'}
         </Button>
       </form>
     </Form>

packages/ui/primitives/button.tsx

@@ -1,7 +1,8 @@
 import * as React from 'react';
 
 import { Slot } from '@radix-ui/react-slot';
-import { VariantProps, cva } from 'class-variance-authority';
+import type { VariantProps } from 'class-variance-authority';
+import { cva } from 'class-variance-authority';
 import { Loader } from 'lucide-react';
 
 import { cn } from '../lib/utils';
@@ -53,15 +54,10 @@ export interface ButtonProps
    * Will display the loading spinner and disable the button.
    */
   loading?: boolean;
-
-  /**
-   * The label to show in the button when `isLoading` is true
-   */
-  loadingText?: string;
 }
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ className, variant, size, asChild = false, loadingText, loading, ...props }, ref) => {
+  ({ className, variant, size, asChild = false, loading, ...props }, ref) => {
     if (asChild) {
       return (
         <Slot className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
@@ -79,7 +75,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
         disabled={isDisabled}
       >
         {isLoading && <Loader className={cn('mr-2 animate-spin', loaderVariants({ size }))} />}
-        {isLoading && loadingText ? loadingText : props.children}
+        {props.children}
       </button>
     );
   },