diff --git a/apps/nextjs/src/app/[locale]/manage/users/create/_components/create-user-stepper.tsx b/apps/nextjs/src/app/[locale]/manage/users/create/_components/create-user-stepper.tsx index dc4f1a7c3..e91cd3dfe 100644 --- a/apps/nextjs/src/app/[locale]/manage/users/create/_components/create-user-stepper.tsx +++ b/apps/nextjs/src/app/[locale]/manage/users/create/_components/create-user-stepper.tsx @@ -1,6 +1,6 @@ "use client"; -import { startTransition, useCallback, useMemo, useState } from "react"; +import { startTransition, useCallback, useState } from "react"; import { Badge, Button, @@ -20,8 +20,9 @@ import { IconPlus, IconUserCheck } from "@tabler/icons-react"; import { z } from "zod/v4"; import { clientApi } from "@homarr/api/client"; -import { everyoneGroup, groupPermissions } from "@homarr/definitions"; import type { GroupPermissionKey } from "@homarr/definitions"; +import { everyoneGroup, groupPermissions } from "@homarr/definitions"; +import type { IsValid } from "@homarr/form"; import { useZodForm } from "@homarr/form"; import { useModalAction } from "@homarr/modals"; import { showErrorNotification } from "@homarr/notifications"; @@ -113,11 +114,9 @@ export const UserCreateStepperComponent = ({ initialGroups }: UserCreateStepperC }, ); - const allForms = useMemo(() => [generalForm, securityForm, groupsForm], [generalForm, securityForm, groupsForm]); - - const activeForm = allForms[active]; - const isCurrentFormValid = activeForm ? activeForm.isValid : () => true; - const canNavigateToNextStep = isCurrentFormValid(); + const allForms = [generalForm, securityForm, groupsForm]; + const isValidCallback: IsValid | undefined = allForms[active]?.isValid; + const currentFormValid = isValidCallback?.() ?? true; const controlledGoToNextStep = useCallback(async () => { if (active + 1 === stepperMax) { @@ -218,7 +217,7 @@ export const UserCreateStepperComponent = ({ initialGroups }: UserCreateStepperC