diff --git a/frontend/css/axe_form_styles.css b/frontend/css/axe_form_styles.css index 3ec5b8241..2b90b52cb 100644 --- a/frontend/css/axe_form_styles.css +++ b/frontend/css/axe_form_styles.css @@ -6,6 +6,15 @@ width: 100%; } -.form-input { +.vertically-compact { + padding-top: 1px; + padding-bottom: 1px; +} + +.axe-fields > * { min-width: min(70vw, 300px); +} + +.space-after-fields { + max-width: min(70vw, 300px); } \ No newline at end of file diff --git a/frontend/css/common_styles.css b/frontend/css/common_styles.css index 1de36d8c9..eb42258ca 100644 --- a/frontend/css/common_styles.css +++ b/frontend/css/common_styles.css @@ -209,3 +209,7 @@ vaadin-drawer-toggle { vaadin-icon[icon="vaadin:sign-in"] { padding-left: 0 !important; } + +.green { + color: green; +} \ No newline at end of file diff --git a/frontend/css/forgot_password_page.css b/frontend/css/forgot_password_page.css new file mode 100644 index 000000000..eaad35b3c --- /dev/null +++ b/frontend/css/forgot_password_page.css @@ -0,0 +1,3 @@ +.result-span { + padding-left: 1rem; +} \ No newline at end of file diff --git a/frontend/css/login_page.css b/frontend/css/login_page.css index 9d15db2f6..b206f55bb 100644 --- a/frontend/css/login_page.css +++ b/frontend/css/login_page.css @@ -2,8 +2,3 @@ text-align: center; width: 100%; } - -.vertically-compact { - padding-top: 1px; - padding-bottom: 1px; -} \ No newline at end of file diff --git a/src/main/java/pm/axe/ui/layouts/AxeFormLayout.java b/src/main/java/pm/axe/ui/layouts/AxeFormLayout.java index e0fcf5494..6ae2b2ae9 100644 --- a/src/main/java/pm/axe/ui/layouts/AxeFormLayout.java +++ b/src/main/java/pm/axe/ui/layouts/AxeFormLayout.java @@ -20,7 +20,7 @@ public class AxeFormLayout extends AxeBaseLayout { private final H2 formTitle = new H2(); private final Div formSubTitle = new Div(); - private final Div fields = new Div(); + private final VerticalLayout fields = new VerticalLayout(); private final Div spaceAfterFields = new Div(); private final Hr separator = new Hr(); @@ -102,6 +102,10 @@ private void applyStyle() { formSubTitle.setClassName("axe-form-subtitle"); fields.setClassName("axe-fields"); + fields.setSpacing(false); + fields.addClassName("vertically-compact"); + + spaceAfterFields.addClassName("space-after-fields"); separator.addClassName("separator"); diff --git a/src/main/java/pm/axe/ui/pages/user/ForgotPasswordPage.java b/src/main/java/pm/axe/ui/pages/user/ForgotPasswordPage.java new file mode 100644 index 000000000..2b7ec2ffb --- /dev/null +++ b/src/main/java/pm/axe/ui/pages/user/ForgotPasswordPage.java @@ -0,0 +1,140 @@ +package pm.axe.ui.pages.user; + +import com.vaadin.flow.component.ClickEvent; +import com.vaadin.flow.component.Key; +import com.vaadin.flow.component.button.Button; +import com.vaadin.flow.component.dependency.CssImport; +import com.vaadin.flow.component.details.Details; +import com.vaadin.flow.component.html.Anchor; +import com.vaadin.flow.component.html.Span; +import com.vaadin.flow.component.orderedlayout.VerticalLayout; +import com.vaadin.flow.component.textfield.TextField; +import com.vaadin.flow.router.BeforeEnterEvent; +import com.vaadin.flow.router.BeforeEnterObserver; +import com.vaadin.flow.router.PageTitle; +import com.vaadin.flow.router.Route; +import com.vaadin.flow.spring.annotation.SpringComponent; +import com.vaadin.flow.spring.annotation.UIScope; +import lombok.RequiredArgsConstructor; +import lombok.extern.slf4j.Slf4j; +import org.apache.commons.lang3.StringUtils; +import pm.axe.Axe; +import pm.axe.Endpoint; +import pm.axe.ui.MainView; +import pm.axe.ui.layouts.AxeFormLayout; +import pm.axe.utils.AppUtils; + +@Slf4j +@SpringComponent +@UIScope +@RequiredArgsConstructor +@CssImport(value = "./css/forgot_password_page.css") +@Route(value = Endpoint.UI.FORGOT_PASSWORD_PAGE, layout = MainView.class) +@PageTitle("Forgot Password - Axe.pm") +public class ForgotPasswordPage extends AxeFormLayout implements BeforeEnterObserver { + private static final String TAG = "[" + ForgotPasswordPage.class.getSimpleName() + "]"; + private final AppUtils appUtils; + + private final TextField usernameInput = new TextField(); + private Span contactKyberorgSpan; + private final Span successSpan = getSuccessSpan(); + + private Details nothingLinkedDetails; + + private boolean pageAlreadyInitialized = false; + + @Override + public void beforeEnter(final BeforeEnterEvent beforeEnterEvent) { + if (pageAlreadyInitialized) return; + pageInit(); + applyState(); + pageAlreadyInitialized = true; + } + + private void pageInit() { + setCompactMode(); + setFormTitle("Forgot Password?"); + + usernameInput.setLabel("Username/Email"); + usernameInput.setClearButtonVisible(true); + setFormFields(usernameInput); + + contactKyberorgSpan = getContactKyberorgSpan(); + setComponentsAfterFields(getRecoveryNote()); + setSubmitButtonText("Submit"); + getSubmitButton().addClickShortcut(Key.ENTER); + getSubmitButton().addClickListener(this::onSubmit); + } + + private void applyState() { + usernameInput.focus(); + nothingLinkedDetails.setOpened(false); + } + + private void onSubmit(final ClickEvent