about summary refs log tree commit diff
path: root/templates/src/indieauth.rs
blob: 155b58052645d558d00a78bc657c2ec4fff180ea (plain) (blame)
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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
use kittybox_indieauth::{AuthorizationRequest, Scope};
use kittybox_util::auth::EnrolledCredential;

markup::define! {
    AuthorizationRequestPage(
        request: AuthorizationRequest,
        credentials: Vec<EnrolledCredential>,
        app: Option<serde_json::Value>,
        user: serde_json::Value
    ) {
        script[type="module"] {
            @markup::raw(r#"import { submit_handler } from "/.kittybox/static/indieauth.js";

document.getElementById("indieauth_page").addEventListener("submit", submit_handler);
"#)
        }
        main {
            form #indieauth_page[action="/.kittybox/indieauth/auth/confirm", method="POST"] {
                noscript {
                    p {"I know how annoyed you can be about scripts." }
                    p { "But WebAuthn doesn't work without JavaScript. And passwords are horribly insecure, and everyone knows it deep inside their heart." }
                    p { b { "Please enable JavaScript for this page to work properly 😭" } }
                }
                div #introduction {
                    h1."mini-h-card" {
                        "Hi, "
                            @if let Some(photo) = user["properties"]["photo"][0].as_str() {
                                img.user_avatar[src=photo];
                            } else if let Some(photo) = user["properties"]["photo"][0].as_object() {
                            img[
                                src=photo["value"].as_str().unwrap(),
                                alt=photo["alt"].as_str().unwrap(),
                                loading="lazy"
                            ];
                        }
                        @user["properties"]["name"][0].as_str().unwrap_or("administrator")
                    }

                    p."mini-h-card" {
                        @if let Some(icon) = app
                            .as_ref()
                            .and_then(|app| app["properties"]["logo"][0].as_str())
                        {
                            img.app_icon[src=icon];
                        } else if let Some(icon) = app
                            .as_ref()
                            .and_then(|app| app["properties"]["logo"][0].as_object())
                        {
                            img.app_icon[src=icon["src"].as_str().unwrap(), alt=icon["alt"].as_str().unwrap()];
                        }
                        span {
                            a[href=app
                              .as_ref()
                              .and_then(|app| app["properties"]["url"][0].as_str())
                              .unwrap_or_else(|| request.client_id.as_str())
                            ] {
                                @app
                                    .as_ref()
                                    .and_then(|app| app["properties"]["name"][0].as_str())
                                    .unwrap_or_else(|| request.client_id.as_str())
                            }
                            " wants to confirm your identity."
                        }
                    }
                }

                @if request.scope.is_some() {
                    p {
                        "An application just requested access to your website. This can give access to your data, including private content."
                    }

                    p {
                        "You can review the permissions the application requested below. You are free to not grant any permissions that the application requested if you don't trust it, at the cost of potentially reducing its functionality."
                    }
                }

                fieldset #scopes {
                    legend { "Permissions to grant the app:" }
                    div {
                        input[type="checkbox", disabled="true", checked="true"];
                        label[for="identify"] {
                            "Identify you as the owner of "
                                @user["properties"]["uid"][0].as_str().unwrap()
                        }
                    }
                    @if let Some(scopes) = &request.scope {
                        @for scope in scopes.iter() {
                            div {
                                input[type="checkbox", name="scope", id=scope.as_ref(), value=scope.as_ref()];
                                label[for=scope.as_ref()] {
                                    @match scope {
                                        Scope::Profile => {
                                            "Access your publicly visible profile information"
                                        }
                                        Scope::Email => {
                                            "Access your email address"
                                        }
                                        Scope::Create => {
                                            "Create new content on your website"
                                        }
                                        Scope::Update => {
                                            "Modify content on your website"
                                        }
                                        Scope::Delete => {
                                            "Delete content on your website"
                                        }
                                        Scope::Media => {
                                            "Interact with your media storage"
                                        }
                                        other => {
                                            @markup::raw(format!(
                                                "(custom or unknown scope) <code>{}</code>",
                                                other.as_ref()
                                            ))
                                        }
                                    }
                                }
                            }
                        }
                    }
                }

                fieldset {
                    legend { "Choose your preferred authentication method:" }
                    div {
                        input[type="radio",
                              name="auth_method",
                              id="auth_with_webauthn",
                              disabled=!credentials.iter().any(|e| *e == EnrolledCredential::WebAuthn),
                              checked=credentials.iter().any(|e| *e == EnrolledCredential::WebAuthn)
                        ];
                        label[for="auth_with_webauthn"] { "Use an authenticator device to log in" }
                    }
                    div {
                        input[type="radio",
                              name="auth_method", value="password",
                              id="auth_with_password",
                              disabled=!credentials.iter().any(|e| *e == EnrolledCredential::Password),
                              checked=credentials.iter().all(|e| *e == EnrolledCredential::Password)
                        ];
                        label[for="auth_with_password"] { "Password" }
                        br;
                        input[type="password", name="user_password", id="user_password"];
                    }
                }

                input[type="submit", value="Authenticate"];
                br;

                details {
                    summary { "View detailed data about this request" }

                    p {
                        "More info about meanings of these fields can be found in "
                            a[href="https://indieauth.spec.indieweb.org/20220212/#authorization-request"] {
                                "the IndieAuth specification"
                            } ", which this webpage uses."
                    }
                    fieldset {
                        div {
                            label[for="response_type"] { "Response type (will most likely be \"code\")" }
                            br;
                            input[name="response_type", id="response_type", readonly,
                                  value=request.response_type.as_str()];
                        }
                        div {
                            label[for="state"] { "Request state" }
                            br;
                            input[name="state", id="state", readonly,
                                  value=request.state.as_ref()];
                        }
                        div {
                            label[for="client_id"] { "Client ID" }
                            br;
                            input[name="client_id", id="client_id", readonly,
                                  value=request.client_id.as_str()];
                        }
                        div {
                            label[for="redirect_uri"] { "Redirect URI" }
                            br;
                            input[name="redirect_uri", id="redirect_uri", readonly,
                                  value=request.redirect_uri.as_str()];
                        }
                        div {
                            label[for="code_challenge"] { "PKCE code challenge" }
                            br;
                            input[name="code_challenge", id="code_challenge", readonly,
                                  value=request.code_challenge.as_str()];
                        }
                        div {
                            label[for="code_challenge_method"] { "PKCE method (should be S256)" }
                            br;
                            input[name="code_challenge_method", id="code_challenge_method", readonly,
                                  value=request.code_challenge.method().as_str()];
                        }
                    }
                }
            }
        }
    }
}