better separation of read-only fields from form fields on profile page

This commit is contained in:
Athou
2023-05-26 08:31:30 +02:00
parent f7ad9c9905
commit c20379f376

View File

@@ -80,6 +80,9 @@ export function ProfileSettings() {
<Input.Wrapper label={<Trans>User name</Trans>}> <Input.Wrapper label={<Trans>User name</Trans>}>
<Box>{profile?.name}</Box> <Box>{profile?.name}</Box>
</Input.Wrapper> </Input.Wrapper>
<TextInput label={<Trans>API key</Trans>} readOnly value={profile?.apiKey} />
<Input.Wrapper <Input.Wrapper
label={<Trans>OPML export</Trans>} label={<Trans>OPML export</Trans>}
description={ description={
@@ -94,6 +97,9 @@ export function ProfileSettings() {
</Anchor> </Anchor>
</Box> </Box>
</Input.Wrapper> </Input.Wrapper>
<Divider />
<PasswordInput <PasswordInput
label={<Trans>Current password</Trans>} label={<Trans>Current password</Trans>}
description={<Trans>Enter your current password to change profile settings</Trans>} description={<Trans>Enter your current password to change profile settings</Trans>}
@@ -107,7 +113,6 @@ export function ProfileSettings() {
{...form.getInputProps("newPassword")} {...form.getInputProps("newPassword")}
/> />
<PasswordInput label={<Trans>Confirm password</Trans>} {...form.getInputProps("newPasswordConfirmation")} /> <PasswordInput label={<Trans>Confirm password</Trans>} {...form.getInputProps("newPasswordConfirmation")} />
<TextInput label={<Trans>API key</Trans>} readOnly value={profile?.apiKey} />
<Checkbox label={<Trans>Generate new API key</Trans>} {...form.getInputProps("newApiKey", { type: "checkbox" })} /> <Checkbox label={<Trans>Generate new API key</Trans>} {...form.getInputProps("newApiKey", { type: "checkbox" })} />
<Group> <Group>