From a1a3d316e3ad716941e2434660b7e25b9a190292 Mon Sep 17 00:00:00 2001
From: Jens Langhammer <jens.langhammer@beryju.org>
Date: Sat, 20 Feb 2021 18:28:11 +0100
Subject: [PATCH] stages/identification: implement challenge

---
 authentik/flows/challenge.py                  | 11 +---
 authentik/flows/stage.py                      |  2 +-
 authentik/flows/transfer/common.py            |  3 +
 authentik/stages/identification/stage.py      |  4 +-
 web/src/elements/AdminLoginsChart.ts          |  2 +-
 web/src/elements/Expand.ts                    |  1 -
 web/src/elements/buttons/ModalButton.ts       |  4 +-
 .../identification/IdentificationStage.ts     | 62 ++++++++++---------
 web/src/pages/generic/SiteShell.ts            |  2 +-
 9 files changed, 48 insertions(+), 43 deletions(-)

diff --git a/authentik/flows/challenge.py b/authentik/flows/challenge.py
index e503c9dc2..1c64f4a29 100644
--- a/authentik/flows/challenge.py
+++ b/authentik/flows/challenge.py
@@ -1,3 +1,5 @@
+from authentik.flows.transfer.common import DataclassEncoder
+from dataclasses import asdict, is_dataclass
 from enum import Enum
 from json.encoder import JSONEncoder
 
@@ -25,13 +27,6 @@ class ChallengeResponse(Serializer):
     pass
 
 
-class ChallengeEncoder(JSONEncoder):
-    def default(self, obj):
-        if isinstance(obj, Enum):
-            return obj.value
-        return super().default(obj)
-
-
 class HttpChallengeResponse(JsonResponse):
     def __init__(self, challenge: Challenge, **kwargs) -> None:
-        super().__init__(challenge.data, encoder=ChallengeEncoder, **kwargs)
+        super().__init__(challenge.data, encoder=DataclassEncoder, **kwargs)
diff --git a/authentik/flows/stage.py b/authentik/flows/stage.py
index 92c2b69cf..5f1a72296 100644
--- a/authentik/flows/stage.py
+++ b/authentik/flows/stage.py
@@ -61,7 +61,7 @@ class ChallengeStageView(StageView):
         return HttpChallengeResponse(challenge)
 
     def post(self, request: HttpRequest, *args, **kwargs) -> HttpResponse:
-        challenge = self.response_class(data=request.POST)
+        challenge: ChallengeResponse = self.response_class(data=request.POST)
         if not challenge.is_valid():
             return self.challenge_invalid(challenge)
         return self.challenge_valid(challenge)
diff --git a/authentik/flows/transfer/common.py b/authentik/flows/transfer/common.py
index c3cd629d0..30b3b3bbb 100644
--- a/authentik/flows/transfer/common.py
+++ b/authentik/flows/transfer/common.py
@@ -1,5 +1,6 @@
 """transfer common classes"""
 from dataclasses import asdict, dataclass, field, is_dataclass
+from enum import Enum
 from typing import Any
 from uuid import UUID
 
@@ -74,6 +75,8 @@ class DataclassEncoder(DjangoJSONEncoder):
             return asdict(o)
         if isinstance(o, UUID):
             return str(o)
+        if isinstance(o, Enum):
+            return o.value
         return super().default(o)  # pragma: no cover
 
 
diff --git a/authentik/stages/identification/stage.py b/authentik/stages/identification/stage.py
index b2adf8eb5..59569ef93 100644
--- a/authentik/stages/identification/stage.py
+++ b/authentik/stages/identification/stage.py
@@ -34,6 +34,8 @@ class IdentificationChallengeResponse(ChallengeResponse):
 class IdentificationStageView(ChallengeStageView):
     """Form to identify the user"""
 
+    response_class = IdentificationChallengeResponse
+
     def get_user(self, uid_value: str) -> Optional[User]:
         """Find user instance. Returns None if no user was found."""
         current_stage: IdentificationStage = self.executor.current_stage
@@ -96,7 +98,7 @@ class IdentificationStageView(ChallengeStageView):
         user_identifier = challenge.data.get("uid_field")
         pre_user = self.get_user(user_identifier)
         if not pre_user:
-            LOGGER.debug("invalid_login")
+            LOGGER.debug("invalid_login", identifier=user_identifier)
             messages.error(self.request, _("Failed to authenticate."))
             return self.challenge_invalid(challenge)
         self.executor.plan.context[PLAN_CONTEXT_PENDING_USER] = pre_user
diff --git a/web/src/elements/AdminLoginsChart.ts b/web/src/elements/AdminLoginsChart.ts
index 898d59d0a..63d1b3c35 100644
--- a/web/src/elements/AdminLoginsChart.ts
+++ b/web/src/elements/AdminLoginsChart.ts
@@ -47,7 +47,7 @@ export class AdminLoginsChart extends LitElement {
                     level_tag: "error",
                     message: "Unexpected error"
                 });
-                console.log(e);
+                console.error(e);
             })
             .then((r) => {
                 const canvas = <HTMLCanvasElement>this.shadowRoot?.querySelector("canvas");
diff --git a/web/src/elements/Expand.ts b/web/src/elements/Expand.ts
index 3cb684702..524eaf702 100644
--- a/web/src/elements/Expand.ts
+++ b/web/src/elements/Expand.ts
@@ -19,7 +19,6 @@ export class Expand extends LitElement {
     }
 
     render(): TemplateResult {
-        console.log(this.expanded);
         return html`<div class="pf-c-expandable-section ${this.expanded ? "pf-m-expanded" : ""}">
             <button type="button" class="pf-c-expandable-section__toggle" aria-expanded="${this.expanded}" @click=${() => {
                 this.expanded = !this.expanded;
diff --git a/web/src/elements/buttons/ModalButton.ts b/web/src/elements/buttons/ModalButton.ts
index 226565871..1991d260c 100644
--- a/web/src/elements/buttons/ModalButton.ts
+++ b/web/src/elements/buttons/ModalButton.ts
@@ -108,7 +108,7 @@ export class ModalButton extends LitElement {
                             level_tag: "error",
                             message: "Unexpected error"
                         });
-                        console.log(e);
+                        console.error(e);
                     });
             });
         });
@@ -136,7 +136,7 @@ export class ModalButton extends LitElement {
                         level_tag: "error",
                         message: "Unexpected error"
                     });
-                    console.log(e);
+                    console.error(e);
                 });
         }
     }
diff --git a/web/src/elements/stages/identification/IdentificationStage.ts b/web/src/elements/stages/identification/IdentificationStage.ts
index 08eaa50c1..2c49ad8de 100644
--- a/web/src/elements/stages/identification/IdentificationStage.ts
+++ b/web/src/elements/stages/identification/IdentificationStage.ts
@@ -7,12 +7,18 @@ export interface IdentificationStageArgs {
 
     input_type: string;
     primary_action: string;
-    sources: string[];
+    sources: UILoginButton[];
 
     application_pre?: string;
 
 }
 
+export interface UILoginButton {
+    name: string;
+    url: string;
+    icon_url?: string;
+}
+
 @customElement("ak-stage-identification")
 export class IdentificationStage extends BaseStage {
 
@@ -23,6 +29,24 @@ export class IdentificationStage extends BaseStage {
         return COMMON_STYLES;
     }
 
+    submit(e: Event): void {
+        e.preventDefault();
+        const form = new FormData(this.shadowRoot?.querySelector("form") || undefined);
+        this.host?.submit(form);
+    }
+
+    renderSource(source: UILoginButton): TemplateResult {
+        let icon = html`<i class="pf-icon pf-icon-arrow" title="${source.name}"></i>`;
+        if (source.icon_url) {
+            icon = html`<img src="${source.icon_url}" alt="${source.name}">`;
+        }
+        return html`<li class="pf-c-login__main-footer-links-item">
+                <a href="${source.url}" class="pf-c-login__main-footer-links-item-link">
+                    ${icon}
+                </a>
+            </li>`;
+    }
+
     render(): TemplateResult {
         if (!this.args) {
             return html`<ak-loading-state></ak-loading-state>`;
@@ -33,7 +57,7 @@ export class IdentificationStage extends BaseStage {
                 </h1>
             </header>
             <div class="pf-c-login__main-body">
-                <form class="pf-c-form">
+                <form class="pf-c-form" @submit=${(e) => {this.submit(e)}}>
                     ${this.args.application_pre ?
                         html`<p>
                             ${gettext(`Login to continue to ${this.args.application_pre}.`)}
@@ -41,19 +65,15 @@ export class IdentificationStage extends BaseStage {
                         html``}
 
                     <div class="pf-c-form__group">
-                        <label class="pf-c-form__label" for="uid_field-0">
+                        <label class="pf-c-form__label">
                             <span class="pf-c-form__label-text">${gettext("Email or Username")}</span>
                             <span class="pf-c-form__label-required" aria-hidden="true">*</span>
                         </label>
-                        <input type="text" name="uid_field" placeholder="Email or Username" autofocus autocomplete="username" class="pf-c-form-control" required="" id="id_uid_field">
+                        <input type="text" name="uid_field" placeholder="Email or Username" autofocus autocomplete="username" class="pf-c-form-control" required="">
                     </div>
 
                     <div class="pf-c-form__group pf-m-action">
-                        <button class="pf-c-button pf-m-primary pf-m-block" @click=${(e: Event) => {
-                            e.preventDefault();
-                            const form = new FormData(this.shadowRoot.querySelector("form"));
-                            this.host?.submit(form);
-                        }}>
+                        <button type="submit" class="pf-c-button pf-m-primary pf-m-block">
                             ${this.args.primary_action}
                         </button>
                     </div>
@@ -61,26 +81,12 @@ export class IdentificationStage extends BaseStage {
             </div>
             <footer class="pf-c-login__main-footer">
                 <ul class="pf-c-login__main-footer-links">
-                    ${this.args.sources.map(() => {
-                        // TODO: source testing
-                        // TODO: Placeholder and label for input above
-                        return html``;
-                        // {% for source in sources %}
-                        // <li class="pf-c-login__main-footer-links-item">
-                        //     <a href="{{ source.url }}" class="pf-c-login__main-footer-links-item-link">
-                        //         {% if source.icon_path %}
-                        //         <img src="{% static source.icon_path %}" style="width:24px;" alt="{{ source.name }}">
-                        //         {% elif source.icon_url %}
-                        //         <img src="icon_url" alt="{{ source.name }}">
-                        //         {% else %}
-                        //         <i class="pf-icon pf-icon-arrow" title="{{ source.name }}"></i>
-                        //         {% endif %}
-                        //     </a>
-                        // </li>
-                        // {% endfor %}
+                    ${this.args.sources.map((source) => {
+                        return this.renderSource(source);
                     })}
                 </ul>
-                {% if enroll_url or recovery_url %}
+
+                <!--{% if enroll_url or recovery_url %}
                 <div class="pf-c-login__main-footer-band">
                     {% if enroll_url %}
                     <p class="pf-c-login__main-footer-band-item">
@@ -94,7 +100,7 @@ export class IdentificationStage extends BaseStage {
                     </p>
                     {% endif %}
                 </div>
-                {% endif %}
+                {% endif %}-->
             </footer>`;
     }
 
diff --git a/web/src/pages/generic/SiteShell.ts b/web/src/pages/generic/SiteShell.ts
index 687fc8d78..0e7eda4a4 100644
--- a/web/src/pages/generic/SiteShell.ts
+++ b/web/src/pages/generic/SiteShell.ts
@@ -138,7 +138,7 @@ export class SiteShell extends LitElement {
                             level_tag: "error",
                             message: "Unexpected error"
                         });
-                        console.log(e);
+                        console.error(e);
                     });
             });
         });