synpad 0.1.0

A full-featured Matrix chat client built with Dioxus
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85

use dioxus::prelude::*;

/// CAPTCHA verification component for registration.
/// Supports reCAPTCHA and hCaptcha via an embedded web view approach.
#[component]
pub fn CaptchaChallenge(
    site_key: String,
    captcha_type: String,
    on_complete: EventHandler<String>,
    on_cancel: EventHandler<()>,
) -> Element {
    let _response_token = use_signal(|| String::new());
    let mut manual_token = use_signal(|| String::new());

    let is_recaptcha = captcha_type.contains("recaptcha") || captcha_type.contains("m.login.recaptcha");
    let provider_name = if is_recaptcha { "reCAPTCHA" } else { "hCaptcha" };

    // On desktop, we can't easily embed a CAPTCHA widget,
    // so we provide instructions for completing it externally
    rsx! {
        div {
            class: "captcha-challenge",

            div {
                class: "captcha-challenge__header",
                h3 { "Verification Required" }
                p {
                    "This homeserver requires {provider_name} verification to register."
                }
            }

            div {
                class: "captcha-challenge__instructions",
                p {
                    "To complete registration, you need to solve a {provider_name} challenge."
                }
                p {
                    "Please visit your homeserver's registration page in a web browser to complete the CAPTCHA, then return here."
                }
                if !site_key.is_empty() {
                    div {
                        class: "captcha-challenge__site-key",
                        span { "Site key: " }
                        code { "{site_key}" }
                    }
                }
            }

            // Manual token input (for advanced users who completed CAPTCHA externally)
            div {
                class: "captcha-challenge__manual",
                h4 { "Manual Token Entry" }
                p {
                    class: "captcha-challenge__hint",
                    "If you have a CAPTCHA response token, paste it here:"
                }
                input {
                    r#type: "text",
                    class: "settings-input",
                    placeholder: "CAPTCHA response token",
                    value: "{manual_token}",
                    oninput: move |evt| manual_token.set(evt.value()),
                }
            }

            div {
                class: "captcha-challenge__actions",
                button {
                    class: "btn btn--secondary",
                    onclick: move |_| on_cancel.call(()),
                    "Cancel"
                }
                button {
                    class: "btn btn--primary",
                    disabled: manual_token.read().is_empty(),
                    onclick: move |_| {
                        let token = manual_token.read().clone();
                        on_complete.call(token);
                    },
                    "Submit Token"
                }
            }
        }
    }
}