From c99865ce7fc8f5e290f460ebeb91fcac1f5e9a58 Mon Sep 17 00:00:00 2001
From: Yourz <crazilou@vip.qq.com>
Date: Thu, 11 Dec 2025 22:47:41 +0800
Subject: [PATCH] fix: disable the sign up and sign in button when form is
 invalid (#7376)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

<!-- One sentence describing what changed and why. -->

Add a disabled state to the sign-up button in the cloud onboarding
views. The button should be disabled when the form is invalid to prevent
users from submitting incomplete or incorrectly formatted information.

## Changes

- **What**: <!-- Core functionality added/modified -->
- Add disabled state to SignUp button and SignIn button when SignUp or
SignIn form is invalid.
- **Breaking**: <!-- Any breaking changes (if none, remove this line)
-->
- **Dependencies**: <!-- New dependencies (if none, remove this line)
-->

## Review Focus

<!-- Critical design decisions or edge cases that need attention -->

Changes for this notion:
https://www.notion.so/comfy-org/Implement-Disable-sign-up-button-when-form-is-invalid-in-cloud-onboarding-2c56d73d365081edbf8bf06b1f5e52e5

<!-- If this PR fixes an issue, uncomment and update the line below -->
<!-- Fixes #ISSUE_NUMBER -->

## Screenshots (if applicable)
Sign In button

Before(button not disabled when email is invalid)
![Kapture 2025-12-11 at 22 30
59](https://github.com/user-attachments/assets/4278473b-350e-4fea-a299-199697c354b7)

After
![Kapture 2025-12-11 at 22 28
45](https://github.com/user-attachments/assets/b677a444-39ce-487c-a2ad-31369585e333)

<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7376-fix-disable-the-sign-up-and-sign-in-button-when-form-is-invalid-2c66d73d36508139af44cd7cb1e1aeb9)
by [Unito](https://www.unito.io)

---------

Co-authored-by: GitHub Action <action@github.com>
---
 src/components/dialog/content/signin/SignInForm.vue          | 1 +
 src/components/dialog/content/signin/SignUpForm.vue          | 2 ++
 src/platform/cloud/onboarding/components/CloudSignInForm.vue | 1 +
 3 files changed, 4 insertions(+)

diff --git a/src/components/dialog/content/signin/SignInForm.vue b/src/components/dialog/content/signin/SignInForm.vue
index 23f955b71..23922878c 100644
--- a/src/components/dialog/content/signin/SignInForm.vue
+++ b/src/components/dialog/content/signin/SignInForm.vue
@@ -66,6 +66,7 @@
       type="submit"
       :label="t('auth.login.loginButton')"
       class="mt-4 h-10 font-medium"
+      :disabled="!$form.valid"
     />
   </Form>
 </template>
diff --git a/src/components/dialog/content/signin/SignUpForm.vue b/src/components/dialog/content/signin/SignUpForm.vue
index 6d5f3b48c..1f174d4cd 100644
--- a/src/components/dialog/content/signin/SignUpForm.vue
+++ b/src/components/dialog/content/signin/SignUpForm.vue
@@ -1,5 +1,6 @@
 <template>
   <Form
+    v-slot="$form"
     class="flex flex-col gap-6"
     :resolver="zodResolver(signUpSchema)"
     @submit="onSubmit"
@@ -34,6 +35,7 @@
       type="submit"
       :label="t('auth.signup.signUpButton')"
       class="mt-4 h-10 font-medium"
+      :disabled="!$form.valid"
     />
   </Form>
 </template>
diff --git a/src/platform/cloud/onboarding/components/CloudSignInForm.vue b/src/platform/cloud/onboarding/components/CloudSignInForm.vue
index a7c85971d..b2874914c 100644
--- a/src/platform/cloud/onboarding/components/CloudSignInForm.vue
+++ b/src/platform/cloud/onboarding/components/CloudSignInForm.vue
@@ -69,6 +69,7 @@
       type="submit"
       :label="t('auth.login.loginButton')"
       class="mt-4 h-10 font-medium text-white"
+      :disabled="!$form.valid"
     />
   </Form>
 </template>