1
0
mirror of https://github.com/pocket-id/pocket-id.git synced 2026-03-22 16:45:08 +00:00

feat: allow first name and display name to be optional (#1288)

Co-authored-by: Kyle Mendell <kmendell@ofkm.us>
This commit is contained in:
taoso
2026-03-04 05:37:39 +08:00
committed by GitHub
parent d7f19ad5e5
commit 8fecc22888
10 changed files with 56 additions and 30 deletions

View File

@@ -26,7 +26,7 @@
};
const formSchema = z.object({
firstName: z.string().min(1).max(50),
firstName: z.string().max(50),
lastName: emptyToUndefined(z.string().max(50).optional()),
username: usernameSchema,
email: get(appConfigStore).requireUserEmail ? z.email() : emptyToUndefined(z.email().optional())
@@ -52,12 +52,12 @@
<form id="sign-up-form" onsubmit={preventDefault(onSubmit)} class="w-full">
<div class="mt-7 space-y-4">
<FormInput label={m.username()} bind:input={$inputs.username} />
<FormInput label={m.email()} bind:input={$inputs.email} type="email" />
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<FormInput label={m.first_name()} bind:input={$inputs.firstName} />
<FormInput label={m.last_name()} bind:input={$inputs.lastName} />
</div>
<FormInput label={m.username()} bind:input={$inputs.username} />
<FormInput label={m.email()} bind:input={$inputs.email} type="email" />
</div>
</form>

View File

@@ -122,6 +122,11 @@ export function createForm<T extends z.ZodType<any, any>>(schema: T, initialValu
}
function isRequired(fieldSchema: z.ZodTypeAny): boolean {
// Handle string allow empty
if (fieldSchema instanceof z.ZodString) {
return fieldSchema.minLength !== null && fieldSchema.minLength > 0;
}
// Handle unions like callbackUrlSchema
if (fieldSchema instanceof z.ZodUnion) {
return !fieldSchema.def.options.some((o: any) => {
@@ -138,6 +143,7 @@ export function createForm<T extends z.ZodType<any, any>>(schema: T, initialValu
if (fieldSchema instanceof z.ZodOptional || fieldSchema instanceof z.ZodDefault) {
return false;
}
return true;
}

View File

@@ -35,9 +35,9 @@
const userService = new UserService();
const formSchema = z.object({
firstName: z.string().min(1).max(50),
firstName: z.string().max(50),
lastName: emptyToUndefined(z.string().max(50).optional()),
displayName: z.string().min(1).max(100),
displayName: z.string().max(100),
username: usernameSchema,
email: get(appConfigStore).requireUserEmail ? z.email() : emptyToUndefined(z.email().optional())
});
@@ -52,7 +52,7 @@
if (!hasManualDisplayNameEdit) {
$inputs.displayName.value = `${$inputs.firstName.value}${
$inputs.lastName?.value ? ' ' + $inputs.lastName.value : ''
}`;
}`.trim();
}
}
@@ -91,6 +91,8 @@
<fieldset disabled={userInfoInputDisabled}>
<Field.Group class="grid grid-cols-1 gap-4 sm:grid-cols-2">
<FormInput label={m.username()} bind:input={$inputs.username} />
<FormInput label={m.email()} type="email" bind:input={$inputs.email} />
<FormInput label={m.first_name()} bind:input={$inputs.firstName} onInput={onNameInput} />
<FormInput label={m.last_name()} bind:input={$inputs.lastName} onInput={onNameInput} />
<FormInput
@@ -98,8 +100,6 @@
bind:input={$inputs.displayName}
onInput={() => (hasManualDisplayNameEdit = true)}
/>
<FormInput label={m.username()} bind:input={$inputs.username} />
<FormInput label={m.email()} type="email" bind:input={$inputs.email} />
</Field.Group>
<div class="flex justify-end pt-4">

View File

@@ -40,9 +40,9 @@
};
const formSchema = z.object({
firstName: z.string().min(1).max(50),
firstName: z.string().max(50),
lastName: emptyToUndefined(z.string().max(50).optional()),
displayName: z.string().min(1).max(100),
displayName: z.string().max(100),
username: usernameSchema,
email: get(appConfigStore).requireUserEmail
? z.email()
@@ -67,7 +67,7 @@
if (!hasManualDisplayNameEdit) {
$inputs.displayName.value = `${$inputs.firstName.value}${
$inputs.lastName?.value ? ' ' + $inputs.lastName.value : ''
}`;
}`.trim();
}
}
</script>
@@ -75,13 +75,6 @@
<form onsubmit={preventDefault(onSubmit)}>
<fieldset disabled={inputDisabled}>
<div class="grid grid-cols-1 items-start gap-5 md:grid-cols-2">
<FormInput label={m.first_name()} oninput={onNameInput} bind:input={$inputs.firstName} />
<FormInput label={m.last_name()} oninput={onNameInput} bind:input={$inputs.lastName} />
<FormInput
label={m.display_name()}
oninput={() => (hasManualDisplayNameEdit = true)}
bind:input={$inputs.displayName}
/>
<FormInput label={m.username()} bind:input={$inputs.username} />
<div class="flex items-end">
<FormInput
@@ -111,6 +104,13 @@
</Tooltip.Root>
</Tooltip.Provider>
</div>
<FormInput label={m.first_name()} oninput={onNameInput} bind:input={$inputs.firstName} />
<FormInput label={m.last_name()} oninput={onNameInput} bind:input={$inputs.lastName} />
<FormInput
label={m.display_name()}
oninput={() => (hasManualDisplayNameEdit = true)}
bind:input={$inputs.displayName}
/>
</div>
<div class="mt-5 grid grid-cols-1 items-start gap-5 md:grid-cols-2">
<SwitchWithLabel