refactor(forms): validate the schema form before page-level checks

The backup create pages ran SchemaForm.validate() only after their manual
required-field alerts, so a schema-required field left empty exited via an
alert without RJSF ever rendering its inline errors. Run validate() right
after the name check, before the page-level alerts, so inline errors show
consistently and the alerts only cover page-only requirements.

Assisted-By: Claude <noreply@anthropic.com>
Signed-off-by: Aleksei Sviridkin <f@lex.la>

Author: lexfrei

apps/console/src/routes/BackupCreatePage.tsx

@@ -80,6 +80,10 @@ export function BackupCreatePage() {
       return
     }
 
+    // Run RJSF validation before the page-level checks so schema-required
+    // fields render inline errors instead of being masked by the alerts below.
+    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
+
     if (!formData.applicationRef?.kind || !formData.applicationRef?.name) {
       alert("Application reference is required")
       return
@@ -95,10 +99,6 @@ export function BackupCreatePage() {
       return
     }
 
-    // The submit button lives outside RJSF and bypasses its validation, so
-    // trigger it explicitly; an invalid spec renders errors inline and aborts.
-    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
-
     const resource = {
       apiVersion: "backups.cozystack.io/v1alpha1",
       kind: "Backup",

apps/console/src/routes/BackupJobCreatePage.tsx

@@ -120,6 +120,10 @@ export function BackupJobCreatePage() {
       return
     }
 
+    // Run RJSF validation before the page-level checks so schema-required
+    // fields render inline errors instead of being masked by the alerts below.
+    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
+
     if (!formData.applicationRef?.kind || !formData.applicationRef?.name) {
       alert("Application reference is required")
       return
@@ -130,10 +134,6 @@ export function BackupJobCreatePage() {
       return
     }
 
-    // The submit button lives outside RJSF and bypasses its validation, so
-    // trigger it explicitly; an invalid spec renders errors inline and aborts.
-    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
-
     // planRef is optional metadata recording which Plan triggered the job. The
     // dropdown ships an empty sentinel; strip it so the API never receives
     // `planRef: { name: "" }`, which would otherwise round-trip as a malformed

apps/console/src/routes/BackupPlanCreatePage.tsx

@@ -114,6 +114,10 @@ export function BackupPlanCreatePage() {
       return
     }
 
+    // Run RJSF validation before the page-level checks so schema-required
+    // fields render inline errors instead of being masked by the alerts below.
+    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
+
     if (!formData.applicationRef?.kind || !formData.applicationRef?.name) {
       alert("Application reference is required")
       return
@@ -124,10 +128,6 @@ export function BackupPlanCreatePage() {
       return
     }
 
-    // The submit button lives outside RJSF and bypasses its validation, so
-    // trigger it explicitly; an invalid spec renders errors inline and aborts.
-    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
-
     const resource = {
       apiVersion: "backups.cozystack.io/v1alpha1",
       kind: "Plan",

apps/console/src/routes/BackupRestoreJobCreatePage.tsx

@@ -133,6 +133,10 @@ export function BackupRestoreJobCreatePage() {
       return
     }
 
+    // Run RJSF validation before the page-level checks so schema-required
+    // fields render inline errors instead of being masked by the alerts below.
+    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
+
     if (!formData.backupRef?.name) {
       alert("Backup reference is required")
       return
@@ -149,10 +153,6 @@ export function BackupRestoreJobCreatePage() {
       return
     }
 
-    // The submit button lives outside RJSF and bypasses its validation, so
-    // trigger it explicitly; an invalid spec renders errors inline and aborts.
-    if (schemaFormRef.current && !schemaFormRef.current.validate()) return
-
     // Strip an empty targetApplicationRef so the API does not receive an empty
     // object that the API server would reject as malformed.
     const spec = { ...formData }