Can remove created factors

templates/settings/add_2fa_totp_page.html

@@ -75,7 +75,7 @@
                 return;
 
             try {
-                const res = await fetch("/settings/api/two_factors/save_totp_factor", {
+                const res = await fetch("/settings/api/two_factor/save_totp_factor", {
                     method: "post",
                     headers: {
                       'Content-Type': 'application/json',

templates/settings/two_factors_page.html

@@ -13,6 +13,52 @@
 <p>
     <a href="/settings/two_factors/add_totp" type="button" class="btn btn-primary">Add Authenticator App</a>
 </p>
-TODO : show the list of currently registered 2 factors methods
 
+<table class="table table-hover" style="max-width: 800px;" aria-describedby="Factors list">
+    <thead>
+    <tr>
+        <th scope="col">Factor type</th>
+        <th scope="col">Name</th>
+        <th scope="col">Actions</th>
+    </tr>
+    </thead>
+    <tbody>
+    {% for f in user.second_factors.as_deref().unwrap_or_default() %}
+    <tr id="factor-{{ f.id.0 }}">
+        <td>{{ f.type_str() }}</td>
+        <td>{{ f.name }}</td>
+        <td><a href="javascript:delete_factor('{{ f.id.0 }}');">Delete</a></td>
+    </tr>
+    {% endfor %}
+    </tbody>
+</table>
+
+<script>
+    async function delete_factor(id) {
+        if (!confirm("Do you really want to remove this factor?"))
+            return;
+
+        try {
+            const res = await fetch("/settings/api/two_factor/delete_factor", {
+                method: "post",
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    id: id,
+                })
+            });
+
+            let text = await res.text();
+            alert(text);
+
+            if (res.status == 200)
+                document.getElementById("factor-" + id).remove();
+        } catch(e) {
+            console.error(e);
+            alert("Failed to remove factor!");
+        }
+    }
+
+</script>
 {% endblock content %}