Show the secret key for users using PC-based authenticators

src/Packagist/WebBundle/Controller/UserController.php

@@ -333,7 +333,7 @@ class UserController extends Controller
             }
         }
 
-        return array('user' => $user, 'provisioningUri' => $authenticator->getQRContent($user), 'form' => $form->createView());
+        return array('user' => $user, 'provisioningUri' => $authenticator->getQRContent($user), 'secret' => $enableRequest->getSecret(), 'form' => $form->createView());
     }
 
     /**

src/Packagist/WebBundle/Resources/public/css/main.css

@@ -1625,6 +1625,12 @@ svg.chart {
   position: relative;
 }
 
+.two-factor-key {
+    max-width: 200px;
+    text-align: center;
+    overflow-wrap: break-word;
+}
+
 
 [class^="icon-"]:before,
 [class*=" icon-"]:before {

src/Packagist/WebBundle/Resources/views/user/enable_two_factor_auth.html.twig

@@ -26,15 +26,20 @@
 
         <section class="{{ isActualUser ? 'col-md-9' : 'col-md-12' }}">
             <p>
-                To enable two-factor authentication, you'll need a mobile app that supports TOTP such as
-                <a href="https://authy.com/download/">Authy</a>
+                To enable two-factor authentication, you'll need an app that supports TOTP such as
+                <a href="https://authy.com/download/">Authy</a>,
+                <a href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2">Google Authenticator</a>,
                 or
-                <a href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2">Google Authenticator</a>.
+                <a href="https://keepassxc.org/">KeePassXC</a>.
             </p>
 
             <p><small>(This is not an exhaustive list of compatible apps. Packagist does not endorse or recommend one application over another.)</small></p>
 
-            <img src="{{ qr_code_data_uri(provisioningUri) }}" height="200" class="pull-right" />
+            <p class="pull-right two-factor-key">
+                <img src="{{ qr_code_data_uri(provisioningUri) }}" height="200" />
+                <br>
+                <small>TOTP Key: <code>{{ secret }}</code></small>
+            </p>
 
             <h3>Enabling Two-Factor Authentication</h3>