Add account_activated page prompting user to install the extension

app/auth/views/activate.py

@@ -64,4 +64,4 @@ def activate():
         return redirect(next_url)
     else:
         LOG.d("redirect user to dashboard")
-        return redirect(url_for("dashboard.index"))
+        return redirect(url_for("onboarding.account_activated"))

app/onboarding/__init__.py

@@ -2,4 +2,5 @@ from .views import (
     index,
     final,
     setup_done,
+    account_activated,
 )

app/onboarding/views/account_activated.py

@@ -0,0 +1,41 @@
+from app.onboarding.base import onboarding_bp
+from enum import Enum
+from flask import redirect, render_template, request, url_for
+
+
+CHROME_EXTENSION_LINK = "https://chrome.google.com/webstore/detail/simpleloginreceive-send-e/dphilobhebphkdjbpfohgikllaljmgbn"
+FIREFOX_EXTENSION_LINK = "https://addons.mozilla.org/firefox/addon/simplelogin/"
+
+
+class Browser(Enum):
+    Firefox = 1
+    Chrome = 2
+    Other = 3
+
+
+def get_browser() -> Browser:
+    user_agent = request.user_agent
+    if user_agent.browser in ["chrome", "edge", "opera", "webkit"]:
+        return Browser.Chrome
+    elif user_agent.browser in ["mozilla", "firefox"]:
+        return Browser.Firefox
+    return Browser.Other
+
+
+@onboarding_bp.route("/account_activated", methods=["GET"])
+def account_activated():
+    browser = get_browser()
+    if browser == Browser.Chrome:
+        extension_link = CHROME_EXTENSION_LINK
+        browser_name = "Chrome"
+    elif browser == Browser.Firefox:
+        extension_link = FIREFOX_EXTENSION_LINK
+        browser_name = "Firefox"
+    else:
+        return redirect(url_for("dashboard.index"))
+
+    return render_template(
+        "onboarding/account_activated.html",
+        extension_link=extension_link,
+        browser_name=browser_name,
+    )

templates/onboarding/account_activated.html

@@ -0,0 +1,38 @@
+{% extends 'base.html' %}
+
+{% block content %}
+
+  <div class="flex-fill align-items-center mt-8">
+    <!-- Image container -->
+    <div class="mt-4 mb-4 text-center" style="display:block;">
+      <a class="" href="{{ url_for('dashboard.index') }}">
+        <picture>
+          <source media="(max-width: 650px)" srcset="/static/logo.svg">
+          <img src="/static/logo.svg" style="width: 24rem" alt="logo">
+        </picture>
+      </a>
+    </div>
+
+    <!-- Text container -->
+    <div class="my-6 text-center">
+      <h2 style="color:black;font-size:2rem">Welcome to SimpleLogin</h2>
+    </div>
+
+    <div class="px-8" style="width:675px;margin:auto;">
+
+      <div class="my-6">
+        <p style="font-size: 1.2em;">Get the most out from SimpleLogin by using our {{ browser_name }} extension</p>
+        <a class="px-4 py-3 mt-4 text-decoration-none text-center" style="background:black;color:white;display:block;width:50%;" href="{{ extension_link }}">Install {{ browser_name }} extension</a>
+      </div>
+
+      <h2 class="my-4" style="color:black;font-size:2rem">OR</h2>
+
+      <div class="my-6">
+        <p style="font-size: 1.2em;">Install the extension later and start discovering our features on our web app</p>
+        <a class="px-4 py-3 mt-4 text-decoration-none text-center" style="background:white;color:black;border-radius: 2px;border:1px solid black;display:block;width:50%;" href="{{ url_for('dashboard.index') }}">Continue to our web app</a>
+      </div>
+    </div>
+
+  </div>
+
+{% endblock %}