scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/loy-513-update-edit-profile-button-positions (pull request #3447)

Browse Source 
feat(LOY-513): Update button positions and simplify css

* Update button positions and simplify css


Approved-by: Matilda Landström
This commit is contained in:
Anton Gunnarsson
2026-01-16 09:03:44 +00:00
parent 7639daf792
commit 8f7c1d80ab
4 changed files with 83 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
apps/scandic-web/components/Forms/Edit/Profile/index.tsx
View File

@@ -122,79 +122,73 @@ export default function Form({ user }: EditFormProps) {
}, [trigger])
return (
<>
<section className={styles.container}>
<div className={styles.title}>
<Typography variant="Title/sm">
<span>
<h1 className={styles.welcome}>
{intl.formatMessage({
id: "common.welcome",
defaultMessage: "Welcome",
})}
</h1>
<h2 data-hj-suppress className={styles.name}>
{user.name}
</h2>
</span>
</Typography>
</div>
<div className={styles.btnContainer}>
<Dialog
bodyText={intl.formatMessage({
id: "editProfile.discardChangesDescription",
defaultMessage: "Any changes you've made will be lost.",
})}
cancelButtonText={intl.formatMessage({
id: "editProfile.goBackToEdit",
defaultMessage: "Go back to edit",
})}
proceedHref={profile[lang]}
proceedText={intl.formatMessage({
id: "editProfile.yesDiscardChanges",
defaultMessage: "Yes, discard changes",
})}
titleText={intl.formatMessage({
id: "editProfile.discardChangesTitle",
defaultMessage: "Discard unsaved changes?",
})}
trigger={
<Button variant="Secondary" size="sm" color="Primary">
{intl.formatMessage({
id: "editProfile.discardChanges",
defaultMessage: "Discard changes",
})}
</Button>
}
/>
<Button
isDisabled={!isValid || methods.formState.isSubmitting}
form={formId}
variant="Primary"
size="sm"
color="Primary"
type="submit"
>
<section className={styles.container}>
<Typography variant="Title/sm">
<span>
<h1 className={styles.welcome}>
{intl.formatMessage({
id: "common.save",
defaultMessage: "Save",
id: "common.welcome",
defaultMessage: "Welcome",
})}
</Button>
</div>
<form
/* @ts-expect-error Ignoring since ts doesn't recognize that tRPC parses FormData before reaching the route */
action={editProfile}
className={styles.form}
id={formId}
onSubmit={methods.handleSubmit(handleSubmit)}
>
<FormProvider {...methods}>
<FormContent errors={methods.formState.errors} />
</FormProvider>
</form>
</section>
</h1>
<h2 data-hj-suppress className={styles.name}>
{user.name}
</h2>
</span>
</Typography>
<form
/* @ts-expect-error Ignoring since ts doesn't recognize that tRPC parses FormData before reaching the route */
action={editProfile}
id={formId}
onSubmit={methods.handleSubmit(handleSubmit)}
>
<FormProvider {...methods}>
<FormContent errors={methods.formState.errors} />
</FormProvider>
</form>
<ChangeNameDisclaimer />
</>
<div className={styles.btnContainer}>
<Dialog
bodyText={intl.formatMessage({
id: "editProfile.discardChangesDescription",
defaultMessage: "Any changes you've made will be lost.",
})}
cancelButtonText={intl.formatMessage({
id: "editProfile.goBackToEdit",
defaultMessage: "Go back to edit",
})}
proceedHref={profile[lang]}
proceedText={intl.formatMessage({
id: "editProfile.yesDiscardChanges",
defaultMessage: "Yes, discard changes",
})}
titleText={intl.formatMessage({
id: "editProfile.discardChangesTitle",
defaultMessage: "Discard unsaved changes?",
})}
trigger={
<Button variant="Secondary" size="sm" color="Primary">
{intl.formatMessage({
id: "editProfile.discardChanges",
defaultMessage: "Discard changes",
})}
</Button>
}
/>
<Button
isDisabled={!isValid || methods.formState.isSubmitting}
form={formId}
variant="Primary"
size="sm"
color="Primary"
type="submit"
>
{intl.formatMessage({
id: "common.save",
defaultMessage: "Save",
})}
</Button>
</div>
</section>
)
}