ZacharyZhang-NY
c9e3400a71
LoginForm takes an email and a password, keeps one signed in on a box, and signs in on Enter once the address reads and a password is typed; a failed try says why above Sign in. SignupForm ticks a new password's rules as they hold and waits for all of them and the terms. OAuthButtons offer each provider, one spinning while the rest rest. MagicLinkForm and ForgotPassword send a link to an address and, once sent, say where it went and offer it again. TwoFactorInput takes a six-digit code at once and, after one fails, clears the boxes through forms::PinInput's new attempt, keeping its focus. The Account chapter splits into sign-in, profile and access, and billing and team.
123 lines
3.6 KiB
Rust
123 lines
3.6 KiB
Rust
use std::rc::Rc;
|
|
|
|
use gpui::{
|
|
App, ElementId, IntoElement, ParentElement, RenderOnce, SharedString, Styled, Window, div,
|
|
};
|
|
|
|
use super::login::Run;
|
|
use crate::{
|
|
feedback::InlineMessage,
|
|
forms::PinInput,
|
|
primitives::Severity,
|
|
theme::{ActiveTheme, TextSize},
|
|
typography::Link,
|
|
};
|
|
|
|
type OnText = Rc<dyn Fn(&SharedString, &mut Window, &mut App)>;
|
|
|
|
/// Digits in a code from an authenticator app.
|
|
const DIGITS: usize = 6;
|
|
|
|
/// The code from an authenticator app, in six boxes. A full code goes to the owner at once; after one fails the boxes clear for the next, and a recovery code can stand in.
|
|
#[derive(IntoElement)]
|
|
pub struct TwoFactorInput {
|
|
id: ElementId,
|
|
failed: usize,
|
|
busy: bool,
|
|
on_code: Option<OnText>,
|
|
on_recovery: Option<Run>,
|
|
}
|
|
|
|
impl TwoFactorInput {
|
|
pub fn new(id: impl Into<ElementId>) -> Self {
|
|
Self {
|
|
id: id.into(),
|
|
failed: 0,
|
|
busy: false,
|
|
on_code: None,
|
|
on_recovery: None,
|
|
}
|
|
}
|
|
|
|
/// How many codes have failed; each new failure clears the boxes and says so.
|
|
pub fn failed(mut self, failed: usize) -> Self {
|
|
self.failed = failed;
|
|
self
|
|
}
|
|
|
|
/// While the owner checks a code.
|
|
pub fn busy(mut self, busy: bool) -> Self {
|
|
self.busy = busy;
|
|
self
|
|
}
|
|
|
|
pub fn on_code(
|
|
mut self,
|
|
handler: impl Fn(&SharedString, &mut Window, &mut App) + 'static,
|
|
) -> Self {
|
|
self.on_code = Some(Rc::new(handler));
|
|
self
|
|
}
|
|
|
|
/// Shows "Use a recovery code".
|
|
pub fn on_recovery(mut self, handler: impl Fn(&mut Window, &mut App) + 'static) -> Self {
|
|
self.on_recovery = Some(Rc::new(handler));
|
|
self
|
|
}
|
|
}
|
|
|
|
impl RenderOnce for TwoFactorInput {
|
|
fn render(self, _: &mut Window, cx: &mut App) -> impl IntoElement {
|
|
let id = self.id;
|
|
let on_code = self
|
|
.on_code
|
|
.unwrap_or_else(|| panic!("two-factor input {id:?} has no on_code"));
|
|
let theme = cx.theme();
|
|
let note = match (self.busy, self.failed) {
|
|
(true, _) => Some(
|
|
div()
|
|
.text_color(theme.colors.fg_muted)
|
|
.child("Checking the code…")
|
|
.into_any_element(),
|
|
),
|
|
(false, 0) => None,
|
|
(false, _) => Some(
|
|
InlineMessage::new(
|
|
Severity::Danger,
|
|
"That code did not work. Try the one showing now.",
|
|
)
|
|
.into_any_element(),
|
|
),
|
|
};
|
|
div()
|
|
.flex()
|
|
.flex_col()
|
|
.gap_3()
|
|
.text_size(theme.text_size(TextSize::Sm))
|
|
.child(
|
|
div().flex().child(
|
|
div()
|
|
.flex_1()
|
|
.min_w_0()
|
|
.text_color(theme.colors.fg_muted)
|
|
.child("Enter the six-digit code from your authenticator app."),
|
|
),
|
|
)
|
|
.child(
|
|
PinInput::new((id.clone(), "code"), DIGITS)
|
|
.attempt(self.failed)
|
|
.on_complete(move |code, window, cx| {
|
|
log::info!("two-factor input: code entered");
|
|
on_code(&SharedString::from(code.to_string()), window, cx);
|
|
}),
|
|
)
|
|
.children(note)
|
|
.children(self.on_recovery.map(|run| {
|
|
div().child(
|
|
Link::new((id.clone(), "recovery"), "Use a recovery code")
|
|
.on_click(move |_, window, cx| run(window, cx)),
|
|
)
|
|
}))
|
|
}
|
|
}
|