[Vue] remove use of angularjs from TwoFactorAuth plugin (#19382)

* convert twig templates using directives to vue components, remove angularjs adapters and modify less styles that use directive attribute names

* built vue files

* move use of angularjs directives in TwoFactorAuth twig templates to new vue components and add vue component for Logins formErrors.twig template

* built vue files

* add missing translations

* fixing UI tests

* more UI test fixex

* remove reference to nonexistant JS file

* updated expected screenshots

* fixing ui test failures

* update expected screenshots

* fixing ui test failures

* fix select on focus use

* fix placement of computed property

* fixing ui test issues

* prevent random failure

* make sure Login plugin UMD is always loaded

* formErrors is an object if supplied

* compile vue entry components in reset API response and modify check for success

* rebuild login

* update expected screenshot

* remove unneeded use of html_attr escape

* remove use of html_attr and remove duplicate client side translation token entries

* sort used js translations and remove duplicates

* Update plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* built vue files

* adds missing sanitize

* fix AssetManagerTest

* try to fix issue with umd asset fetching if Login not loaded

* cs

* updates expected test files

Co-authored-by: sgiehl <stefan@matomo.org>

30 files changed, 1727 insertions, 525 deletions

diff --git a/core/AssetManager/UIAssetFetcher/PluginUmdAssetFetcher.php b/core/AssetManager/UIAssetFetcher/PluginUmdAssetFetcher.php
index bfd73ca039..c108c7197b 100644
--- a/core/AssetManager/UIAssetFetcher/PluginUmdAssetFetcher.php
+++ b/core/AssetManager/UIAssetFetcher/PluginUmdAssetFetcher.php
@@ -94,7 +94,7 @@ class PluginUmdAssetFetcher extends UIAssetFetcher
 
     private function getAllPluginUmds()
     {
-        $plugins = self::orderPluginsByPluginDependencies($this->plugins, false);
+        $plugins = self::orderPluginsByPluginDependencies($this->getPluginsWithUmdsToUse(), false);
 
         $allPluginUmds = [];
         foreach ($plugins as $plugin) {
@@ -142,7 +142,8 @@ class PluginUmdAssetFetcher extends UIAssetFetcher
 
     protected function retrieveFileLocations()
     {
-        if (empty($this->plugins)) {
+        $plugins = $this->getPluginsWithUmdsToUse();
+        if (empty($plugins)) {
             return;
         }
 
@@ -169,7 +170,7 @@ class PluginUmdAssetFetcher extends UIAssetFetcher
         }
 
         // either loadFilesIndividually = true, or being called w/ disable_merged_assets=1
-        $this->addUmdFilesIfDetected($this->plugins);
+        $this->addUmdFilesIfDetected($this->getPluginsWithUmdsToUse());
    }
 
     private function addUmdFilesIfDetected($plugins)
@@ -309,4 +310,13 @@ class PluginUmdAssetFetcher extends UIAssetFetcher
     {
         return (int)(Config::getInstance()->General['assets_umd_chunk_count'] ?? 3);
     }
+
+    private function getPluginsWithUmdsToUse()
+    {
+        $plugins = $this->plugins;
+        // Login UMDs must always be used, even if there's another login plugin being used
+        $plugins[] = 'Login';
+        $plugins = array_unique($plugins);
+        return $plugins;
+    }
 }
\ No newline at end of file
diff --git a/plugins/Login/javascripts/login.js b/plugins/Login/javascripts/login.js
index 65c7366a2f..af4b946859 100644
--- a/plugins/Login/javascripts/login.js
+++ b/plugins/Login/javascripts/login.js
@@ -63,7 +63,7 @@
             var ajaxDone = function (response) {
                 $('.loadingPiwik').hide();
 
-                var isSuccess = response.indexOf('piwik-notification') === -1,
+                var isSuccess = response.indexOf('form-errors="null"') !== -1,
                     fadeOutIds = '.resetForm .message_container';
                 if (isSuccess) {
                     fadeOutIds += ',#reset_form,#reset_form_nav';
@@ -75,7 +75,7 @@
                     }
 
                     $('.resetForm .message_container').html(response).fadeIn(300);
-                    piwikHelper.compileAngularComponents('.resetForm .message_container');
+                    piwikHelper.compileVueEntryComponents($('.resetForm .message_container'));
                 });
             };
 
diff --git a/plugins/Login/templates/_formErrors.twig b/plugins/Login/templates/_formErrors.twig
index acfdf1e583..9d4273b609 100644
--- a/plugins/Login/templates/_formErrors.twig
+++ b/plugins/Login/templates/_formErrors.twig
@@ -1,11 +1,4 @@
-
-{% if formErrors is defined and formErrors is not empty %}
-    <div piwik-notification
-         noclear="true"
-         context="error">
-        {% for data in formErrors %}
-            <strong>{{ 'General_Error'|translate }}</strong>: {{ data|raw }}
-            <br/>
-        {% endfor %}
-    </div>
-{% endif %}
+<div
+    vue-entry="Login.FormErrors"
+    form-errors="{{ formErrors|default(null)|json_encode }}"
+></div>
diff --git a/plugins/Login/vue/dist/Login.umd.js b/plugins/Login/vue/dist/Login.umd.js
new file mode 100644
index 0000000000..cbf4f257d3
--- /dev/null
+++ b/plugins/Login/vue/dist/Login.umd.js
@@ -0,0 +1,213 @@
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("CoreHome"), require("vue"));
+	else if(typeof define === 'function' && define.amd)
+		define(["CoreHome", ], factory);
+	else if(typeof exports === 'object')
+		exports["Login"] = factory(require("CoreHome"), require("vue"));
+	else
+		root["Login"] = factory(root["CoreHome"], root["Vue"]);
+})((typeof self !== 'undefined' ? self : this), function(__WEBPACK_EXTERNAL_MODULE__19dc__, __WEBPACK_EXTERNAL_MODULE__8bbf__) {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "plugins/Login/vue/dist/";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = "fae3");
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ "19dc":
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__19dc__;
+
+/***/ }),
+
+/***/ "8bbf":
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__8bbf__;
+
+/***/ }),
+
+/***/ "fae3":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, "FormErrors", function() { return /* reexport */ FormErrors; });
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
+// This file is imported into lib/wc client bundles.
+
+if (typeof window !== 'undefined') {
+  var currentScript = window.document.currentScript
+  if (false) { var getCurrentScript; }
+
+  var src = currentScript && currentScript.src.match(/(.+\/)[^/]+\.js(\?.*)?$/)
+  if (src) {
+    __webpack_require__.p = src[1] // eslint-disable-line
+  }
+}
+
+// Indicate to webpack that this file can be concatenated
+/* harmony default export */ var setPublicPath = (null);
+
+// EXTERNAL MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
+var external_commonjs_vue_commonjs2_vue_root_Vue_ = __webpack_require__("8bbf");
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Login/vue/src/FormErrors/FormErrors.vue?vue&type=template&id=7dcbd94d
+
+
+var _hoisted_1 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(": ");
+
+var _hoisted_2 = ["innerHTML"];
+
+var _hoisted_3 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_Notification = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("Notification");
+
+  return Object.keys(_ctx.formErrors || {}).length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_Notification, {
+    key: 0,
+    noclear: true,
+    context: "error"
+  }, {
+    default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+      return [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.formErrors, function (data, key) {
+        return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", {
+          key: key
+        }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Error')), 1), _hoisted_1, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
+          innerHTML: _ctx.$sanitize(data)
+        }, null, 8, _hoisted_2), _hoisted_3]);
+      }), 128))];
+    }),
+    _: 1
+  })) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true);
+}
+// CONCATENATED MODULE: ./plugins/Login/vue/src/FormErrors/FormErrors.vue?vue&type=template&id=7dcbd94d
+
+// EXTERNAL MODULE: external "CoreHome"
+var external_CoreHome_ = __webpack_require__("19dc");
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Login/vue/src/FormErrors/FormErrors.vue?vue&type=script&lang=ts
+
+
+/* harmony default export */ var FormErrorsvue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({
+  props: {
+    formErrors: [Array, Object]
+  },
+  components: {
+    Notification: external_CoreHome_["Notification"]
+  }
+}));
+// CONCATENATED MODULE: ./plugins/Login/vue/src/FormErrors/FormErrors.vue?vue&type=script&lang=ts
+ 
+// CONCATENATED MODULE: ./plugins/Login/vue/src/FormErrors/FormErrors.vue
+
+
+
+FormErrorsvue_type_script_lang_ts.render = render
+
+/* harmony default export */ var FormErrors = (FormErrorsvue_type_script_lang_ts);
+// CONCATENATED MODULE: ./plugins/Login/vue/src/index.ts
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib-no-default.js
+
+
+
+
+/***/ })
+
+/******/ });
+});
+//# sourceMappingURL=Login.umd.js.map
\ No newline at end of file
diff --git a/plugins/Login/vue/dist/Login.umd.min.js b/plugins/Login/vue/dist/Login.umd.min.js
new file mode 100644
index 0000000000..4a47fa8195
--- /dev/null
+++ b/plugins/Login/vue/dist/Login.umd.min.js
@@ -0,0 +1,8 @@
+(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("vue")):"function"===typeof define&&define.amd?define(["CoreHome"],t):"object"===typeof exports?exports["Login"]=t(require("CoreHome"),require("vue")):e["Login"]=t(e["CoreHome"],e["Vue"])})("undefined"!==typeof self?self:this,(function(e,t){return function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="plugins/Login/vue/dist/",r(r.s="fae3")}({"19dc":function(t,r){t.exports=e},"8bbf":function(e,r){e.exports=t},fae3:function(e,t,r){"use strict";if(r.r(t),r.d(t,"FormErrors",(function(){return p})),"undefined"!==typeof window){var n=window.document.currentScript,o=n&&n.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);o&&(r.p=o[1])}var c=r("8bbf"),i=Object(c["createTextVNode"])(": "),u=["innerHTML"],f=Object(c["createElementVNode"])("br",null,null,-1);function l(e,t,r,n,o,l){var a=Object(c["resolveComponent"])("Notification");return Object.keys(e.formErrors||{}).length?(Object(c["openBlock"])(),Object(c["createBlock"])(a,{key:0,noclear:!0,context:"error"},{default:Object(c["withCtx"])((function(){return[(Object(c["openBlock"])(!0),Object(c["createElementBlock"])(c["Fragment"],null,Object(c["renderList"])(e.formErrors,(function(t,r){return Object(c["openBlock"])(),Object(c["createElementBlock"])("span",{key:r},[Object(c["createElementVNode"])("strong",null,Object(c["toDisplayString"])(e.translate("General_Error")),1),i,Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(t)},null,8,u),f])})),128))]})),_:1})):Object(c["createCommentVNode"])("",!0)}var a=r("19dc"),d=Object(c["defineComponent"])({props:{formErrors:[Array,Object]},components:{Notification:a["Notification"]}});d.render=l;var p=d;
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */}})}));
+//# sourceMappingURL=Login.umd.min.js.map
\ No newline at end of file
diff --git a/plugins/Login/vue/dist/umd.metadata.json b/plugins/Login/vue/dist/umd.metadata.json
new file mode 100644
index 0000000000..9ecfcc0456
--- /dev/null
+++ b/plugins/Login/vue/dist/umd.metadata.json
@@ -0,0 +1,5 @@
+{
+  "dependsOn": [
+    "CoreHome"
+  ]
+}
\ No newline at end of file
diff --git a/plugins/Login/vue/src/FormErrors/FormErrors.vue b/plugins/Login/vue/src/FormErrors/FormErrors.vue
new file mode 100644
index 0000000000..43521a00b0
--- /dev/null
+++ b/plugins/Login/vue/src/FormErrors/FormErrors.vue
@@ -0,0 +1,32 @@
+<!--
+  Matomo - free/libre analytics platform
+  @link https://matomo.org
+  @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+-->
+
+<template>
+  <Notification
+    v-if="Object.keys(formErrors || {}).length"
+    :noclear="true"
+    context="error"
+  >
+    <span v-for="(data, key) in formErrors" :key="key">
+      <strong>{{ translate('General_Error') }}</strong>: <span v-html="$sanitize(data)"/>
+      <br/>
+    </span>
+  </Notification>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { Notification } from 'CoreHome';
+
+export default defineComponent({
+  props: {
+    formErrors: [Array, Object],
+  },
+  components: {
+    Notification,
+  },
+});
+</script>
diff --git a/plugins/Login/vue/src/index.ts b/plugins/Login/vue/src/index.ts
new file mode 100644
index 0000000000..782dc0feeb
--- /dev/null
+++ b/plugins/Login/vue/src/index.ts
@@ -0,0 +1,8 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+export { default as FormErrors } from './FormErrors/FormErrors.vue';
diff --git a/plugins/PrivacyManager/vue/dist/umd.metadata.json b/plugins/PrivacyManager/vue/dist/umd.metadata.json
index 3abfd129f0..66244dc900 100644
--- a/plugins/PrivacyManager/vue/dist/umd.metadata.json
+++ b/plugins/PrivacyManager/vue/dist/umd.metadata.json
@@ -1,7 +1,7 @@
 {
   "dependsOn": [
     "CoreHome",
-    "CorePluginsAdmin",
-    "SegmentEditor"
+    "SegmentEditor",
+    "CorePluginsAdmin"
   ]
 }
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/TwoFactorAuth.php b/plugins/TwoFactorAuth/TwoFactorAuth.php
index 75a0c19141..104239cba7 100644
--- a/plugins/TwoFactorAuth/TwoFactorAuth.php
+++ b/plugins/TwoFactorAuth/TwoFactorAuth.php
@@ -64,6 +64,38 @@ class TwoFactorAuth extends \Piwik\Plugin
         $translations[] = 'General_Confirm';
         $translations[] = 'TwoFactorAuth_SetupAuthenticatorOnDeviceStep2';
         $translations[] = 'TwoFactorAuth_SetupAuthenticatorOnDevice';
+        $translations[] = 'TwoFactorAuth_TwoFactorAuthentication';
+        $translations[] = 'General_Error';
+        $translations[] = 'TwoFactorAuth_VerifyIdentifyExplanation';
+        $translations[] = 'TwoFactorAuth_DontHaveYourMobileDevice';
+        $translations[] = 'TwoFactorAuth_EnterRecoveryCodeInstead';
+        $translations[] = 'TwoFactorAuth_NotPossibleToLogIn';
+        $translations[] = 'TwoFactorAuth_LostAuthenticationDevice';
+        $translations[] = 'TwoFactorAuth_AskSuperUserResetAuthenticationCode';
+        $translations[] = 'General_Logout';
+        $translations[] = 'TwoFactorAuth_Your2FaAuthSecret';
+        $translations[] = 'TwoFactorAuth_GenerateNewRecoveryCodes';
+        $translations[] = 'TwoFactorAuth_GenerateNewRecoveryCodesInfo';
+        $translations[] = 'TwoFactorAuth_RecoveryCodesRegenerated';
+        $translations[] = 'General_ExceptionNonceMismatch';
+        $translations[] = 'TwoFactorAuth_TwoFAShort';
+        $translations[] = 'TwoFactorAuth_TwoFactorAuthenticationIntro';
+        $translations[] = 'TwoFactorAuth_TwoFactorAuthenticationIsEnabled';
+        $translations[] = 'TwoFactorAuth_TwoFactorAuthenticationRequired';
+        $translations[] = 'TwoFactorAuth_ConfigureDifferentDevice';
+        $translations[] = 'TwoFactorAuth_DisableTwoFA';
+        $translations[] = 'TwoFactorAuth_ShowRecoveryCodes';
+        $translations[] = 'TwoFactorAuth_TwoFactorAuthenticationIsDisabled';
+        $translations[] = 'TwoFactorAuth_EnableTwoFA';
+        $translations[] = 'TwoFactorAuth_ConfirmDisableTwoFA';
+        $translations[] = 'General_Yes';
+        $translations[] = 'General_No';
+        $translations[] = 'TwoFactorAuth_RequiredToSetUpTwoFactorAuthentication';
+        $translations[] = 'TwoFactorAuth_SetUpTwoFactorAuthentication';
+        $translations[] = 'TwoFactorAuth_SetupFinishedTitle';
+        $translations[] = 'TwoFactorAuth_SetupFinishedSubtitle';
+        $translations[] = 'General_Continue';
+        $translations[] = 'TwoFactorAuth_Verify';
     }
 
     public function getStylesheetFiles(&$stylesheets)
@@ -73,7 +105,6 @@ class TwoFactorAuth extends \Piwik\Plugin
 
     public function getJsFiles(&$jsFiles)
     {
-        $jsFiles[] = "plugins/TwoFactorAuth/javascripts/twofactorauth.js";
         $jsFiles[] = "node_modules/qrcodejs2/qrcode.min.js";
     }
 
diff --git a/plugins/TwoFactorAuth/javascripts/twofactorauth.js b/plugins/TwoFactorAuth/javascripts/twofactorauth.js
deleted file mode 100644
index d6adcc7e7f..0000000000
--- a/plugins/TwoFactorAuth/javascripts/twofactorauth.js
+++ /dev/null
@@ -1,12 +0,0 @@
-(function ($) {
-    var twoFactorAuth = {};
-    twoFactorAuth.confirmDisable2FA = function (nonce) {
-        piwikHelper.modalConfirm('#confirmDisable2FA',
-            {yes: function () {
-                broadcast.propagateNewPage('module=TwoFactorAuth&action=disableTwoFactorAuth&disableNonce='+ encodeURIComponent(nonce));
-            }
-        })
-    };
-
-    window.twoFactorAuth = twoFactorAuth;
-})(jQuery);
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/templates/_setupTwoFactorAuth.twig b/plugins/TwoFactorAuth/templates/_setupTwoFactorAuth.twig
deleted file mode 100644
index c1a1e123c3..0000000000
--- a/plugins/TwoFactorAuth/templates/_setupTwoFactorAuth.twig
+++ /dev/null
@@ -1,18 +0,0 @@
-<script type="text/javascript">
-    window.twoFaBarCodeSetupUrl = {{ twoFaBarCodeSetupUrl|json_encode|raw }};
-</script>
-
-<div
-  vue-entry="TwoFactorAuth.SetupTwoFactorAuth"
-  is-already-using2fa="{{ isAlreadyUsing2fa|default(null)|json_encode|e('html_attr') }}"
-  access-error-string="{{ AccessErrorString|default(null)|json_encode|e('html_attr') }}"
-  submit-action="{{ submitAction|default(null)|json_encode|e('html_attr') }}"
-  auth-code-nonce="{{ authCodeNonce|default(null)|json_encode|e('html_attr') }}"
-  codes="{{ codes|default(null)|json_encode|e('html_attr') }}"
-></div>
-
-<div id="setupTwoFAsecretConfirm" class="ui-confirm">
-    <h2>{{ 'TwoFactorAuth_Your2FaAuthSecret'|translate }}</h2>
-    <p style="text-align: center;"><code piwik-select-on-focus style="font-size: 30px;">{{ newSecret }}</code></p>
-    <input role="ok" type="button" value="{{ 'General_Ok'|translate }}"/>
-</div>
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/templates/loginTwoFactorAuth.twig b/plugins/TwoFactorAuth/templates/loginTwoFactorAuth.twig
index 0f18a0dfd2..74287404b5 100644
--- a/plugins/TwoFactorAuth/templates/loginTwoFactorAuth.twig
+++ b/plugins/TwoFactorAuth/templates/loginTwoFactorAuth.twig
@@ -3,54 +3,14 @@
 {% set title %}{{ 'TwoFactorAuth_TwoFactorAuthentication'|translate }}{% endset %}
 
 {% block loginContent %}
-    {% embed 'contentBlock.twig' with {'title': ('TwoFactorAuth_TwoFactorAuthentication'|translate)} %}
-        {% block content %}
-
-            <div class="message_container">
-
-                {{ include('@Login/_formErrors.twig', {formErrors: form_data.errors } )  }}
-
-                {% if AccessErrorString %}
-                    <div piwik-notification
-                         noclear="true"
-                         context="error">
-                        <strong>{{ 'General_Error'|translate }}</strong>: {{ AccessErrorString|raw }}<br/>
-                    </div>
-                {% endif %}
-            </div>
-
-            <form {{ form_data.attributes|raw }} ng-non-bindable class="loginTwoFaForm">
-                <div class="row">
-                    <div class="col s12 input-field">
-                        <input type="hidden" name="form_nonce" id="login_form_nonce" value="{{ nonce }}"/>
-                        <input type="text" name="form_authcode" placeholder="" id="login_form_authcode" class="input" value="" size="20"
-                               autocorrect="off" autocapitalize="none" autocomplete="off"
-                               tabindex="10" autofocus="autofocus"/>
-                        <label for="login_form_authcode"><i class="icon-user icon"></i> {{ 'TwoFactorAuth_AuthenticationCode'|translate }}</label>
-                    </div>
-                </div>
-
-                <div class="row actions">
-                    <div class="col s12">
-                        <input class="submit btn" id='login_form_submit' type="submit" value="{{ 'TwoFactorAuth_Verify'|translate|e('html_attr') }}"
-                               tabindex="100"/>
-                    </div>
-                </div>
-
-            </form>
-
-            <p>{{ 'TwoFactorAuth_VerifyIdentifyExplanation'|translate }} {{ 'General_LearnMore'|translate('<a href="https://matomo.org/faq/general/faq_27245" rel="noreferrer noopener">', '</a>')|raw }}
-
-            <br /><br />
-            <strong>{{ 'TwoFactorAuth_DontHaveYourMobileDevice'|translate }}</strong>
-            <br />
-                <a href="https://matomo.org/faq/how-to/faq_27248" rel="noreferrer noopener">{{ 'TwoFactorAuth_EnterRecoveryCodeInstead'|translate }}</a>
-                <br />
-                <a href="mailto:{{ contactEmail|e('url') }}?subject={{ 'TwoFactorAuth_NotPossibleToLogIn'|translate|e('url') }}&body={{ 'TwoFactorAuth_LostAuthenticationDevice'|translate("\n\n", "\n\n", piwikUrl|default(''), "\n\n", userLogin, "https://matomo.org/faq/how-to/faq_27248")|e('url') }}" rel="noreferrer noopener">{{ 'TwoFactorAuth_AskSuperUserResetAuthenticationCode'|translate }}</a>
-                <br />
-                <a href="{{ linkTo({'module': loginModule, 'action': 'logout'}) }}" rel="noreferrer noopener">{{ 'General_Logout'|translate }}</a>
-            </p>
-
-        {% endblock %}
-    {% endembed %}
+    <div
+        vue-entry="TwoFactorAuth.LoginTwoFactorAuth"
+        form-data="{{ form_data|json_encode }}"
+        access-error-string="{{ AccessErrorString|default(null)|json_encode }}"
+        form-nonce="{{ nonce|json_encode }}"
+        login-module="{{ loginModule|json_encode }}"
+        piwik-url="{{ piwikUrl|default(null)|json_encode }}"
+        user-login="{{ userLogin|json_encode }}"
+        contact-email="{{ contactEmail|json_encode }}"
+    ></div>
 {% endblock %}
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/templates/setupFinished.twig b/plugins/TwoFactorAuth/templates/setupFinished.twig
index 02dec629f1..b9d25c8dfe 100644
--- a/plugins/TwoFactorAuth/templates/setupFinished.twig
+++ b/plugins/TwoFactorAuth/templates/setupFinished.twig
@@ -1,11 +1,4 @@
 {% extends 'admin.twig' %}
 {% block content %}
-    <div piwik-content-block class="twoFactorSetupFinished">
-        <h2 class="successMessage">
-            {{ 'TwoFactorAuth_SetupFinishedTitle'|translate }}
-        </h2>
-        <h3>{{ 'TwoFactorAuth_SetupFinishedSubtitle'|translate }}</h3>
-        <p><br />
-        <a class="btn" href="{{ linkTo({'module': 'UsersManager', 'action': 'userSecurity'}) }}">{{ 'General_Continue'|translate }}</a></p>
-    </div>
+    <div vue-entry="TwoFactorAuth.SetupFinished"></div>
 {% endblock %}
diff --git a/plugins/TwoFactorAuth/templates/setupTwoFactorAuth.twig b/plugins/TwoFactorAuth/templates/setupTwoFactorAuth.twig
index a31c40c9dd..0ca28affb2 100644
--- a/plugins/TwoFactorAuth/templates/setupTwoFactorAuth.twig
+++ b/plugins/TwoFactorAuth/templates/setupTwoFactorAuth.twig
@@ -1,8 +1,15 @@
 {% extends 'admin.twig' %}
 
 {% block content %}
-<div piwik-content-block
-     content-title="{{ 'TwoFactorAuth_SetUpTwoFactorAuthentication'|translate }}">
-    {% include '@TwoFactorAuth/_setupTwoFactorAuth.twig' %}
-</div>
+<div
+    vue-entry="TwoFactorAuth.SetupTwoFactorAuth"
+    is-already-using2fa="{{ isAlreadyUsing2fa|default(null)|json_encode }}"
+    access-error-string="{{ AccessErrorString|default(null)|json_encode }}"
+    submit-action="{{ submitAction|default(null)|json_encode }}"
+    auth-code-nonce="{{ authCodeNonce|default(null)|json_encode }}"
+    codes="{{ codes|default(null)|json_encode }}"
+    new-secret="{{ newSecret|json_encode }}"
+    two-fa-bar-code-setup-url="{{ twoFaBarCodeSetupUrl|json_encode }}"
+    standalone="false"
+></div>
 {% endblock %}
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/templates/setupTwoFactorAuthStandalone.twig b/plugins/TwoFactorAuth/templates/setupTwoFactorAuthStandalone.twig
index 187f7ef9d0..282d042bbd 100644
--- a/plugins/TwoFactorAuth/templates/setupTwoFactorAuthStandalone.twig
+++ b/plugins/TwoFactorAuth/templates/setupTwoFactorAuthStandalone.twig
@@ -1,9 +1,15 @@
 {% extends '@Login/loginLayout.twig' %}
 
 {% block loginContent %}
-<div piwik-content-block
-     content-title="{{ 'TwoFactorAuth_RequiredToSetUpTwoFactorAuthentication'|translate }}">
-   {% include '@TwoFactorAuth/_setupTwoFactorAuth.twig' %}
-</div>
-
+<div
+   vue-entry="TwoFactorAuth.SetupTwoFactorAuth"
+   is-already-using2fa="{{ isAlreadyUsing2fa|default(null)|json_encode }}"
+   access-error-string="{{ AccessErrorString|default(null)|json_encode }}"
+   submit-action="{{ submitAction|default(null)|json_encode }}"
+   auth-code-nonce="{{ authCodeNonce|default(null)|json_encode }}"
+   codes="{{ codes|default(null)|json_encode }}"
+   new-secret="{{ newSecret|json_encode }}"
+   two-fa-bar-code-setup-url="{{ twoFaBarCodeSetupUrl|json_encode }}"
+   standalone="true"
+></div>
 {% endblock %}
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/templates/showRecoveryCodes.twig b/plugins/TwoFactorAuth/templates/showRecoveryCodes.twig
index 319d2170b4..fed91b49fa 100644
--- a/plugins/TwoFactorAuth/templates/showRecoveryCodes.twig
+++ b/plugins/TwoFactorAuth/templates/showRecoveryCodes.twig
@@ -1,42 +1,11 @@
 {% extends 'admin.twig' %}
 
 {% block content %}
-
-    <script type="text/javascript">
-        function copyRecoveryCodesToClipboard()
-        {
-            var textarea = document.createElement('textarea');
-            textarea.value = '{{ codes|join("\n")|e('js') }}';
-            textarea.setAttribute('readonly', '');
-            textarea.style.position = 'absolute';
-            textarea.style.left = '-9999px';
-            document.body.appendChild(textarea);
-            textarea.select();
-            document.execCommand('copy');
-            document.body.removeChild(textarea);
-        }
-    </script>
-
-    <div piwik-content-block
-         content-title="{{ 'TwoFactorAuth_TwoFactorAuthentication'|translate }} - {{ 'TwoFactorAuth_RecoveryCodes'|translate }}">
-
-        <div vue-entry="TwoFactorAuth.ShowRecoveryCodes" codes="{{ codes|default(null)|json_encode|e('html_attr') }}"></div>
-
-        <h2>{{ 'TwoFactorAuth_GenerateNewRecoveryCodes'|translate }}</h2>
-        <p>{{ 'TwoFactorAuth_GenerateNewRecoveryCodesInfo'|translate }}<br /><br /></p>
-
-        {% if regenerateSuccess %}
-            <div class="alert alert-success">{{ 'TwoFactorAuth_RecoveryCodesRegenerated'|translate }}</div>
-        {% endif %}
-
-        {% if regenerateError %}
-            <div class="alert alert-danger">{{ 'General_ExceptionNonceMismatch'|translate }}</div>
-        {% endif %}
-
-        <form method="post" action="{{ linkTo({'method': 'TwoFactorAuth', 'action': 'showRecoveryCodes'}) }}" ng-non-bindable>
-            <input type="hidden" name="regenerateNonce" value="{{ regenerateNonce }}">
-            <input type="submit" class="btn" value="{{ 'TwoFactorAuth_GenerateNewRecoveryCodes'|translate }}">
-        </form>
-
-    <div>
+    <div
+        vue-entry="TwoFactorAuth.ShowRecoveryCodesPage"
+        codes="{{ codes|default(null)|json_encode }}"
+        regenerate-success="{{ regenerateSuccess|default(null)|json_encode }}"
+        regenerate-error="{{ regenerateError|default(null)|json_encode }}"
+        regenerate-nonce="{{ regenerateNonce|json_encode }}"
+    ></div>
 {% endblock %}
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/templates/userSettings.twig b/plugins/TwoFactorAuth/templates/userSettings.twig
index e156641797..0018e41908 100644
--- a/plugins/TwoFactorAuth/templates/userSettings.twig
+++ b/plugins/TwoFactorAuth/templates/userSettings.twig
@@ -1,42 +1,6 @@
-<div vue-entry="CoreHome.ContentBlock"
-     content-title="{{ 'TwoFactorAuth_TwoFactorAuthentication'|translate }} ({{ 'TwoFactorAuth_TwoFAShort'|translate }})" class="userSettings2FA">
-
-    <p>
-        {{ 'TwoFactorAuth_TwoFactorAuthenticationIntro'|translate('<a href="https://matomo.org/faq/general/faq_27245" rel="noreferrer noopener">', '</a>')|raw }}
-    </p>
-
-    {% if isEnabled %}
-        <p><strong class="twoFaStatusEnabled">{{ 'TwoFactorAuth_TwoFactorAuthenticationIsEnabled'|translate }}</strong></p>
-
-        <p>
-        {% if isForced %}
-            {{ 'TwoFactorAuth_TwoFactorAuthenticationRequired'|translate }}
-            <br />
-            <br />
-            <a class="btn btn-link enable2FaLink" href="{{ linkTo({'module': 'TwoFactorAuth', 'action': 'setupTwoFactorAuth'}) }}" style="margin-right:3.5px">{{ 'TwoFactorAuth_ConfigureDifferentDevice'|translate }}</a>
-        {% else %}
-            <a class="btn btn-link enable2FaLink" href="{{ linkTo({'module': 'TwoFactorAuth', 'action': 'setupTwoFactorAuth'}) }}" style="margin-right:3.5px">{{ 'TwoFactorAuth_ConfigureDifferentDevice'|translate }}</a>
-            <a href="{{ linkTo({'module': 'TwoFactorAuth', 'action': 'disableTwoFactorAuth', 'disableNonce': disableNonce}) }}" style="display:none;" id="disable2fa">disable2fa</a>
-            <input type="button"
-                   class="btn btn-link disable2FaLink"
-                   onclick="twoFactorAuth.confirmDisable2FA('{{ disableNonce|e('url') }}');"
-                   value="{{ 'TwoFactorAuth_DisableTwoFA'|translate }}"
-                   style="margin-right:3.5px">
-        {% endif %}
-            <a class="btn btn-link showRecoveryCodesLink" href="{{ linkTo({'module': 'TwoFactorAuth', 'action': 'showRecoveryCodes'}) }}">{{ 'TwoFactorAuth_ShowRecoveryCodes'|translate }}</a>
-        </p>
-    {% else %}
-        <p><strong>{{ 'TwoFactorAuth_TwoFactorAuthenticationIsDisabled'|translate }}</strong>
-            <br />
-            <br />
-           <a class="btn btn-link enable2FaLink" href="{{ linkTo({'module': 'TwoFactorAuth', 'action': 'setupTwoFactorAuth'}) }}">{{ 'TwoFactorAuth_EnableTwoFA'|translate }}</a>
-        </p>
-    {% endif %}
-
-    <div id="confirmDisable2FA" class="ui-confirm">
-        <h2>{{ 'TwoFactorAuth_ConfirmDisableTwoFA'|translate }}</h2>
-        <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
-        <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
-    </div>
-
-</div>
+<div
+    vue-entry="TwoFactorAuth.UserSettings"
+    is-enabled="{{ isEnabled|default(null)|json_encode }}"
+    is-forced="{{ isForced|default(null)|json_encode }}"
+    disable-nonce="{{ disableNonce|json_encode }}"
+></div>
diff --git a/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.js b/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.js
index a6dbf9bb79..966341841f 100644
--- a/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.js
+++ b/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.js
@@ -1,13 +1,13 @@
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("CoreHome"), require("vue"), require("CorePluginsAdmin"));
+		module.exports = factory(require("CoreHome"), require("Login"), require("vue"), require("CorePluginsAdmin"));
 	else if(typeof define === 'function' && define.amd)
-		define(["CoreHome", , "CorePluginsAdmin"], factory);
+		define(["CoreHome", "Login", , "CorePluginsAdmin"], factory);
 	else if(typeof exports === 'object')
-		exports["TwoFactorAuth"] = factory(require("CoreHome"), require("vue"), require("CorePluginsAdmin"));
+		exports["TwoFactorAuth"] = factory(require("CoreHome"), require("Login"), require("vue"), require("CorePluginsAdmin"));
 	else
-		root["TwoFactorAuth"] = factory(root["CoreHome"], root["Vue"], root["CorePluginsAdmin"]);
-})((typeof self !== 'undefined' ? self : this), function(__WEBPACK_EXTERNAL_MODULE__19dc__, __WEBPACK_EXTERNAL_MODULE__8bbf__, __WEBPACK_EXTERNAL_MODULE_a5a2__) {
+		root["TwoFactorAuth"] = factory(root["CoreHome"], root["Login"], root["Vue"], root["CorePluginsAdmin"]);
+})((typeof self !== 'undefined' ? self : this), function(__WEBPACK_EXTERNAL_MODULE__19dc__, __WEBPACK_EXTERNAL_MODULE__5b81__, __WEBPACK_EXTERNAL_MODULE__8bbf__, __WEBPACK_EXTERNAL_MODULE_a5a2__) {
 return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
@@ -103,6 +103,13 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__19dc__;
 
 /***/ }),
 
+/***/ "5b81":
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__5b81__;
+
+/***/ }),
+
 /***/ "8bbf":
 /***/ (function(module, exports) {
 
@@ -126,7 +133,11 @@ __webpack_require__.r(__webpack_exports__);
 
 // EXPORTS
 __webpack_require__.d(__webpack_exports__, "ShowRecoveryCodes", function() { return /* reexport */ ShowRecoveryCodes; });
+__webpack_require__.d(__webpack_exports__, "ShowRecoveryCodesPage", function() { return /* reexport */ ShowRecoveryCodesPage; });
 __webpack_require__.d(__webpack_exports__, "SetupTwoFactorAuth", function() { return /* reexport */ SetupTwoFactorAuth; });
+__webpack_require__.d(__webpack_exports__, "LoginTwoFactorAuth", function() { return /* reexport */ LoginTwoFactorAuth; });
+__webpack_require__.d(__webpack_exports__, "SetupFinished", function() { return /* reexport */ SetupFinished; });
+__webpack_require__.d(__webpack_exports__, "UserSettings", function() { return /* reexport */ UserSettings; });
 
 // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
 // This file is imported into lib/wc client bundles.
@@ -265,19 +276,107 @@ var external_CoreHome_ = __webpack_require__("19dc");
 ShowRecoveryCodesvue_type_script_lang_ts.render = render
 
 /* harmony default export */ var ShowRecoveryCodes = (ShowRecoveryCodesvue_type_script_lang_ts);
-// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue?vue&type=template&id=ba50e374
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue?vue&type=template&id=0c26b2e2
+
+
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_1 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_2 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_3 = {
+  key: 0,
+  class: "alert alert-success"
+};
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_4 = {
+  key: 1,
+  class: "alert alert-danger"
+};
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_5 = ["action"];
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_6 = ["value"];
+var ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_7 = ["value"];
+function ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_ShowRecoveryCodes = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ShowRecoveryCodes");
+
+  var _component_ContentBlock = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ContentBlock");
+
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ContentBlock, {
+    "content-title": _ctx.contentTitle
+  }, {
+    default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ShowRecoveryCodes, {
+        codes: _ctx.codes
+      }, null, 8, ["codes"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_GenerateNewRecoveryCodes')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_GenerateNewRecoveryCodesInfo')), 1), ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_1, ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_2]), _ctx.regenerateSuccess ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_3, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_RecoveryCodesRegenerated')), 1)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), _ctx.regenerateError ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_4, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_ExceptionNonceMismatch')), 1)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("form", {
+        method: "post",
+        action: _ctx.showRecoveryCodesLink
+      }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        type: "hidden",
+        name: "regenerateNonce",
+        value: _ctx.regenerateNonce
+      }, null, 8, ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_6), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        type: "submit",
+        class: "btn",
+        value: _ctx.translate('TwoFactorAuth_GenerateNewRecoveryCodes')
+      }, null, 8, ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_7)], 8, ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_hoisted_5)];
+    }),
+    _: 1
+  }, 8, ["content-title"]);
+}
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue?vue&type=template&id=0c26b2e2
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue?vue&type=script&lang=ts
+
+
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_1 = {
+/* harmony default export */ var ShowRecoveryCodesPagevue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({
+  props: {
+    codes: Array,
+    regenerateSuccess: Boolean,
+    regenerateError: Boolean,
+    regenerateNonce: {
+      type: String,
+      required: true
+    }
+  },
+  components: {
+    ContentBlock: external_CoreHome_["ContentBlock"],
+    ShowRecoveryCodes: ShowRecoveryCodes
+  },
+  computed: {
+    contentTitle: function contentTitle() {
+      var part1 = Object(external_CoreHome_["translate"])('TwoFactorAuth_TwoFactorAuthentication');
+      var part2 = Object(external_CoreHome_["translate"])('TwoFactorAuth_RecoveryCodes');
+      return "".concat(part1, " - ").concat(part2);
+    },
+    showRecoveryCodesLink: function showRecoveryCodesLink() {
+      return "?".concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, {
+        module: 'TwoFactorAuth',
+        action: 'showRecoveryCodes'
+      })));
+    }
+  }
+}));
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue?vue&type=script&lang=ts
+ 
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue
+
+
+
+ShowRecoveryCodesPagevue_type_script_lang_ts.render = ShowRecoveryCodesPagevue_type_template_id_0c26b2e2_render
+
+/* harmony default export */ var ShowRecoveryCodesPage = (ShowRecoveryCodesPagevue_type_script_lang_ts);
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue?vue&type=template&id=f4e559fa
+
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_1 = {
   class: "setupTwoFactorAuthentication",
   ref: "root"
 };
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_2 = {
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_2 = {
   key: 0,
   class: "alert alert-warning"
 };
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_3 = ["disabled"];
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_3 = ["disabled"];
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_4 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_4 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
   name: "twoFactorStep2",
   id: "twoFactorStep2",
   style: {
@@ -285,23 +384,23 @@ var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_4 = /*#__PURE__*/Obj
   }
 }, null, -1);
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
   target: "_blank",
   rel: "noreferrer noopener",
   href: "https://github.com/andOTP/andOTP#downloads"
 }, "andOTP", -1);
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_6 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(", ");
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_6 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(", ");
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_7 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_7 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
   target: "_blank",
   rel: "noreferrer noopener",
   href: "https://authy.com/guides/github/"
 }, "Authy", -1);
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_8 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(", ");
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_8 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(", ");
 
-var SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_9 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+var SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_9 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
   target: "_blank",
   rel: "noreferrer noopener",
   href: "https://support.1password.com/one-time-passwords/"
@@ -357,7 +456,22 @@ var _hoisted_22 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_V
 var _hoisted_23 = ["action"];
 var _hoisted_24 = ["value"];
 var _hoisted_25 = ["disabled", "value"];
-function SetupTwoFactorAuthvue_type_template_id_ba50e374_render(_ctx, _cache, $props, $setup, $data, $options) {
+var _hoisted_26 = {
+  id: "setupTwoFAsecretConfirm",
+  class: "ui-confirm"
+};
+var _hoisted_27 = {
+  style: {
+    "text-align": "center"
+  }
+};
+var _hoisted_28 = {
+  style: {
+    "font-size": "30px"
+  }
+};
+var _hoisted_29 = ["value"];
+function SetupTwoFactorAuthvue_type_template_id_f4e559fa_render(_ctx, _cache, $props, $setup, $data, $options) {
   var _this = this;
 
   var _component_ShowRecoveryCodes = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ShowRecoveryCodes");
@@ -366,69 +480,84 @@ function SetupTwoFactorAuthvue_type_template_id_ba50e374_render(_ctx, _cache, $p
 
   var _component_Field = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("Field");
 
-  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_1, [_ctx.isAlreadyUsing2fa ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_2, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_WarningChangingConfiguredDevice')), 1)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupIntroFollowSteps')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_StepX', 1)) + " - " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_RecoveryCodes')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ShowRecoveryCodes, {
-    codes: _ctx.codes,
-    onDownloaded: _cache[0] || (_cache[0] = function ($event) {
-      return _this.hasDownloadedRecoveryCode = true;
-    })
-  }, null, 8, ["codes"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", {
-    class: "alert alert-info backupRecoveryCodesAlert"
-  }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupBackupRecoveryCodes')), 513), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step === 1]]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("button", {
-    class: "btn goToStep2",
-    onClick: _cache[1] || (_cache[1] = function ($event) {
-      return _ctx.nextStep();
-    }),
-    disabled: !_ctx.hasDownloadedRecoveryCode
-  }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Next')), 9, SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_3), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step === 1]])]), SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_4, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_StepX', 2)) + " - " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupAuthenticatorOnDevice')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupAuthenticatorOnDeviceStep1')) + " ", 1), SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_5, SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_6, SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_7, SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_8, SetupTwoFactorAuthvue_type_template_id_ba50e374_hoisted_9, _hoisted_10, _hoisted_11, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(", " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Or')) + " ", 1), _hoisted_12, _hoisted_13]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
-    innerHTML: _ctx.$sanitize(_ctx.setupAuthenticatorOnDeviceStep2)
-  }, null, 8, _hoisted_14)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [_hoisted_15, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", _hoisted_16, null, 512)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [_hoisted_17, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("button", {
-    class: "btn goToStep3",
-    onClick: _cache[2] || (_cache[2] = function ($event) {
-      return _ctx.nextStep();
-    })
-  }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Next')), 513), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step === 2]])])], 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step >= 2]]), _hoisted_18, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_StepX', 3)) + " - " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_ConfirmSetup')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_VerifyAuthCodeIntro')), 1), _ctx.accessErrorString ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_19, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Notification, {
-    noclear: true,
-    context: "error"
+  var _component_ContentBlock = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ContentBlock");
+
+  var _directive_select_on_focus = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDirective"])("select-on-focus");
+
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ContentBlock, {
+    "content-title": _ctx.standalone ? _ctx.translate('TwoFactorAuth_RequiredToSetUpTwoFactorAuthentication') : _ctx.translate('TwoFactorAuth_SetUpTwoFactorAuthentication')
   }, {
     default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Error')), 1), _hoisted_20, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
-        innerHTML: _ctx.$sanitize(_ctx.accessErrorString)
-      }, null, 8, _hoisted_21), _hoisted_22];
+      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_1, [_ctx.isAlreadyUsing2fa ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_2, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_WarningChangingConfiguredDevice')), 1)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupIntroFollowSteps')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_StepX', 1)) + " - " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_RecoveryCodes')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ShowRecoveryCodes, {
+        codes: _ctx.codes,
+        onDownloaded: _cache[0] || (_cache[0] = function ($event) {
+          return _this.hasDownloadedRecoveryCode = true;
+        })
+      }, null, 8, ["codes"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", {
+        class: "alert alert-info backupRecoveryCodesAlert"
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupBackupRecoveryCodes')), 513), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step === 1]]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("button", {
+        class: "btn goToStep2",
+        onClick: _cache[1] || (_cache[1] = function ($event) {
+          return _ctx.nextStep();
+        }),
+        disabled: !_ctx.hasDownloadedRecoveryCode
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Next')), 9, SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_3), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step === 1]])]), SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_4, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_StepX', 2)) + " - " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupAuthenticatorOnDevice')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupAuthenticatorOnDeviceStep1')) + " ", 1), SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_5, SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_6, SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_7, SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_8, SetupTwoFactorAuthvue_type_template_id_f4e559fa_hoisted_9, _hoisted_10, _hoisted_11, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(", " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Or')) + " ", 1), _hoisted_12, _hoisted_13]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
+        innerHTML: _ctx.$sanitize(_ctx.setupAuthenticatorOnDeviceStep2)
+      }, null, 8, _hoisted_14)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [_hoisted_15, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", _hoisted_16, null, 512)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [_hoisted_17, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("button", {
+        class: "btn goToStep3",
+        onClick: _cache[2] || (_cache[2] = function ($event) {
+          return _ctx.nextStep();
+        })
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Next')), 513), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step === 2]])])], 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step >= 2]]), _hoisted_18, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_StepX', 3)) + " - " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_ConfirmSetup')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_VerifyAuthCodeIntro')), 1), _ctx.accessErrorString ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_19, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Notification, {
+        noclear: true,
+        context: "error"
+      }, {
+        default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+          return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Error')), 1), _hoisted_20, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
+            innerHTML: _ctx.$sanitize(_ctx.accessErrorString)
+          }, null, 8, _hoisted_21), _hoisted_22];
+        }),
+        _: 1
+      })])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("form", {
+        method: "post",
+        class: "setupConfirmAuthCodeForm",
+        autocorrect: "off",
+        autocapitalize: "none",
+        autocomplete: "off",
+        action: _ctx.linkTo({
+          'module': 'TwoFactorAuth',
+          'action': _ctx.submitAction
+        })
+      }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, {
+        uicontrol: "text",
+        name: "authCode",
+        title: _ctx.translate('TwoFactorAuth_AuthenticationCode'),
+        modelValue: _ctx.authCode,
+        "onUpdate:modelValue": _cache[3] || (_cache[3] = function ($event) {
+          return _ctx.authCode = $event;
+        }),
+        maxlength: 6,
+        placeholder: '123456',
+        "inline-help": _ctx.translate('TwoFactorAuth_VerifyAuthCodeHelp')
+      }, null, 8, ["title", "modelValue", "inline-help"])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        type: "hidden",
+        name: "authCodeNonce",
+        value: _ctx.authCodeNonce
+      }, null, 8, _hoisted_24), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        type: "submit",
+        class: "btn confirmAuthCode",
+        disabled: _ctx.authCode.length !== 6,
+        value: _ctx.translate('General_Confirm')
+      }, null, 8, _hoisted_25)], 8, _hoisted_23)], 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step >= 3]]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_26, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_Your2FaAuthSecret')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", _hoisted_27, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("code", _hoisted_28, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.newSecret), 1)], 512), [[_directive_select_on_focus, {}]])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        role: "ok",
+        type: "button",
+        value: _ctx.translate('General_Ok')
+      }, null, 8, _hoisted_29)])], 512)];
     }),
     _: 1
-  })])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("form", {
-    method: "post",
-    class: "setupConfirmAuthCodeForm",
-    autocorrect: "off",
-    autocapitalize: "none",
-    autocomplete: "off",
-    action: _ctx.linkTo({
-      'module': 'TwoFactorAuth',
-      'action': _ctx.submitAction
-    })
-  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, {
-    uicontrol: "text",
-    name: "authCode",
-    title: _ctx.translate('TwoFactorAuth_AuthenticationCode'),
-    modelValue: _ctx.authCode,
-    "onUpdate:modelValue": _cache[3] || (_cache[3] = function ($event) {
-      return _ctx.authCode = $event;
-    }),
-    maxlength: 6,
-    placeholder: '123456',
-    "inline-help": _ctx.translate('TwoFactorAuth_VerifyAuthCodeHelp')
-  }, null, 8, ["title", "modelValue", "inline-help"])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
-    type: "hidden",
-    name: "authCodeNonce",
-    value: _ctx.authCodeNonce
-  }, null, 8, _hoisted_24), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
-    type: "submit",
-    class: "btn confirmAuthCode",
-    disabled: _ctx.authCode.length !== 6,
-    value: _ctx.translate('General_Confirm')
-  }, null, 8, _hoisted_25)], 8, _hoisted_23)], 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.step >= 3]])], 512);
+  }, 8, ["content-title"]);
 }
-// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue?vue&type=template&id=ba50e374
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue?vue&type=template&id=f4e559fa
 
 // EXTERNAL MODULE: external "CorePluginsAdmin"
 var external_CorePluginsAdmin_ = __webpack_require__("a5a2");
@@ -462,12 +591,18 @@ var _window = window,
       type: String,
       required: true
     },
-    codes: Array
+    codes: Array,
+    twoFaBarCodeSetupUrl: {
+      type: String,
+      required: true
+    },
+    standalone: Boolean
   },
   components: {
     ShowRecoveryCodes: ShowRecoveryCodes,
     Notification: external_CoreHome_["Notification"],
-    Field: external_CorePluginsAdmin_["Field"]
+    Field: external_CorePluginsAdmin_["Field"],
+    ContentBlock: external_CoreHome_["ContentBlock"]
   },
   directives: {
     SelectOnFocus: external_CoreHome_["SelectOnFocus"]
@@ -486,7 +621,7 @@ var _window = window,
       var qrcode = _this.$refs.qrcode; // eslint-disable-next-line no-new
 
       new QRCode(qrcode, {
-        text: window.twoFaBarCodeSetupUrl
+        text: _this.twoFaBarCodeSetupUrl
       });
       $(qrcode).attr('title', ''); // do not show secret on hover
 
@@ -541,9 +676,446 @@ var _window = window,
 
 
 
-SetupTwoFactorAuthvue_type_script_lang_ts.render = SetupTwoFactorAuthvue_type_template_id_ba50e374_render
+SetupTwoFactorAuthvue_type_script_lang_ts.render = SetupTwoFactorAuthvue_type_template_id_f4e559fa_render
 
 /* harmony default export */ var SetupTwoFactorAuth = (SetupTwoFactorAuthvue_type_script_lang_ts);
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue?vue&type=template&id=31d48052
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_1 = {
+  class: "message_container"
+};
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_2 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(": ");
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_3 = ["innerHTML"];
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_4 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_5 = {
+  class: "row"
+};
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_6 = {
+  class: "col s12 input-field"
+};
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_7 = ["value"];
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_8 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+  type: "text",
+  name: "form_authcode",
+  placeholder: "",
+  id: "login_form_authcode",
+  class: "input",
+  value: "",
+  size: "20",
+  autocorrect: "off",
+  autocapitalize: "none",
+  autocomplete: "off",
+  tabindex: "10",
+  autofocus: "autofocus"
+}, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_9 = {
+  for: "login_form_authcode"
+};
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_10 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("i", {
+  class: "icon-user icon"
+}, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_11 = {
+  class: "row actions"
+};
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_12 = {
+  class: "col s12"
+};
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_13 = ["value"];
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_14 = ["innerHTML"];
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_15 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_16 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_17 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_18 = {
+  href: "https://matomo.org/faq/how-to/faq_27248",
+  rel: "noreferrer noopener",
+  target: "_blank"
+};
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_19 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_20 = ["href"];
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_21 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_22 = ["href"];
+function LoginTwoFactorAuthvue_type_template_id_31d48052_render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_FormErrors = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("FormErrors");
+
+  var _component_Notification = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("Notification");
+
+  var _component_ContentBlock = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ContentBlock");
+
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ContentBlock, {
+    "content-title": _ctx.translate('TwoFactorAuth_TwoFactorAuthentication')
+  }, {
+    default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_FormErrors, {
+        "form-errors": _ctx.formData.errors
+      }, null, 8, ["form-errors"]), _ctx.accessErrorString ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_Notification, {
+        key: 0,
+        noclear: true,
+        context: "error"
+      }, {
+        default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+          return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Error')), 1), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_2, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
+            innerHTML: _ctx.$sanitize(_ctx.accessErrorString)
+          }, null, 8, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_3), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_4];
+        }),
+        _: 1
+      })) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("form", Object(external_commonjs_vue_commonjs2_vue_root_Vue_["mergeProps"])(_ctx.formDataAttributes, {
+        class: "loginTwoFaForm"
+      }), [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_5, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_6, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        type: "hidden",
+        name: "form_nonce",
+        id: "login_form_nonce",
+        value: _ctx.formNonce
+      }, null, 8, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_7), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_8, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("label", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_9, [LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_10, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(" " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_AuthenticationCode')), 1)])])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_11, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_12, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        class: "submit btn",
+        id: "login_form_submit",
+        type: "submit",
+        value: _ctx.translate('TwoFactorAuth_Verify'),
+        tabindex: "100"
+      }, null, 8, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_13)])])], 16), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_VerifyIdentifyExplanation')) + " ", 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", {
+        innerHTML: _ctx.$sanitize(_ctx.learnMoreText)
+      }, null, 8, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_14), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_15, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_16, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_DontHaveYourMobileDevice')), 1), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_17, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_18, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_EnterRecoveryCodeInstead')), 1), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_19, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        href: _ctx.mailToLink,
+        rel: "noreferrer noopener"
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_AskSuperUserResetAuthenticationCode')), 9, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_20), LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_21, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        href: _ctx.logoutLink,
+        rel: "noreferrer noopener"
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Logout')), 9, LoginTwoFactorAuthvue_type_template_id_31d48052_hoisted_22)])];
+    }),
+    _: 1
+  }, 8, ["content-title"]);
+}
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue?vue&type=template&id=31d48052
+
+// EXTERNAL MODULE: external "Login"
+var external_Login_ = __webpack_require__("5b81");
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue?vue&type=script&lang=ts
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+
+
+
+/* harmony default export */ var LoginTwoFactorAuthvue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({
+  props: {
+    formData: {
+      type: Object,
+      required: true
+    },
+    accessErrorString: String,
+    formNonce: {
+      type: String,
+      required: true
+    },
+    loginModule: {
+      type: String,
+      required: true
+    },
+    piwikUrl: String,
+    userLogin: {
+      type: String,
+      required: true
+    },
+    contactEmail: {
+      type: String,
+      required: true
+    }
+  },
+  components: {
+    ContentBlock: external_CoreHome_["ContentBlock"],
+    Notification: external_CoreHome_["Notification"],
+    FormErrors: external_Login_["FormErrors"]
+  },
+  computed: {
+    learnMoreText: function learnMoreText() {
+      var link = 'https://matomo.org/faq/general/faq_27245';
+      return Object(external_CoreHome_["translate"])('General_LearnMore', "<a href=\"".concat(link, "\" rel=\"noreferrer noopener\" target=\"_blank\">"), '</a>');
+    },
+    mailToLink: function mailToLink() {
+      return "mailto:".concat(this.contactEmail, "?").concat(external_CoreHome_["MatomoUrl"].stringify({
+        subject: Object(external_CoreHome_["translate"])('TwoFactorAuth_NotPossibleToLogIn'),
+        body: Object(external_CoreHome_["translate"])('TwoFactorAuth_LostAuthenticationDevice', '\n\n', '\n\n', this.piwikUrl || '', '\n\n', this.userLogin, 'https://matomo.org/faq/how-to/faq_27248')
+      }));
+    },
+    logoutLink: function logoutLink() {
+      return "?".concat(external_CoreHome_["MatomoUrl"].stringify({
+        module: this.loginModule,
+        action: 'logout'
+      }));
+    },
+    formDataAttributes: function formDataAttributes() {
+      // convert html attribute string (ie 'a="b" d="f"') to JS object {a: "b", d: "f"}
+      return Object.fromEntries(this.formData.attributes.split(/\s+/g).filter(function (s) {
+        return s;
+      }).map(function (pair) {
+        return pair.split('=');
+      }).map(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+            name = _ref2[0],
+            value = _ref2[1];
+
+        return [name, external_CoreHome_["Matomo"].helper.htmlDecode(value.substr(1, value.length - 2))];
+      }));
+    }
+  }
+}));
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue?vue&type=script&lang=ts
+ 
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue
+
+
+
+LoginTwoFactorAuthvue_type_script_lang_ts.render = LoginTwoFactorAuthvue_type_template_id_31d48052_render
+
+/* harmony default export */ var LoginTwoFactorAuth = (LoginTwoFactorAuthvue_type_script_lang_ts);
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue?vue&type=template&id=29daa3be
+
+var SetupFinishedvue_type_template_id_29daa3be_hoisted_1 = {
+  class: "successMessage"
+};
+
+var SetupFinishedvue_type_template_id_29daa3be_hoisted_2 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var SetupFinishedvue_type_template_id_29daa3be_hoisted_3 = ["href"];
+function SetupFinishedvue_type_template_id_29daa3be_render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_ContentBlock = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ContentBlock");
+
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ContentBlock, {
+    class: "twoFactorSetupFinished"
+  }, {
+    default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", SetupFinishedvue_type_template_id_29daa3be_hoisted_1, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupFinishedTitle')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h3", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_SetupFinishedSubtitle')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [SetupFinishedvue_type_template_id_29daa3be_hoisted_2, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        class: "btn",
+        href: _ctx.userSecurityLink
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Continue')), 9, SetupFinishedvue_type_template_id_29daa3be_hoisted_3)])];
+    }),
+    _: 1
+  });
+}
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue?vue&type=template&id=29daa3be
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue?vue&type=script&lang=ts
+
+
+/* harmony default export */ var SetupFinishedvue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({
+  components: {
+    ContentBlock: external_CoreHome_["ContentBlock"]
+  },
+  computed: {
+    userSecurityLink: function userSecurityLink() {
+      return "?".concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, {
+        module: 'UsersManager',
+        action: 'userSecurity'
+      })));
+    }
+  }
+}));
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue?vue&type=script&lang=ts
+ 
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue
+
+
+
+SetupFinishedvue_type_script_lang_ts.render = SetupFinishedvue_type_template_id_29daa3be_render
+
+/* harmony default export */ var SetupFinished = (SetupFinishedvue_type_script_lang_ts);
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue?vue&type=template&id=476c7314
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_1 = ["innerHTML"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_2 = {
+  key: 0
+};
+var UserSettingsvue_type_template_id_476c7314_hoisted_3 = {
+  class: "twoFaStatusEnabled"
+};
+var UserSettingsvue_type_template_id_476c7314_hoisted_4 = {
+  key: 1
+};
+var UserSettingsvue_type_template_id_476c7314_hoisted_5 = {
+  key: 0
+};
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_6 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_7 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_8 = ["href"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_9 = {
+  key: 1
+};
+var UserSettingsvue_type_template_id_476c7314_hoisted_10 = ["href"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_11 = ["href"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_12 = ["value"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_13 = ["href"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_14 = {
+  key: 2
+};
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_15 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_16 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1);
+
+var UserSettingsvue_type_template_id_476c7314_hoisted_17 = ["href"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_18 = {
+  id: "confirmDisable2FA",
+  class: "ui-confirm",
+  ref: "confirmDisable2FA"
+};
+var UserSettingsvue_type_template_id_476c7314_hoisted_19 = ["value"];
+var UserSettingsvue_type_template_id_476c7314_hoisted_20 = ["value"];
+function UserSettingsvue_type_template_id_476c7314_render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_ContentBlock = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ContentBlock");
+
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ContentBlock, {
+    "content-title": _ctx.contentTitle,
+    class: "userSettings2FA"
+  }, {
+    default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", {
+        innerHTML: _ctx.$sanitize(_ctx.twoFactorAuthIntro)
+      }, null, 8, UserSettingsvue_type_template_id_476c7314_hoisted_1), _ctx.isEnabled ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("p", UserSettingsvue_type_template_id_476c7314_hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", UserSettingsvue_type_template_id_476c7314_hoisted_3, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_TwoFactorAuthenticationIsEnabled')), 1)])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), _ctx.isEnabled ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("p", UserSettingsvue_type_template_id_476c7314_hoisted_4, [_ctx.isForced ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", UserSettingsvue_type_template_id_476c7314_hoisted_5, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_TwoFactorAuthenticationRequired')) + " ", 1), UserSettingsvue_type_template_id_476c7314_hoisted_6, UserSettingsvue_type_template_id_476c7314_hoisted_7, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        class: "btn btn-link enable2FaLink",
+        href: _ctx.setupTwoFactorAuthLink,
+        style: {
+          "margin-right": "3.5px"
+        }
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_ConfigureDifferentDevice')), 9, UserSettingsvue_type_template_id_476c7314_hoisted_8)])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", UserSettingsvue_type_template_id_476c7314_hoisted_9, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        class: "btn btn-link enable2FaLink",
+        href: _ctx.setupTwoFactorAuthLink,
+        style: {
+          "margin-right": "3.5px"
+        }
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_ConfigureDifferentDevice')), 9, UserSettingsvue_type_template_id_476c7314_hoisted_10), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        href: _ctx.disableTwoFactorAuthLink,
+        style: {
+          "display": "none"
+        },
+        id: "disable2fa"
+      }, "disable2fa", 8, UserSettingsvue_type_template_id_476c7314_hoisted_11), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        type: "button",
+        class: "btn btn-link disable2FaLink",
+        onClick: _cache[0] || (_cache[0] = function ($event) {
+          return _ctx.onDisable2FaLinkClick();
+        }),
+        value: _ctx.translate('TwoFactorAuth_DisableTwoFA'),
+        style: {
+          "margin-right": "3.5px"
+        }
+      }, null, 8, UserSettingsvue_type_template_id_476c7314_hoisted_12)])), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        class: "btn btn-link showRecoveryCodesLink",
+        href: _ctx.showRecoveryCodesLink
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_ShowRecoveryCodes')), 9, UserSettingsvue_type_template_id_476c7314_hoisted_13)])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("p", UserSettingsvue_type_template_id_476c7314_hoisted_14, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("strong", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_TwoFactorAuthenticationIsDisabled')), 1), UserSettingsvue_type_template_id_476c7314_hoisted_15, UserSettingsvue_type_template_id_476c7314_hoisted_16, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+        class: "btn btn-link enable2FaLink",
+        href: _ctx.setupTwoFactorAuthLink
+      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_EnableTwoFA')), 9, UserSettingsvue_type_template_id_476c7314_hoisted_17)])), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", UserSettingsvue_type_template_id_476c7314_hoisted_18, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('TwoFactorAuth_ConfirmDisableTwoFA')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        role: "yes",
+        type: "button",
+        value: _ctx.translate('General_Yes')
+      }, null, 8, UserSettingsvue_type_template_id_476c7314_hoisted_19), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
+        role: "no",
+        type: "button",
+        value: _ctx.translate('General_No')
+      }, null, 8, UserSettingsvue_type_template_id_476c7314_hoisted_20)], 512)];
+    }),
+    _: 1
+  }, 8, ["content-title"]);
+}
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue?vue&type=template&id=476c7314
+
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue?vue&type=script&lang=ts
+
+
+/* harmony default export */ var UserSettingsvue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({
+  props: {
+    isEnabled: Boolean,
+    isForced: Boolean,
+    disableNonce: {
+      type: String,
+      required: true
+    }
+  },
+  components: {
+    ContentBlock: external_CoreHome_["ContentBlock"]
+  },
+  computed: {
+    contentTitle: function contentTitle() {
+      var part1 = Object(external_CoreHome_["translate"])('TwoFactorAuth_TwoFactorAuthentication');
+      var part2 = Object(external_CoreHome_["translate"])('TwoFactorAuth_TwoFAShort');
+      return "".concat(part1, " (").concat(part2, ")");
+    },
+    twoFactorAuthIntro: function twoFactorAuthIntro() {
+      var link = 'https://matomo.org/faq/general/faq_27245';
+      return Object(external_CoreHome_["translate"])('TwoFactorAuth_TwoFactorAuthenticationIntro', "<a href=\"".concat(link, "\" rel=\"noreferrer noopener\" target=\"_blank\">"), '</a>');
+    },
+    setupTwoFactorAuthLink: function setupTwoFactorAuthLink() {
+      return "?".concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, {
+        module: 'TwoFactorAuth',
+        action: 'setupTwoFactorAuth'
+      })));
+    },
+    disableTwoFactorAuthLink: function disableTwoFactorAuthLink() {
+      return "?".concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, {
+        module: 'TwoFactorAuth',
+        action: 'disableTwoFactorAuth',
+        disableNonce: this.disableNonce
+      })));
+    },
+    showRecoveryCodesLink: function showRecoveryCodesLink() {
+      return "?".concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, {
+        module: 'TwoFactorAuth',
+        action: 'showRecoveryCodes'
+      })));
+    }
+  },
+  methods: {
+    onDisable2FaLinkClick: function onDisable2FaLinkClick() {
+      var nonce = this.disableNonce;
+      external_CoreHome_["Matomo"].helper.modalConfirm(this.$refs.confirmDisable2FA, {
+        yes: function yes() {
+          external_CoreHome_["MatomoUrl"].updateUrl({
+            module: 'TwoFactorAuth',
+            action: 'disableTwoFactorAuth',
+            disableNonce: nonce
+          });
+        }
+      });
+    }
+  }
+}));
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue?vue&type=script&lang=ts
+ 
+// CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue
+
+
+
+UserSettingsvue_type_script_lang_ts.render = UserSettingsvue_type_template_id_476c7314_render
+
+/* harmony default export */ var UserSettings = (UserSettingsvue_type_script_lang_ts);
 // CONCATENATED MODULE: ./plugins/TwoFactorAuth/vue/src/index.ts
 /*!
  * Matomo - free/libre analytics platform
@@ -553,6 +1125,10 @@ SetupTwoFactorAuthvue_type_script_lang_ts.render = SetupTwoFactorAuthvue_type_te
  */
 
 
+
+
+
+
 // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib-no-default.js
 
 
diff --git a/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.min.js b/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.min.js
index 6c35b2cb19..ae71a3c44a 100644
--- a/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.min.js
+++ b/plugins/TwoFactorAuth/vue/dist/TwoFactorAuth.umd.min.js
@@ -1,10 +1,10 @@
-(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("vue"),require("CorePluginsAdmin")):"function"===typeof define&&define.amd?define(["CoreHome",,"CorePluginsAdmin"],t):"object"===typeof exports?exports["TwoFactorAuth"]=t(require("CoreHome"),require("vue"),require("CorePluginsAdmin")):e["TwoFactorAuth"]=t(e["CoreHome"],e["Vue"],e["CorePluginsAdmin"])})("undefined"!==typeof self?self:this,(function(e,t,o){return function(e){var t={};function o(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,o),r.l=!0,r.exports}return o.m=e,o.c=t,o.d=function(e,t,n){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},o.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)o.d(n,r,function(t){return e[t]}.bind(null,r));return n},o.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="plugins/TwoFactorAuth/vue/dist/",o(o.s="fae3")}({"19dc":function(t,o){t.exports=e},"8bbf":function(e,o){e.exports=t},a5a2:function(e,t){e.exports=o},fae3:function(e,t,o){"use strict";if(o.r(t),o.d(t,"ShowRecoveryCodes",(function(){return h})),o.d(t,"SetupTwoFactorAuth",(function(){return J})),"undefined"!==typeof window){var n=window.document.currentScript,r=n&&n.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);r&&(o.p=r[1])}var c=o("8bbf"),a=Object(c["createElementVNode"])("br",null,null,-1),l=Object(c["createElementVNode"])("br",null,null,-1),i={class:"alert alert-warning"},u={key:0,class:"twoFactorRecoveryCodes browser-default"},s={key:1,class:"alert alert-danger"},d=Object(c["createElementVNode"])("br",null,null,-1),p=["value"],b=["value"],m=["value"];function O(e,t,o,n,r,O){var j,f=Object(c["resolveDirective"])("select-on-focus");return Object(c["openBlock"])(),Object(c["createElementBlock"])("div",null,[Object(c["createElementVNode"])("p",null,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesExplanation")),1),a,l]),Object(c["createElementVNode"])("div",i,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesSecurity")),1),null!==(j=e.codes)&&void 0!==j&&j.length?Object(c["withDirectives"])((Object(c["openBlock"])(),Object(c["createElementBlock"])("ul",u,[(Object(c["openBlock"])(!0),Object(c["createElementBlock"])(c["Fragment"],null,Object(c["renderList"])(e.codes,(function(e,t){return Object(c["openBlock"])(),Object(c["createElementBlock"])("li",{key:t},Object(c["toDisplayString"])(e.toUpperCase().match(/.{1,4}/g).join("-")),1)})),128))],512)),[[f,{}]]):(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",s,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesAllUsed")),1)),Object(c["createElementVNode"])("p",null,[d,Object(c["createElementVNode"])("input",{type:"button",class:"btn backupRecoveryCode",onClick:t[0]||(t[0]=function(t){e.downloadRecoveryCodes(),e.$emit("downloaded")}),value:e.translate("General_Download"),style:{"margin-right":"3.5px"}},null,8,p),Object(c["createElementVNode"])("input",{type:"button",class:"btn backupRecoveryCode",onClick:t[1]||(t[1]=function(t){e.print(),e.$emit("downloaded")}),value:e.translate("General_Print"),style:{"margin-right":"3.5px"}},null,8,b),Object(c["createElementVNode"])("input",{type:"button",class:"btn backupRecoveryCode",onClick:t[2]||(t[2]=function(t){e.copyRecoveryCodesToClipboard(),e.$emit("downloaded")}),value:e.translate("General_Copy")},null,8,m)])])}var j=o("19dc"),f=Object(c["defineComponent"])({props:{codes:{type:Array,default:function(){return[]}}},directives:{SelectOnFocus:j["SelectOnFocus"]},emits:["downloaded"],methods:{copyRecoveryCodesToClipboard:function(){var e=document.createElement("textarea");e.value=this.codes.join("\n"),e.setAttribute("readonly",""),e.style.position="absolute",e.style.left="-9999px",document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e)},downloadRecoveryCodes:function(){j["Matomo"].helper.sendContentAsDownload("analytics_recovery_codes.txt",this.codes.join("\n"))},print:function(){window.print()}}});f.render=O;var h=f,y={class:"setupTwoFactorAuthentication",ref:"root"},v={key:0,class:"alert alert-warning"},w=["disabled"],S=Object(c["createElementVNode"])("a",{name:"twoFactorStep2",id:"twoFactorStep2",style:{opacity:"0"}},null,-1),g=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://github.com/andOTP/andOTP#downloads"},"andOTP",-1),C=Object(c["createTextVNode"])(", "),N=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://authy.com/guides/github/"},"Authy",-1),V=Object(c["createTextVNode"])(", "),E=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://support.1password.com/one-time-passwords/"},"1Password",-1),T=Object(c["createTextVNode"])(", "),A=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://helpdesk.lastpass.com/multifactor-authentication-options/lastpass-authenticator/"},"LastPass Authenticator",-1),k=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://support.google.com/accounts/answer/1066447"},"Google Authenticator",-1),F=Object(c["createTextVNode"])(". "),_=["innerHTML"],D=Object(c["createElementVNode"])("br",null,null,-1),x={id:"qrcode",ref:"qrcode",title:""},R=Object(c["createElementVNode"])("br",null,null,-1),B=Object(c["createElementVNode"])("a",{name:"twoFactorStep3",id:"twoFactorStep3",style:{opacity:"0"}},null,-1),P={key:0,class:"message_container"},M=Object(c["createTextVNode"])(": "),q=["innerHTML"],G=Object(c["createElementVNode"])("br",null,null,-1),H=["action"],$=["value"],L=["disabled","value"];function U(e,t,o,n,r,a){var l=this,i=Object(c["resolveComponent"])("ShowRecoveryCodes"),u=Object(c["resolveComponent"])("Notification"),s=Object(c["resolveComponent"])("Field");return Object(c["openBlock"])(),Object(c["createElementBlock"])("div",y,[e.isAlreadyUsing2fa?(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",v,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_WarningChangingConfiguredDevice")),1)):Object(c["createCommentVNode"])("",!0),Object(c["createElementVNode"])("p",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupIntroFollowSteps")),1),Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_StepX",1))+" - "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodes")),1),Object(c["createVNode"])(i,{codes:e.codes,onDownloaded:t[0]||(t[0]=function(e){return l.hasDownloadedRecoveryCode=!0})},null,8,["codes"]),Object(c["withDirectives"])(Object(c["createElementVNode"])("div",{class:"alert alert-info backupRecoveryCodesAlert"},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupBackupRecoveryCodes")),513),[[c["vShow"],1===e.step]]),Object(c["createElementVNode"])("p",null,[Object(c["withDirectives"])(Object(c["createElementVNode"])("button",{class:"btn goToStep2",onClick:t[1]||(t[1]=function(t){return e.nextStep()}),disabled:!e.hasDownloadedRecoveryCode},Object(c["toDisplayString"])(e.translate("General_Next")),9,w),[[c["vShow"],1===e.step]])]),S,Object(c["withDirectives"])(Object(c["createElementVNode"])("div",null,[Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_StepX",2))+" - "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupAuthenticatorOnDevice")),1),Object(c["createElementVNode"])("p",null,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupAuthenticatorOnDeviceStep1"))+" ",1),g,C,N,V,E,T,A,Object(c["createTextVNode"])(", "+Object(c["toDisplayString"])(e.translate("General_Or"))+" ",1),k,F]),Object(c["createElementVNode"])("p",null,[Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(e.setupAuthenticatorOnDeviceStep2)},null,8,_)]),Object(c["createElementVNode"])("p",null,[D,Object(c["createElementVNode"])("span",x,null,512)]),Object(c["createElementVNode"])("p",null,[R,Object(c["withDirectives"])(Object(c["createElementVNode"])("button",{class:"btn goToStep3",onClick:t[2]||(t[2]=function(t){return e.nextStep()})},Object(c["toDisplayString"])(e.translate("General_Next")),513),[[c["vShow"],2===e.step]])])],512),[[c["vShow"],e.step>=2]]),B,Object(c["withDirectives"])(Object(c["createElementVNode"])("div",null,[Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_StepX",3))+" - "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_ConfirmSetup")),1),Object(c["createElementVNode"])("p",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_VerifyAuthCodeIntro")),1),e.accessErrorString?(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",P,[Object(c["createElementVNode"])("div",null,[Object(c["createVNode"])(u,{noclear:!0,context:"error"},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("strong",null,Object(c["toDisplayString"])(e.translate("General_Error")),1),M,Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(e.accessErrorString)},null,8,q),G]})),_:1})])])):Object(c["createCommentVNode"])("",!0),Object(c["createElementVNode"])("form",{method:"post",class:"setupConfirmAuthCodeForm",autocorrect:"off",autocapitalize:"none",autocomplete:"off",action:e.linkTo({module:"TwoFactorAuth",action:e.submitAction})},[Object(c["createElementVNode"])("div",null,[Object(c["createVNode"])(s,{uicontrol:"text",name:"authCode",title:e.translate("TwoFactorAuth_AuthenticationCode"),modelValue:e.authCode,"onUpdate:modelValue":t[3]||(t[3]=function(t){return e.authCode=t}),maxlength:6,placeholder:"123456","inline-help":e.translate("TwoFactorAuth_VerifyAuthCodeHelp")},null,8,["title","modelValue","inline-help"])]),Object(c["createElementVNode"])("input",{type:"hidden",name:"authCodeNonce",value:e.authCodeNonce},null,8,$),Object(c["createElementVNode"])("input",{type:"submit",class:"btn confirmAuthCode",disabled:6!==e.authCode.length,value:e.translate("General_Confirm")},null,8,L)],8,H)],512),[[c["vShow"],e.step>=3]])],512)}var z=o("a5a2"),X=window,I=X.QRCode,Q=X.$,W=Object(c["defineComponent"])({props:{isAlreadyUsing2fa:Boolean,accessErrorString:String,submitAction:{type:String,required:!0},authCodeNonce:{type:String,required:!0},codes:Array},components:{ShowRecoveryCodes:h,Notification:j["Notification"],Field:z["Field"]},directives:{SelectOnFocus:j["SelectOnFocus"]},data:function(){return{step:1,hasDownloadedRecoveryCode:!1,authCode:""}},mounted:function(){var e=this;setTimeout((function(){var t=e.$refs.qrcode;new I(t,{text:window.twoFaBarCodeSetupUrl}),Q(t).attr("title",""),e.accessErrorString&&(e.step=3,e.scrollToEnd()),Q(e.$refs.root).on("click",".setupStep2Link",(function(e){e.preventDefault(),j["Matomo"].helper.modalConfirm("#setupTwoFAsecretConfirm")}))}))},methods:{scrollToEnd:function(){var e=this;setTimeout((function(){var t="";2===e.step?t="#twoFactorStep2":3===e.step&&(t="#twoFactorStep3"),t&&j["Matomo"].helper.lazyScrollTo(t,50,!0)}),50)},nextStep:function(){this.step+=1,this.scrollToEnd()},linkTo:function(e){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),e)))}},computed:{setupAuthenticatorOnDeviceStep2:function(){return Object(j["translate"])("TwoFactorAuth_SetupAuthenticatorOnDeviceStep2",'<a class="setupStep2Link">',"</a>")}}});
+(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("Login"),require("vue"),require("CorePluginsAdmin")):"function"===typeof define&&define.amd?define(["CoreHome","Login",,"CorePluginsAdmin"],t):"object"===typeof exports?exports["TwoFactorAuth"]=t(require("CoreHome"),require("Login"),require("vue"),require("CorePluginsAdmin")):e["TwoFactorAuth"]=t(e["CoreHome"],e["Login"],e["Vue"],e["CorePluginsAdmin"])})("undefined"!==typeof self?self:this,(function(e,t,o,n){return function(e){var t={};function o(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,o),r.l=!0,r.exports}return o.m=e,o.c=t,o.d=function(e,t,n){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},o.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)o.d(n,r,function(t){return e[t]}.bind(null,r));return n},o.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="plugins/TwoFactorAuth/vue/dist/",o(o.s="fae3")}({"19dc":function(t,o){t.exports=e},"5b81":function(e,o){e.exports=t},"8bbf":function(e,t){e.exports=o},a5a2:function(e,t){e.exports=n},fae3:function(e,t,o){"use strict";if(o.r(t),o.d(t,"ShowRecoveryCodes",(function(){return h})),o.d(t,"ShowRecoveryCodesPage",(function(){return V})),o.d(t,"SetupTwoFactorAuth",(function(){return se})),o.d(t,"LoginTwoFactorAuth",(function(){return Ge})),o.d(t,"SetupFinished",(function(){return Ye})),o.d(t,"UserSettings",(function(){return ft})),"undefined"!==typeof window){var n=window.document.currentScript,r=n&&n.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);r&&(o.p=r[1])}var c=o("8bbf"),a=Object(c["createElementVNode"])("br",null,null,-1),l=Object(c["createElementVNode"])("br",null,null,-1),i={class:"alert alert-warning"},u={key:0,class:"twoFactorRecoveryCodes browser-default"},s={key:1,class:"alert alert-danger"},d=Object(c["createElementVNode"])("br",null,null,-1),b=["value"],p=["value"],m=["value"];function O(e,t,o,n,r,O){var j,f=Object(c["resolveDirective"])("select-on-focus");return Object(c["openBlock"])(),Object(c["createElementBlock"])("div",null,[Object(c["createElementVNode"])("p",null,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesExplanation")),1),a,l]),Object(c["createElementVNode"])("div",i,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesSecurity")),1),null!==(j=e.codes)&&void 0!==j&&j.length?Object(c["withDirectives"])((Object(c["openBlock"])(),Object(c["createElementBlock"])("ul",u,[(Object(c["openBlock"])(!0),Object(c["createElementBlock"])(c["Fragment"],null,Object(c["renderList"])(e.codes,(function(e,t){return Object(c["openBlock"])(),Object(c["createElementBlock"])("li",{key:t},Object(c["toDisplayString"])(e.toUpperCase().match(/.{1,4}/g).join("-")),1)})),128))],512)),[[f,{}]]):(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",s,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesAllUsed")),1)),Object(c["createElementVNode"])("p",null,[d,Object(c["createElementVNode"])("input",{type:"button",class:"btn backupRecoveryCode",onClick:t[0]||(t[0]=function(t){e.downloadRecoveryCodes(),e.$emit("downloaded")}),value:e.translate("General_Download"),style:{"margin-right":"3.5px"}},null,8,b),Object(c["createElementVNode"])("input",{type:"button",class:"btn backupRecoveryCode",onClick:t[1]||(t[1]=function(t){e.print(),e.$emit("downloaded")}),value:e.translate("General_Print"),style:{"margin-right":"3.5px"}},null,8,p),Object(c["createElementVNode"])("input",{type:"button",class:"btn backupRecoveryCode",onClick:t[2]||(t[2]=function(t){e.copyRecoveryCodesToClipboard(),e.$emit("downloaded")}),value:e.translate("General_Copy")},null,8,m)])])}var j=o("19dc"),f=Object(c["defineComponent"])({props:{codes:{type:Array,default:function(){return[]}}},directives:{SelectOnFocus:j["SelectOnFocus"]},emits:["downloaded"],methods:{copyRecoveryCodesToClipboard:function(){var e=document.createElement("textarea");e.value=this.codes.join("\n"),e.setAttribute("readonly",""),e.style.position="absolute",e.style.left="-9999px",document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e)},downloadRecoveryCodes:function(){j["Matomo"].helper.sendContentAsDownload("analytics_recovery_codes.txt",this.codes.join("\n"))},print:function(){window.print()}}});f.render=O;var h=f,y=Object(c["createElementVNode"])("br",null,null,-1),g=Object(c["createElementVNode"])("br",null,null,-1),v={key:0,class:"alert alert-success"},w={key:1,class:"alert alert-danger"},N=["action"],E=["value"],S=["value"];function T(e,t,o,n,r,a){var l=Object(c["resolveComponent"])("ShowRecoveryCodes"),i=Object(c["resolveComponent"])("ContentBlock");return Object(c["openBlock"])(),Object(c["createBlock"])(i,{"content-title":e.contentTitle},{default:Object(c["withCtx"])((function(){return[Object(c["createVNode"])(l,{codes:e.codes},null,8,["codes"]),Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_GenerateNewRecoveryCodes")),1),Object(c["createElementVNode"])("p",null,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_GenerateNewRecoveryCodesInfo")),1),y,g]),e.regenerateSuccess?(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",v,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodesRegenerated")),1)):Object(c["createCommentVNode"])("",!0),e.regenerateError?(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",w,Object(c["toDisplayString"])(e.translate("General_ExceptionNonceMismatch")),1)):Object(c["createCommentVNode"])("",!0),Object(c["createElementVNode"])("form",{method:"post",action:e.showRecoveryCodesLink},[Object(c["createElementVNode"])("input",{type:"hidden",name:"regenerateNonce",value:e.regenerateNonce},null,8,E),Object(c["createElementVNode"])("input",{type:"submit",class:"btn",value:e.translate("TwoFactorAuth_GenerateNewRecoveryCodes")},null,8,S)],8,N)]})),_:1},8,["content-title"])}var C=Object(c["defineComponent"])({props:{codes:Array,regenerateSuccess:Boolean,regenerateError:Boolean,regenerateNonce:{type:String,required:!0}},components:{ContentBlock:j["ContentBlock"],ShowRecoveryCodes:h},computed:{contentTitle:function(){var e=Object(j["translate"])("TwoFactorAuth_TwoFactorAuthentication"),t=Object(j["translate"])("TwoFactorAuth_RecoveryCodes");return"".concat(e," - ").concat(t)},showRecoveryCodesLink:function(){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),{},{module:"TwoFactorAuth",action:"showRecoveryCodes"})))}}});C.render=T;var V=C,A={class:"setupTwoFactorAuthentication",ref:"root"},F={key:0,class:"alert alert-warning"},k=["disabled"],_=Object(c["createElementVNode"])("a",{name:"twoFactorStep2",id:"twoFactorStep2",style:{opacity:"0"}},null,-1),D=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://github.com/andOTP/andOTP#downloads"},"andOTP",-1),x=Object(c["createTextVNode"])(", "),B=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://authy.com/guides/github/"},"Authy",-1),L=Object(c["createTextVNode"])(", "),M=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://support.1password.com/one-time-passwords/"},"1Password",-1),R=Object(c["createTextVNode"])(", "),q=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://helpdesk.lastpass.com/multifactor-authentication-options/lastpass-authenticator/"},"LastPass Authenticator",-1),U=Object(c["createElementVNode"])("a",{target:"_blank",rel:"noreferrer noopener",href:"https://support.google.com/accounts/answer/1066447"},"Google Authenticator",-1),P=Object(c["createTextVNode"])(". "),G=["innerHTML"],H=Object(c["createElementVNode"])("br",null,null,-1),I={id:"qrcode",ref:"qrcode",title:""},$=Object(c["createElementVNode"])("br",null,null,-1),z=Object(c["createElementVNode"])("a",{name:"twoFactorStep3",id:"twoFactorStep3",style:{opacity:"0"}},null,-1),X={key:0,class:"message_container"},Y=Object(c["createTextVNode"])(": "),Q=["innerHTML"],W=Object(c["createElementVNode"])("br",null,null,-1),J=["action"],K=["value"],Z=["disabled","value"],ee={id:"setupTwoFAsecretConfirm",class:"ui-confirm"},te={style:{"text-align":"center"}},oe={style:{"font-size":"30px"}},ne=["value"];function re(e,t,o,n,r,a){var l=this,i=Object(c["resolveComponent"])("ShowRecoveryCodes"),u=Object(c["resolveComponent"])("Notification"),s=Object(c["resolveComponent"])("Field"),d=Object(c["resolveComponent"])("ContentBlock"),b=Object(c["resolveDirective"])("select-on-focus");return Object(c["openBlock"])(),Object(c["createBlock"])(d,{"content-title":e.standalone?e.translate("TwoFactorAuth_RequiredToSetUpTwoFactorAuthentication"):e.translate("TwoFactorAuth_SetUpTwoFactorAuthentication")},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("div",A,[e.isAlreadyUsing2fa?(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",F,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_WarningChangingConfiguredDevice")),1)):Object(c["createCommentVNode"])("",!0),Object(c["createElementVNode"])("p",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupIntroFollowSteps")),1),Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_StepX",1))+" - "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_RecoveryCodes")),1),Object(c["createVNode"])(i,{codes:e.codes,onDownloaded:t[0]||(t[0]=function(e){return l.hasDownloadedRecoveryCode=!0})},null,8,["codes"]),Object(c["withDirectives"])(Object(c["createElementVNode"])("div",{class:"alert alert-info backupRecoveryCodesAlert"},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupBackupRecoveryCodes")),513),[[c["vShow"],1===e.step]]),Object(c["createElementVNode"])("p",null,[Object(c["withDirectives"])(Object(c["createElementVNode"])("button",{class:"btn goToStep2",onClick:t[1]||(t[1]=function(t){return e.nextStep()}),disabled:!e.hasDownloadedRecoveryCode},Object(c["toDisplayString"])(e.translate("General_Next")),9,k),[[c["vShow"],1===e.step]])]),_,Object(c["withDirectives"])(Object(c["createElementVNode"])("div",null,[Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_StepX",2))+" - "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupAuthenticatorOnDevice")),1),Object(c["createElementVNode"])("p",null,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupAuthenticatorOnDeviceStep1"))+" ",1),D,x,B,L,M,R,q,Object(c["createTextVNode"])(", "+Object(c["toDisplayString"])(e.translate("General_Or"))+" ",1),U,P]),Object(c["createElementVNode"])("p",null,[Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(e.setupAuthenticatorOnDeviceStep2)},null,8,G)]),Object(c["createElementVNode"])("p",null,[H,Object(c["createElementVNode"])("span",I,null,512)]),Object(c["createElementVNode"])("p",null,[$,Object(c["withDirectives"])(Object(c["createElementVNode"])("button",{class:"btn goToStep3",onClick:t[2]||(t[2]=function(t){return e.nextStep()})},Object(c["toDisplayString"])(e.translate("General_Next")),513),[[c["vShow"],2===e.step]])])],512),[[c["vShow"],e.step>=2]]),z,Object(c["withDirectives"])(Object(c["createElementVNode"])("div",null,[Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_StepX",3))+" - "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_ConfirmSetup")),1),Object(c["createElementVNode"])("p",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_VerifyAuthCodeIntro")),1),e.accessErrorString?(Object(c["openBlock"])(),Object(c["createElementBlock"])("div",X,[Object(c["createElementVNode"])("div",null,[Object(c["createVNode"])(u,{noclear:!0,context:"error"},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("strong",null,Object(c["toDisplayString"])(e.translate("General_Error")),1),Y,Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(e.accessErrorString)},null,8,Q),W]})),_:1})])])):Object(c["createCommentVNode"])("",!0),Object(c["createElementVNode"])("form",{method:"post",class:"setupConfirmAuthCodeForm",autocorrect:"off",autocapitalize:"none",autocomplete:"off",action:e.linkTo({module:"TwoFactorAuth",action:e.submitAction})},[Object(c["createElementVNode"])("div",null,[Object(c["createVNode"])(s,{uicontrol:"text",name:"authCode",title:e.translate("TwoFactorAuth_AuthenticationCode"),modelValue:e.authCode,"onUpdate:modelValue":t[3]||(t[3]=function(t){return e.authCode=t}),maxlength:6,placeholder:"123456","inline-help":e.translate("TwoFactorAuth_VerifyAuthCodeHelp")},null,8,["title","modelValue","inline-help"])]),Object(c["createElementVNode"])("input",{type:"hidden",name:"authCodeNonce",value:e.authCodeNonce},null,8,K),Object(c["createElementVNode"])("input",{type:"submit",class:"btn confirmAuthCode",disabled:6!==e.authCode.length,value:e.translate("General_Confirm")},null,8,Z)],8,J)],512),[[c["vShow"],e.step>=3]]),Object(c["createElementVNode"])("div",ee,[Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_Your2FaAuthSecret")),1),Object(c["createElementVNode"])("p",te,[Object(c["withDirectives"])(Object(c["createElementVNode"])("code",oe,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.newSecret),1)],512),[[b,{}]])]),Object(c["createElementVNode"])("input",{role:"ok",type:"button",value:e.translate("General_Ok")},null,8,ne)])],512)]})),_:1},8,["content-title"])}var ce=o("a5a2"),ae=window,le=ae.QRCode,ie=ae.$,ue=Object(c["defineComponent"])({props:{isAlreadyUsing2fa:Boolean,accessErrorString:String,submitAction:{type:String,required:!0},authCodeNonce:{type:String,required:!0},codes:Array,twoFaBarCodeSetupUrl:{type:String,required:!0},standalone:Boolean},components:{ShowRecoveryCodes:h,Notification:j["Notification"],Field:ce["Field"],ContentBlock:j["ContentBlock"]},directives:{SelectOnFocus:j["SelectOnFocus"]},data:function(){return{step:1,hasDownloadedRecoveryCode:!1,authCode:""}},mounted:function(){var e=this;setTimeout((function(){var t=e.$refs.qrcode;new le(t,{text:e.twoFaBarCodeSetupUrl}),ie(t).attr("title",""),e.accessErrorString&&(e.step=3,e.scrollToEnd()),ie(e.$refs.root).on("click",".setupStep2Link",(function(e){e.preventDefault(),j["Matomo"].helper.modalConfirm("#setupTwoFAsecretConfirm")}))}))},methods:{scrollToEnd:function(){var e=this;setTimeout((function(){var t="";2===e.step?t="#twoFactorStep2":3===e.step&&(t="#twoFactorStep3"),t&&j["Matomo"].helper.lazyScrollTo(t,50,!0)}),50)},nextStep:function(){this.step+=1,this.scrollToEnd()},linkTo:function(e){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),e)))}},computed:{setupAuthenticatorOnDeviceStep2:function(){return Object(j["translate"])("TwoFactorAuth_SetupAuthenticatorOnDeviceStep2",'<a class="setupStep2Link">',"</a>")}}});
 /*!
  * Matomo - free/libre analytics platform
  *
  * @link https://matomo.org
  * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
- */W.render=U;var J=W;
+ */ue.render=re;var se=ue,de={class:"message_container"},be=Object(c["createTextVNode"])(": "),pe=["innerHTML"],me=Object(c["createElementVNode"])("br",null,null,-1),Oe={class:"row"},je={class:"col s12 input-field"},fe=["value"],he=Object(c["createElementVNode"])("input",{type:"text",name:"form_authcode",placeholder:"",id:"login_form_authcode",class:"input",value:"",size:"20",autocorrect:"off",autocapitalize:"none",autocomplete:"off",tabindex:"10",autofocus:"autofocus"},null,-1),ye={for:"login_form_authcode"},ge=Object(c["createElementVNode"])("i",{class:"icon-user icon"},null,-1),ve={class:"row actions"},we={class:"col s12"},Ne=["value"],Ee=["innerHTML"],Se=Object(c["createElementVNode"])("br",null,null,-1),Te=Object(c["createElementVNode"])("br",null,null,-1),Ce=Object(c["createElementVNode"])("br",null,null,-1),Ve={href:"https://matomo.org/faq/how-to/faq_27248",rel:"noreferrer noopener",target:"_blank"},Ae=Object(c["createElementVNode"])("br",null,null,-1),Fe=["href"],ke=Object(c["createElementVNode"])("br",null,null,-1),_e=["href"];function De(e,t,o,n,r,a){var l=Object(c["resolveComponent"])("FormErrors"),i=Object(c["resolveComponent"])("Notification"),u=Object(c["resolveComponent"])("ContentBlock");return Object(c["openBlock"])(),Object(c["createBlock"])(u,{"content-title":e.translate("TwoFactorAuth_TwoFactorAuthentication")},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("div",de,[Object(c["createVNode"])(l,{"form-errors":e.formData.errors},null,8,["form-errors"]),e.accessErrorString?(Object(c["openBlock"])(),Object(c["createBlock"])(i,{key:0,noclear:!0,context:"error"},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("strong",null,Object(c["toDisplayString"])(e.translate("General_Error")),1),be,Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(e.accessErrorString)},null,8,pe),me]})),_:1})):Object(c["createCommentVNode"])("",!0)]),Object(c["createElementVNode"])("form",Object(c["mergeProps"])(e.formDataAttributes,{class:"loginTwoFaForm"}),[Object(c["createElementVNode"])("div",Oe,[Object(c["createElementVNode"])("div",je,[Object(c["createElementVNode"])("input",{type:"hidden",name:"form_nonce",id:"login_form_nonce",value:e.formNonce},null,8,fe),he,Object(c["createElementVNode"])("label",ye,[ge,Object(c["createTextVNode"])(" "+Object(c["toDisplayString"])(e.translate("TwoFactorAuth_AuthenticationCode")),1)])])]),Object(c["createElementVNode"])("div",ve,[Object(c["createElementVNode"])("div",we,[Object(c["createElementVNode"])("input",{class:"submit btn",id:"login_form_submit",type:"submit",value:e.translate("TwoFactorAuth_Verify"),tabindex:"100"},null,8,Ne)])])],16),Object(c["createElementVNode"])("p",null,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_VerifyIdentifyExplanation"))+" ",1),Object(c["createElementVNode"])("span",{innerHTML:e.$sanitize(e.learnMoreText)},null,8,Ee),Se,Te,Object(c["createElementVNode"])("strong",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_DontHaveYourMobileDevice")),1),Ce,Object(c["createElementVNode"])("a",Ve,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_EnterRecoveryCodeInstead")),1),Ae,Object(c["createElementVNode"])("a",{href:e.mailToLink,rel:"noreferrer noopener"},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_AskSuperUserResetAuthenticationCode")),9,Fe),ke,Object(c["createElementVNode"])("a",{href:e.logoutLink,rel:"noreferrer noopener"},Object(c["toDisplayString"])(e.translate("General_Logout")),9,_e)])]})),_:1},8,["content-title"])}var xe=o("5b81");function Be(e,t){return Ue(e)||qe(e,t)||Me(e,t)||Le()}function Le(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function Me(e,t){if(e){if("string"===typeof e)return Re(e,t);var o=Object.prototype.toString.call(e).slice(8,-1);return"Object"===o&&e.constructor&&(o=e.constructor.name),"Map"===o||"Set"===o?Array.from(e):"Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o)?Re(e,t):void 0}}function Re(e,t){(null==t||t>e.length)&&(t=e.length);for(var o=0,n=new Array(t);o<t;o++)n[o]=e[o];return n}function qe(e,t){var o=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=o){var n,r,c=[],a=!0,l=!1;try{for(o=o.call(e);!(a=(n=o.next()).done);a=!0)if(c.push(n.value),t&&c.length===t)break}catch(i){l=!0,r=i}finally{try{a||null==o["return"]||o["return"]()}finally{if(l)throw r}}return c}}function Ue(e){if(Array.isArray(e))return e}var Pe=Object(c["defineComponent"])({props:{formData:{type:Object,required:!0},accessErrorString:String,formNonce:{type:String,required:!0},loginModule:{type:String,required:!0},piwikUrl:String,userLogin:{type:String,required:!0},contactEmail:{type:String,required:!0}},components:{ContentBlock:j["ContentBlock"],Notification:j["Notification"],FormErrors:xe["FormErrors"]},computed:{learnMoreText:function(){var e="https://matomo.org/faq/general/faq_27245";return Object(j["translate"])("General_LearnMore",'<a href="'.concat(e,'" rel="noreferrer noopener" target="_blank">'),"</a>")},mailToLink:function(){return"mailto:".concat(this.contactEmail,"?").concat(j["MatomoUrl"].stringify({subject:Object(j["translate"])("TwoFactorAuth_NotPossibleToLogIn"),body:Object(j["translate"])("TwoFactorAuth_LostAuthenticationDevice","\n\n","\n\n",this.piwikUrl||"","\n\n",this.userLogin,"https://matomo.org/faq/how-to/faq_27248")}))},logoutLink:function(){return"?".concat(j["MatomoUrl"].stringify({module:this.loginModule,action:"logout"}))},formDataAttributes:function(){return Object.fromEntries(this.formData.attributes.split(/\s+/g).filter((function(e){return e})).map((function(e){return e.split("=")})).map((function(e){var t=Be(e,2),o=t[0],n=t[1];return[o,j["Matomo"].helper.htmlDecode(n.substr(1,n.length-2))]})))}}});Pe.render=De;var Ge=Pe,He={class:"successMessage"},Ie=Object(c["createElementVNode"])("br",null,null,-1),$e=["href"];function ze(e,t,o,n,r,a){var l=Object(c["resolveComponent"])("ContentBlock");return Object(c["openBlock"])(),Object(c["createBlock"])(l,{class:"twoFactorSetupFinished"},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("h2",He,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupFinishedTitle")),1),Object(c["createElementVNode"])("h3",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_SetupFinishedSubtitle")),1),Object(c["createElementVNode"])("p",null,[Ie,Object(c["createElementVNode"])("a",{class:"btn",href:e.userSecurityLink},Object(c["toDisplayString"])(e.translate("General_Continue")),9,$e)])]})),_:1})}var Xe=Object(c["defineComponent"])({components:{ContentBlock:j["ContentBlock"]},computed:{userSecurityLink:function(){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),{},{module:"UsersManager",action:"userSecurity"})))}}});Xe.render=ze;var Ye=Xe,Qe=["innerHTML"],We={key:0},Je={class:"twoFaStatusEnabled"},Ke={key:1},Ze={key:0},et=Object(c["createElementVNode"])("br",null,null,-1),tt=Object(c["createElementVNode"])("br",null,null,-1),ot=["href"],nt={key:1},rt=["href"],ct=["href"],at=["value"],lt=["href"],it={key:2},ut=Object(c["createElementVNode"])("br",null,null,-1),st=Object(c["createElementVNode"])("br",null,null,-1),dt=["href"],bt={id:"confirmDisable2FA",class:"ui-confirm",ref:"confirmDisable2FA"},pt=["value"],mt=["value"];function Ot(e,t,o,n,r,a){var l=Object(c["resolveComponent"])("ContentBlock");return Object(c["openBlock"])(),Object(c["createBlock"])(l,{"content-title":e.contentTitle,class:"userSettings2FA"},{default:Object(c["withCtx"])((function(){return[Object(c["createElementVNode"])("p",{innerHTML:e.$sanitize(e.twoFactorAuthIntro)},null,8,Qe),e.isEnabled?(Object(c["openBlock"])(),Object(c["createElementBlock"])("p",We,[Object(c["createElementVNode"])("strong",Je,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_TwoFactorAuthenticationIsEnabled")),1)])):Object(c["createCommentVNode"])("",!0),e.isEnabled?(Object(c["openBlock"])(),Object(c["createElementBlock"])("p",Ke,[e.isForced?(Object(c["openBlock"])(),Object(c["createElementBlock"])("span",Ze,[Object(c["createTextVNode"])(Object(c["toDisplayString"])(e.translate("TwoFactorAuth_TwoFactorAuthenticationRequired"))+" ",1),et,tt,Object(c["createElementVNode"])("a",{class:"btn btn-link enable2FaLink",href:e.setupTwoFactorAuthLink,style:{"margin-right":"3.5px"}},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_ConfigureDifferentDevice")),9,ot)])):(Object(c["openBlock"])(),Object(c["createElementBlock"])("span",nt,[Object(c["createElementVNode"])("a",{class:"btn btn-link enable2FaLink",href:e.setupTwoFactorAuthLink,style:{"margin-right":"3.5px"}},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_ConfigureDifferentDevice")),9,rt),Object(c["createElementVNode"])("a",{href:e.disableTwoFactorAuthLink,style:{display:"none"},id:"disable2fa"},"disable2fa",8,ct),Object(c["createElementVNode"])("input",{type:"button",class:"btn btn-link disable2FaLink",onClick:t[0]||(t[0]=function(t){return e.onDisable2FaLinkClick()}),value:e.translate("TwoFactorAuth_DisableTwoFA"),style:{"margin-right":"3.5px"}},null,8,at)])),Object(c["createElementVNode"])("a",{class:"btn btn-link showRecoveryCodesLink",href:e.showRecoveryCodesLink},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_ShowRecoveryCodes")),9,lt)])):(Object(c["openBlock"])(),Object(c["createElementBlock"])("p",it,[Object(c["createElementVNode"])("strong",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_TwoFactorAuthenticationIsDisabled")),1),ut,st,Object(c["createElementVNode"])("a",{class:"btn btn-link enable2FaLink",href:e.setupTwoFactorAuthLink},Object(c["toDisplayString"])(e.translate("TwoFactorAuth_EnableTwoFA")),9,dt)])),Object(c["createElementVNode"])("div",bt,[Object(c["createElementVNode"])("h2",null,Object(c["toDisplayString"])(e.translate("TwoFactorAuth_ConfirmDisableTwoFA")),1),Object(c["createElementVNode"])("input",{role:"yes",type:"button",value:e.translate("General_Yes")},null,8,pt),Object(c["createElementVNode"])("input",{role:"no",type:"button",value:e.translate("General_No")},null,8,mt)],512)]})),_:1},8,["content-title"])}var jt=Object(c["defineComponent"])({props:{isEnabled:Boolean,isForced:Boolean,disableNonce:{type:String,required:!0}},components:{ContentBlock:j["ContentBlock"]},computed:{contentTitle:function(){var e=Object(j["translate"])("TwoFactorAuth_TwoFactorAuthentication"),t=Object(j["translate"])("TwoFactorAuth_TwoFAShort");return"".concat(e," (").concat(t,")")},twoFactorAuthIntro:function(){var e="https://matomo.org/faq/general/faq_27245";return Object(j["translate"])("TwoFactorAuth_TwoFactorAuthenticationIntro",'<a href="'.concat(e,'" rel="noreferrer noopener" target="_blank">'),"</a>")},setupTwoFactorAuthLink:function(){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),{},{module:"TwoFactorAuth",action:"setupTwoFactorAuth"})))},disableTwoFactorAuthLink:function(){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),{},{module:"TwoFactorAuth",action:"disableTwoFactorAuth",disableNonce:this.disableNonce})))},showRecoveryCodesLink:function(){return"?".concat(j["MatomoUrl"].stringify(Object.assign(Object.assign({},j["MatomoUrl"].urlParsed.value),{},{module:"TwoFactorAuth",action:"showRecoveryCodes"})))}},methods:{onDisable2FaLinkClick:function(){var e=this.disableNonce;j["Matomo"].helper.modalConfirm(this.$refs.confirmDisable2FA,{yes:function(){j["MatomoUrl"].updateUrl({module:"TwoFactorAuth",action:"disableTwoFactorAuth",disableNonce:e})}})}}});jt.render=Ot;var ft=jt;
 /*!
  * Matomo - free/libre analytics platform
  *
diff --git a/plugins/TwoFactorAuth/vue/dist/umd.metadata.json b/plugins/TwoFactorAuth/vue/dist/umd.metadata.json
index dce4477a3c..ed3e9b188b 100644
--- a/plugins/TwoFactorAuth/vue/dist/umd.metadata.json
+++ b/plugins/TwoFactorAuth/vue/dist/umd.metadata.json
@@ -1,6 +1,7 @@
 {
   "dependsOn": [
     "CoreHome",
-    "CorePluginsAdmin"
+    "CorePluginsAdmin",
+    "Login"
   ]
 }
\ No newline at end of file
diff --git a/plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue b/plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue
new file mode 100644
index 0000000000..5527d309dc
--- /dev/null
+++ b/plugins/TwoFactorAuth/vue/src/LoginTwoFactorAuth/LoginTwoFactorAuth.vue
@@ -0,0 +1,180 @@
+<!--
+  Matomo - free/libre analytics platform
+  @link https://matomo.org
+  @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+-->
+
+<template>
+  <ContentBlock :content-title="translate('TwoFactorAuth_TwoFactorAuthentication')">
+    <div class="message_container">
+      <FormErrors
+        :form-errors="formData.errors"
+      />
+
+      <Notification
+        v-if="accessErrorString"
+        :noclear="true"
+        context="error"
+      >
+        <strong>{{ translate('General_Error') }}</strong>:
+        <span v-html="$sanitize(accessErrorString)" />
+        <br/>
+      </Notification>
+    </div>
+
+    <form v-bind="formDataAttributes" class="loginTwoFaForm">
+      <div class="row">
+        <div class="col s12 input-field">
+          <input
+            type="hidden"
+            name="form_nonce"
+            id="login_form_nonce"
+            :value="formNonce"
+          />
+
+          <input
+            type="text"
+            name="form_authcode"
+            placeholder=""
+            id="login_form_authcode"
+            class="input"
+            value=""
+            size="20"
+            autocorrect="off"
+            autocapitalize="none"
+            autocomplete="off"
+            tabindex="10"
+            autofocus="autofocus"
+          />
+
+          <label for="login_form_authcode">
+            <i class="icon-user icon"></i>
+            {{ translate('TwoFactorAuth_AuthenticationCode') }}
+          </label>
+        </div>
+      </div>
+
+      <div class="row actions">
+        <div class="col s12">
+          <input
+            class="submit btn"
+            id="login_form_submit"
+            type="submit"
+            :value="translate('TwoFactorAuth_Verify')"
+            tabindex="100"
+          />
+        </div>
+      </div>
+
+    </form>
+
+    <p>
+      {{ translate('TwoFactorAuth_VerifyIdentifyExplanation') }}
+      <span v-html="$sanitize(learnMoreText)" />
+
+      <br /><br />
+      <strong>{{ translate('TwoFactorAuth_DontHaveYourMobileDevice') }}</strong>
+      <br />
+      <a href="https://matomo.org/faq/how-to/faq_27248" rel="noreferrer noopener" target="_blank">
+        {{ translate('TwoFactorAuth_EnterRecoveryCodeInstead') }}
+      </a>
+      <br />
+      <a :href="mailToLink" rel="noreferrer noopener">
+        {{ translate('TwoFactorAuth_AskSuperUserResetAuthenticationCode') }}
+      </a>
+      <br />
+      <a :href="logoutLink" rel="noreferrer noopener">{{ translate('General_Logout') }}</a>
+    </p>
+  </ContentBlock>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import {
+  ContentBlock,
+  Notification,
+  translate,
+  MatomoUrl,
+  Matomo,
+} from 'CoreHome';
+import { FormErrors } from 'Login';
+
+interface FormData {
+  attributes: string;
+}
+
+export default defineComponent({
+  props: {
+    formData: {
+      type: Object,
+      required: true,
+    },
+    accessErrorString: String,
+    formNonce: {
+      type: String,
+      required: true,
+    },
+    loginModule: {
+      type: String,
+      required: true,
+    },
+    piwikUrl: String,
+    userLogin: {
+      type: String,
+      required: true,
+    },
+    contactEmail: {
+      type: String,
+      required: true,
+    },
+  },
+  components: {
+    ContentBlock,
+    Notification,
+    FormErrors,
+  },
+  computed: {
+    learnMoreText() {
+      const link = 'https://matomo.org/faq/general/faq_27245';
+      return translate(
+        'General_LearnMore',
+        `<a href="${link}" rel="noreferrer noopener" target="_blank">`,
+        '</a>',
+      );
+    },
+    mailToLink() {
+      return `mailto:${this.contactEmail}?${MatomoUrl.stringify({
+        subject: translate('TwoFactorAuth_NotPossibleToLogIn'),
+        body: translate(
+          'TwoFactorAuth_LostAuthenticationDevice',
+          '\n\n',
+          '\n\n',
+          this.piwikUrl || '',
+          '\n\n',
+          this.userLogin,
+          'https://matomo.org/faq/how-to/faq_27248',
+        ),
+      })}`;
+    },
+    logoutLink() {
+      return `?${MatomoUrl.stringify({
+        module: this.loginModule,
+        action: 'logout',
+      })}`;
+    },
+    formDataAttributes() {
+      // convert html attribute string (ie 'a="b" d="f"') to JS object {a: "b", d: "f"}
+      return Object.fromEntries(
+        (this.formData as FormData).attributes
+          .split(/\s+/g)
+          .filter((s) => s)
+          .map((pair) => pair.split('='))
+          .map(([name, value]) => [
+            name,
+            Matomo.helper.htmlDecode(value.substr(1, value.length - 2)),
+          ]),
+      );
+    },
+  },
+});
+</script>
diff --git a/plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue b/plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue
new file mode 100644
index 0000000000..e3ec643409
--- /dev/null
+++ b/plugins/TwoFactorAuth/vue/src/SetupFinished/SetupFinished.vue
@@ -0,0 +1,38 @@
+<!--
+  Matomo - free/libre analytics platform
+  @link https://matomo.org
+  @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+-->
+
+<template>
+  <ContentBlock class="twoFactorSetupFinished">
+    <h2 class="successMessage">
+      {{ translate('TwoFactorAuth_SetupFinishedTitle') }}
+    </h2>
+    <h3>{{ translate('TwoFactorAuth_SetupFinishedSubtitle') }}</h3>
+    <p>
+      <br />
+      <a class="btn" :href="userSecurityLink">{{ translate('General_Continue') }}</a>
+    </p>
+  </ContentBlock>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { ContentBlock, MatomoUrl } from 'CoreHome';
+
+export default defineComponent({
+  components: {
+    ContentBlock,
+  },
+  computed: {
+    userSecurityLink(): string {
+      return `?${MatomoUrl.stringify({
+        ...MatomoUrl.urlParsed.value,
+        module: 'UsersManager',
+        action: 'userSecurity',
+      })}`;
+    },
+  },
+});
+</script>
diff --git a/plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue b/plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue
index 8123dd5c59..73d6db3171 100644
--- a/plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue
+++ b/plugins/TwoFactorAuth/vue/src/SetupTwoFactorAuth/SetupTwoFactorAuth.vue
@@ -5,141 +5,157 @@
 -->
 
 <template>
-  <div class="setupTwoFactorAuthentication" ref="root">
-    <div class="alert alert-warning" v-if="isAlreadyUsing2fa">
-      {{ translate('TwoFactorAuth_WarningChangingConfiguredDevice') }}
-    </div>
-    <p>
-      {{ translate('TwoFactorAuth_SetupIntroFollowSteps') }}
-    </p>
-    <h2>
-      {{ translate('TwoFactorAuth_StepX', 1) }} - {{ translate('TwoFactorAuth_RecoveryCodes') }}
-    </h2>
+  <ContentBlock
+    :content-title="standalone
+      ? translate('TwoFactorAuth_RequiredToSetUpTwoFactorAuthentication')
+      : translate('TwoFactorAuth_SetUpTwoFactorAuthentication')"
+  >
+    <div class="setupTwoFactorAuthentication" ref="root">
+      <div class="alert alert-warning" v-if="isAlreadyUsing2fa">
+        {{ translate('TwoFactorAuth_WarningChangingConfiguredDevice') }}
+      </div>
+      <p>
+        {{ translate('TwoFactorAuth_SetupIntroFollowSteps') }}
+      </p>
+      <h2>
+        {{ translate('TwoFactorAuth_StepX', 1) }} - {{ translate('TwoFactorAuth_RecoveryCodes') }}
+      </h2>
 
-    <ShowRecoveryCodes
-      :codes="codes"
-      @downloaded="this.hasDownloadedRecoveryCode = true"
-    />
+      <ShowRecoveryCodes
+        :codes="codes"
+        @downloaded="this.hasDownloadedRecoveryCode = true"
+      />
 
-    <div
-      class="alert alert-info backupRecoveryCodesAlert"
-      v-show="step === 1"
-    >
-      {{ translate('TwoFactorAuth_SetupBackupRecoveryCodes') }}
-    </div>
-    <p>
-      <button
-        class="btn goToStep2"
+      <div
+        class="alert alert-info backupRecoveryCodesAlert"
         v-show="step === 1"
-        @click="nextStep()"
-        :disabled="!hasDownloadedRecoveryCode"
-      >{{ translate('General_Next') }}</button>
-    </p>
-    <a
-      name="twoFactorStep2"
-      id="twoFactorStep2"
-      style="opacity: 0"
-    />
-    <div v-show="step >= 2">
-      <h2>
-        {{ translate('TwoFactorAuth_StepX', 2) }} -
-        {{ translate('TwoFactorAuth_SetupAuthenticatorOnDevice') }}
-      </h2>
-      <p>{{ translate('TwoFactorAuth_SetupAuthenticatorOnDeviceStep1') }} <a
-          target="_blank"
-          rel="noreferrer noopener"
-          href="https://github.com/andOTP/andOTP#downloads"
-        >andOTP</a>, <a
-          target="_blank"
-          rel="noreferrer noopener"
-          href="https://authy.com/guides/github/"
-        >Authy</a>, <a
-          target="_blank"
-          rel="noreferrer noopener"
-          href="https://support.1password.com/one-time-passwords/"
-        >1Password</a>, <a
-          target="_blank"
-          rel="noreferrer noopener"
-          href="https://helpdesk.lastpass.com/multifactor-authentication-options/lastpass-authenticator/"
-        >LastPass Authenticator</a>, {{ translate('General_Or') }} <a
-          target="_blank"
-          rel="noreferrer noopener"
-          href="https://support.google.com/accounts/answer/1066447"
-        >Google Authenticator</a>.
-      </p>
-      <p><span v-html="$sanitize(setupAuthenticatorOnDeviceStep2)"></span></p>
-      <p>
-        <br />
-        <span
-          id="qrcode"
-          ref="qrcode"
-          title
-        />
-      </p>
+      >
+        {{ translate('TwoFactorAuth_SetupBackupRecoveryCodes') }}
+      </div>
       <p>
-        <br />
         <button
-          class="btn goToStep3"
-          v-show="step === 2"
+          class="btn goToStep2"
+          v-show="step === 1"
           @click="nextStep()"
+          :disabled="!hasDownloadedRecoveryCode"
         >{{ translate('General_Next') }}</button>
       </p>
-    </div>
-    <a
-      name="twoFactorStep3"
-      id="twoFactorStep3"
-      style="opacity: 0"
-    />
-    <div v-show="step >= 3">
-      <h2>{{ translate('TwoFactorAuth_StepX', 3) }} - {{ translate('TwoFactorAuth_ConfirmSetup') }}
-      </h2>
-      <p>{{ translate('TwoFactorAuth_VerifyAuthCodeIntro') }}</p>
-      <div class="message_container" v-if="accessErrorString">
-        <div>
-          <Notification
-            :noclear="true"
-            context="error"
-          >
-            <strong>
-              {{ translate('General_Error') }}
-            </strong>: <span v-html="$sanitize(accessErrorString)"/><br />
-          </Notification>
-        </div>
+      <a
+        name="twoFactorStep2"
+        id="twoFactorStep2"
+        style="opacity: 0"
+      />
+      <div v-show="step >= 2">
+        <h2>
+          {{ translate('TwoFactorAuth_StepX', 2) }} -
+          {{ translate('TwoFactorAuth_SetupAuthenticatorOnDevice') }}
+        </h2>
+        <p>{{ translate('TwoFactorAuth_SetupAuthenticatorOnDeviceStep1') }} <a
+            target="_blank"
+            rel="noreferrer noopener"
+            href="https://github.com/andOTP/andOTP#downloads"
+          >andOTP</a>, <a
+            target="_blank"
+            rel="noreferrer noopener"
+            href="https://authy.com/guides/github/"
+          >Authy</a>, <a
+            target="_blank"
+            rel="noreferrer noopener"
+            href="https://support.1password.com/one-time-passwords/"
+          >1Password</a>, <a
+            target="_blank"
+            rel="noreferrer noopener"
+            href="https://helpdesk.lastpass.com/multifactor-authentication-options/lastpass-authenticator/"
+          >LastPass Authenticator</a>, {{ translate('General_Or') }} <a
+            target="_blank"
+            rel="noreferrer noopener"
+            href="https://support.google.com/accounts/answer/1066447"
+          >Google Authenticator</a>.
+        </p>
+        <p><span v-html="$sanitize(setupAuthenticatorOnDeviceStep2)"></span></p>
+        <p>
+          <br />
+          <span
+            id="qrcode"
+            ref="qrcode"
+            title
+          />
+        </p>
+        <p>
+          <br />
+          <button
+            class="btn goToStep3"
+            v-show="step === 2"
+            @click="nextStep()"
+          >{{ translate('General_Next') }}</button>
+        </p>
       </div>
-      <form
-        method="post"
-        class="setupConfirmAuthCodeForm"
-        autocorrect="off"
-        autocapitalize="none"
-        autocomplete="off"
-        :action="linkTo({'module': 'TwoFactorAuth', 'action': submitAction})"
-      >
-        <div>
-          <Field
-            uicontrol="text"
-            name="authCode"
-            :title="translate('TwoFactorAuth_AuthenticationCode')"
-            v-model="authCode"
-            :maxlength="6"
-            :placeholder="'123456'"
-            :inline-help="translate('TwoFactorAuth_VerifyAuthCodeHelp')"
-          >
-          </Field>
+      <a
+        name="twoFactorStep3"
+        id="twoFactorStep3"
+        style="opacity: 0"
+      />
+      <div v-show="step >= 3">
+        <h2>
+          {{ translate('TwoFactorAuth_StepX', 3) }} - {{ translate('TwoFactorAuth_ConfirmSetup') }}
+        </h2>
+        <p>{{ translate('TwoFactorAuth_VerifyAuthCodeIntro') }}</p>
+        <div class="message_container" v-if="accessErrorString">
+          <div>
+            <Notification
+              :noclear="true"
+              context="error"
+            >
+              <strong>
+                {{ translate('General_Error') }}
+              </strong>: <span v-html="$sanitize(accessErrorString)"/><br />
+            </Notification>
+          </div>
         </div>
-        <input
-          type="hidden"
-          name="authCodeNonce"
-          :value="authCodeNonce"
-        />
-        <input
-          type="submit"
-          class="btn confirmAuthCode"
-          :disabled="authCode.length !== 6"
-          :value="translate('General_Confirm')"
-        />
-      </form>
+        <form
+          method="post"
+          class="setupConfirmAuthCodeForm"
+          autocorrect="off"
+          autocapitalize="none"
+          autocomplete="off"
+          :action="linkTo({'module': 'TwoFactorAuth', 'action': submitAction})"
+        >
+          <div>
+            <Field
+              uicontrol="text"
+              name="authCode"
+              :title="translate('TwoFactorAuth_AuthenticationCode')"
+              v-model="authCode"
+              :maxlength="6"
+              :placeholder="'123456'"
+              :inline-help="translate('TwoFactorAuth_VerifyAuthCodeHelp')"
+            >
+            </Field>
+          </div>
+          <input
+            type="hidden"
+            name="authCodeNonce"
+            :value="authCodeNonce"
+          />
+          <input
+            type="submit"
+            class="btn confirmAuthCode"
+            :disabled="authCode.length !== 6"
+            :value="translate('General_Confirm')"
+          />
+        </form>
+      </div>
+
+      <div id="setupTwoFAsecretConfirm" class="ui-confirm">
+        <h2>{{ translate('TwoFactorAuth_Your2FaAuthSecret') }}</h2>
+        <p style="text-align: center;"><code
+          v-select-on-focus="{}"
+          style="font-size: 30px;"
+        >{{ newSecret }}</code></p>
+        <input role="ok" type="button" :value="translate('General_Ok')"/>
+      </div>
     </div>
-  </div>
+  </ContentBlock>
 </template>
 
 <script lang="ts">
@@ -150,6 +166,7 @@ import {
   Notification,
   SelectOnFocus,
   MatomoUrl,
+  ContentBlock,
 } from 'CoreHome';
 import { Field } from 'CorePluginsAdmin';
 import '../types';
@@ -176,11 +193,17 @@ export default defineComponent({
       required: true,
     },
     codes: Array,
+    twoFaBarCodeSetupUrl: {
+      type: String,
+      required: true,
+    },
+    standalone: Boolean,
   },
   components: {
     ShowRecoveryCodes,
     Notification,
     Field,
+    ContentBlock,
   },
   directives: {
     SelectOnFocus,
@@ -198,7 +221,7 @@ export default defineComponent({
 
       // eslint-disable-next-line no-new
       new QRCode(qrcode, {
-        text: window.twoFaBarCodeSetupUrl,
+        text: this.twoFaBarCodeSetupUrl,
       });
 
       $(qrcode).attr('title', ''); // do not show secret on hover
diff --git a/plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue b/plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue
new file mode 100644
index 0000000000..3b250a1230
--- /dev/null
+++ b/plugins/TwoFactorAuth/vue/src/ShowRecoveryCodes/ShowRecoveryCodesPage.vue
@@ -0,0 +1,68 @@
+<!--
+  Matomo - free/libre analytics platform
+  @link https://matomo.org
+  @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+-->
+
+<template>
+  <ContentBlock :content-title="contentTitle">
+    <ShowRecoveryCodes :codes="codes" />
+
+    <h2>{{ translate('TwoFactorAuth_GenerateNewRecoveryCodes') }}</h2>
+    <p>{{ translate('TwoFactorAuth_GenerateNewRecoveryCodesInfo') }}<br /><br /></p>
+
+    <div class="alert alert-success" v-if="regenerateSuccess">
+      {{ translate('TwoFactorAuth_RecoveryCodesRegenerated') }}
+    </div>
+
+    <div class="alert alert-danger" v-if="regenerateError">
+      {{ translate('General_ExceptionNonceMismatch') }}
+    </div>
+
+    <form method="post" :action="showRecoveryCodesLink">
+      <input type="hidden" name="regenerateNonce" :value="regenerateNonce" />
+      <input
+        type="submit"
+        class="btn"
+        :value="translate('TwoFactorAuth_GenerateNewRecoveryCodes')"
+      />
+    </form>
+
+  </ContentBlock>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { ContentBlock, translate, MatomoUrl } from 'CoreHome';
+import ShowRecoveryCodes from './ShowRecoveryCodes.vue';
+
+export default defineComponent({
+  props: {
+    codes: Array,
+    regenerateSuccess: Boolean,
+    regenerateError: Boolean,
+    regenerateNonce: {
+      type: String,
+      required: true,
+    },
+  },
+  components: {
+    ContentBlock,
+    ShowRecoveryCodes,
+  },
+  computed: {
+    contentTitle() {
+      const part1 = translate('TwoFactorAuth_TwoFactorAuthentication');
+      const part2 = translate('TwoFactorAuth_RecoveryCodes');
+      return `${part1} - ${part2}`;
+    },
+    showRecoveryCodesLink() {
+      return `?${MatomoUrl.stringify({
+        ...MatomoUrl.urlParsed.value,
+        module: 'TwoFactorAuth',
+        action: 'showRecoveryCodes',
+      })}`;
+    },
+  },
+});
+</script>
diff --git a/plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue b/plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue
new file mode 100644
index 0000000000..83a29eb247
--- /dev/null
+++ b/plugins/TwoFactorAuth/vue/src/UserSettings/UserSettings.vue
@@ -0,0 +1,143 @@
+<!--
+  Matomo - free/libre analytics platform
+  @link https://matomo.org
+  @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+-->
+
+<template>
+  <ContentBlock
+    :content-title="contentTitle"
+    class="userSettings2FA"
+  >
+    <p v-html="$sanitize(twoFactorAuthIntro)"></p>
+
+    <p v-if="isEnabled">
+      <strong class="twoFaStatusEnabled">
+        {{ translate('TwoFactorAuth_TwoFactorAuthenticationIsEnabled') }}
+      </strong>
+    </p>
+
+    <p v-if="isEnabled">
+      <span v-if="isForced">
+        {{ translate('TwoFactorAuth_TwoFactorAuthenticationRequired') }}
+        <br />
+        <br />
+        <a
+          class="btn btn-link enable2FaLink"
+          :href="setupTwoFactorAuthLink"
+          style="margin-right:3.5px"
+        >{{ translate('TwoFactorAuth_ConfigureDifferentDevice') }}</a>
+      </span>
+      <span v-else>
+        <a
+          class="btn btn-link enable2FaLink"
+          :href="setupTwoFactorAuthLink"
+          style="margin-right:3.5px"
+        >{{ translate('TwoFactorAuth_ConfigureDifferentDevice') }}</a>
+        <a :href="disableTwoFactorAuthLink" style="display:none;" id="disable2fa">disable2fa</a>
+        <input
+          type="button"
+          class="btn btn-link disable2FaLink"
+          @click="onDisable2FaLinkClick()"
+          :value="translate('TwoFactorAuth_DisableTwoFA')"
+          style="margin-right:3.5px"
+        />
+      </span>
+
+      <a
+        class="btn btn-link showRecoveryCodesLink"
+        :href="showRecoveryCodesLink"
+      >{{ translate('TwoFactorAuth_ShowRecoveryCodes') }}</a>
+    </p>
+    <p v-else>
+      <strong>{{ translate('TwoFactorAuth_TwoFactorAuthenticationIsDisabled') }}</strong>
+      <br />
+      <br />
+      <a
+        class="btn btn-link enable2FaLink"
+        :href="setupTwoFactorAuthLink"
+      >{{ translate('TwoFactorAuth_EnableTwoFA') }}</a>
+    </p>
+
+    <div id="confirmDisable2FA" class="ui-confirm" ref="confirmDisable2FA">
+      <h2>{{ translate('TwoFactorAuth_ConfirmDisableTwoFA') }}</h2>
+      <input role="yes" type="button" :value="translate('General_Yes')"/>
+      <input role="no" type="button" :value="translate('General_No')"/>
+    </div>
+  </ContentBlock>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import {
+  ContentBlock,
+  MatomoUrl,
+  translate,
+  Matomo,
+} from 'CoreHome';
+
+export default defineComponent({
+  props: {
+    isEnabled: Boolean,
+    isForced: Boolean,
+    disableNonce: {
+      type: String,
+      required: true,
+    },
+  },
+  components: {
+    ContentBlock,
+  },
+  computed: {
+    contentTitle() {
+      const part1 = translate('TwoFactorAuth_TwoFactorAuthentication');
+      const part2 = translate('TwoFactorAuth_TwoFAShort');
+      return `${part1} (${part2})`;
+    },
+    twoFactorAuthIntro() {
+      const link = 'https://matomo.org/faq/general/faq_27245';
+      return translate(
+        'TwoFactorAuth_TwoFactorAuthenticationIntro',
+        `<a href="${link}" rel="noreferrer noopener" target="_blank">`,
+        '</a>',
+      );
+    },
+    setupTwoFactorAuthLink() {
+      return `?${MatomoUrl.stringify({
+        ...MatomoUrl.urlParsed.value,
+        module: 'TwoFactorAuth',
+        action: 'setupTwoFactorAuth',
+      })}`;
+    },
+    disableTwoFactorAuthLink() {
+      return `?${MatomoUrl.stringify({
+        ...MatomoUrl.urlParsed.value,
+        module: 'TwoFactorAuth',
+        action: 'disableTwoFactorAuth',
+        disableNonce: this.disableNonce,
+      })}`;
+    },
+    showRecoveryCodesLink() {
+      return `?${MatomoUrl.stringify({
+        ...MatomoUrl.urlParsed.value,
+        module: 'TwoFactorAuth',
+        action: 'showRecoveryCodes',
+      })}`;
+    },
+  },
+  methods: {
+    onDisable2FaLinkClick() {
+      const nonce = this.disableNonce;
+      Matomo.helper.modalConfirm(this.$refs.confirmDisable2FA as HTMLElement, {
+        yes() {
+          MatomoUrl.updateUrl({
+            module: 'TwoFactorAuth',
+            action: 'disableTwoFactorAuth',
+            disableNonce: nonce,
+          });
+        },
+      });
+    },
+  },
+});
+</script>
diff --git a/plugins/TwoFactorAuth/vue/src/index.ts b/plugins/TwoFactorAuth/vue/src/index.ts
index f8e95a08f6..5ea807583b 100644
--- a/plugins/TwoFactorAuth/vue/src/index.ts
+++ b/plugins/TwoFactorAuth/vue/src/index.ts
@@ -6,4 +6,8 @@
  */
 
 export { default as ShowRecoveryCodes } from './ShowRecoveryCodes/ShowRecoveryCodes.vue';
+export { default as ShowRecoveryCodesPage } from './ShowRecoveryCodes/ShowRecoveryCodesPage.vue';
 export { default as SetupTwoFactorAuth } from './SetupTwoFactorAuth/SetupTwoFactorAuth.vue';
+export { default as LoginTwoFactorAuth } from './LoginTwoFactorAuth/LoginTwoFactorAuth.vue';
+export { default as SetupFinished } from './SetupFinished/SetupFinished.vue';
+export { default as UserSettings } from './UserSettings/UserSettings.vue';
diff --git a/plugins/TwoFactorAuth/vue/src/types.ts b/plugins/TwoFactorAuth/vue/src/types.ts
index 1242d2cc16..d68e1486fa 100644
--- a/plugins/TwoFactorAuth/vue/src/types.ts
+++ b/plugins/TwoFactorAuth/vue/src/types.ts
@@ -12,6 +12,5 @@ export interface QRCodeConstructor {
 declare global {
   interface Window {
     QRCode: QRCodeConstructor;
-    twoFaBarCodeSetupUrl: string;
   }
 }
diff --git a/plugins/UsersManager/UsersManager.php b/plugins/UsersManager/UsersManager.php
index f1c81a9a2b..fbd576b40a 100644
--- a/plugins/UsersManager/UsersManager.php
+++ b/plugins/UsersManager/UsersManager.php
@@ -224,162 +224,162 @@ class UsersManager extends \Piwik\Plugin
 
     public function getClientSideTranslationKeys(&$translationKeys)
     {
-        $translationKeys[] = "General_OrCancel";
-        $translationKeys[] = "General_Save";
         $translationKeys[] = "General_Done";
+        $translationKeys[] = "General_OrCancel";
         $translationKeys[] = "General_Pagination";
+        $translationKeys[] = "General_Password";
         $translationKeys[] = "General_PleaseTryAgain";
+        $translationKeys[] = "General_Save";
         $translationKeys[] = "General_Username";
-        $translationKeys[] = "General_Password";
-        $translationKeys[] = "UsersManager_DeleteConfirm";
         $translationKeys[] = "UsersManager_ConfirmGrantSuperUserAccess";
-        $translationKeys[] = "UsersManager_ConfirmProhibitOtherUsersSuperUserAccess";
         $translationKeys[] = "UsersManager_ConfirmProhibitMySuperUserAccess";
-        $translationKeys[] = "UsersManager_ExceptionUserHasViewAccessAlready";
+        $translationKeys[] = "UsersManager_ConfirmProhibitOtherUsersSuperUserAccess";
+        $translationKeys[] = "UsersManager_ConfirmWithPassword";
+        $translationKeys[] = "UsersManager_DeleteConfirm";
         $translationKeys[] = "UsersManager_ExceptionNoValueForUsernameOrEmail";
+        $translationKeys[] = "UsersManager_ExceptionUserHasViewAccessAlready";
         $translationKeys[] = "UsersManager_GiveUserAccess";
+        $translationKeys[] = "UsersManager_ManageUsers";
+        $translationKeys[] = "UsersManager_ManageUsersAdminDesc";
+        $translationKeys[] = "UsersManager_ManageUsersDesc";
         $translationKeys[] = "UsersManager_PrivAdmin";
+        $translationKeys[] = "UsersManager_PrivNone";
         $translationKeys[] = "UsersManager_PrivView";
         $translationKeys[] = "UsersManager_RemoveUserAccess";
-        $translationKeys[] = "UsersManager_ConfirmWithPassword";
-        $translationKeys[] = "UsersManager_YourCurrentPassword";
-        $translationKeys[] = "UsersManager_UserHasPermission";
         $translationKeys[] = "UsersManager_UserHasNoPermission";
-        $translationKeys[] = "UsersManager_PrivNone";
-        $translationKeys[] = "UsersManager_ManageUsers";
-        $translationKeys[] = "UsersManager_ManageUsersDesc";
-        $translationKeys[] = "UsersManager_ManageUsersAdminDesc";
+        $translationKeys[] = "UsersManager_UserHasPermission";
+        $translationKeys[] = "UsersManager_YourCurrentPassword";
+        $translationKeys[] = 'General_Actions';
+        $translationKeys[] = 'General_Add';
+        $translationKeys[] = 'General_AllWebsitesDashboard';
+        $translationKeys[] = 'General_ChangePassword';
+        $translationKeys[] = 'General_CreationDate';
+        $translationKeys[] = 'General_Delete';
+        $translationKeys[] = 'General_Description';
+        $translationKeys[] = 'General_Language';
+        $translationKeys[] = 'General_Never';
+        $translationKeys[] = 'General_Note';
+        $translationKeys[] = 'General_Ok';
+        $translationKeys[] = 'General_TimeFormat';
+        $translationKeys[] = 'General_ValidatorErrorEmptyValue';
+        $translationKeys[] = 'General_Warning';
+        $translationKeys[] = 'General_Yes';
+        $translationKeys[] = 'LanguagesManager_AboutPiwikTranslations';
+        $translationKeys[] = 'Login_NewPassword';
+        $translationKeys[] = 'Login_NewPasswordRepeat';
         $translationKeys[] = 'Mobile_NavigationBack';
+        $translationKeys[] = 'UsersManager_2FA';
+        $translationKeys[] = 'UsersManager_Active';
         $translationKeys[] = 'UsersManager_AddExistingUser';
-        $translationKeys[] = 'UsersManager_EnterUsernameOrEmail';
-        $translationKeys[] = 'UsersManager_NoAccessWarning';
+        $translationKeys[] = 'UsersManager_AddSuperuserAccessConfirm';
+        $translationKeys[] = 'UsersManager_AllUsersAreSelected';
+        $translationKeys[] = 'UsersManager_AllWebsitesAreSelected';
+        $translationKeys[] = 'UsersManager_AnonymousUserRoleChangeWarning';
+        $translationKeys[] = 'UsersManager_AreYouSure';
+        $translationKeys[] = 'UsersManager_AreYouSureAddCapability';
+        $translationKeys[] = 'UsersManager_AreYouSureChangeDetails';
+        $translationKeys[] = 'UsersManager_AreYouSureRemoveCapability';
+        $translationKeys[] = 'UsersManager_AuthTokenPurpose';
+        $translationKeys[] = 'UsersManager_AuthTokens';
+        $translationKeys[] = 'UsersManager_BasicInformation';
         $translationKeys[] = 'UsersManager_BulkActions';
-        $translationKeys[] = 'UsersManager_SetPermission';
-        $translationKeys[] = 'UsersManager_RolesHelp';
-        $translationKeys[] = 'UsersManager_Role';
-        $translationKeys[] = 'UsersManager_2FA';
-        $translationKeys[] = 'UsersManager_UsesTwoFactorAuthentication';
-        $translationKeys[] = 'General_Actions';
-        $translationKeys[] = 'UsersManager_TheDisplayedWebsitesAreSelected';
+        $translationKeys[] = 'UsersManager_Capabilities';
+        $translationKeys[] = 'UsersManager_CapabilitiesHelp';
+        $translationKeys[] = 'UsersManager_ChangePermToAllSitesConfirm';
+        $translationKeys[] = 'UsersManager_ChangePermToAllSitesConfirm2';
+        $translationKeys[] = 'UsersManager_ChangePermToSiteConfirmMultiple';
+        $translationKeys[] = 'UsersManager_ChangePermToSiteConfirmSingle';
+        $translationKeys[] = 'UsersManager_ClickHereToDeleteTheCookie';
+        $translationKeys[] = 'UsersManager_ClickHereToSetTheCookieOnDomain';
         $translationKeys[] = 'UsersManager_ClickToSelectAll';
-        $translationKeys[] = 'UsersManager_AllWebsitesAreSelected';
+        $translationKeys[] = 'UsersManager_ClickToSelectDisplayedUsers';
         $translationKeys[] = 'UsersManager_ClickToSelectDisplayedWebsites';
-        $translationKeys[] = 'UsersManager_DeletePermConfirmSingle';
+        $translationKeys[] = 'UsersManager_ConfirmTokenCopied';
+        $translationKeys[] = 'UsersManager_CreateNewToken';
+        $translationKeys[] = 'UsersManager_Decline';
+        $translationKeys[] = 'UsersManager_DeleteAllTokens';
+        $translationKeys[] = 'UsersManager_DeleteNotSuccessful';
         $translationKeys[] = 'UsersManager_DeletePermConfirmMultiple';
-        $translationKeys[] = 'UsersManager_ChangePermToSiteConfirmSingle';
-        $translationKeys[] = 'UsersManager_ChangePermToSiteConfirmMultiple';
-        $translationKeys[] = 'UsersManager_BasicInformation';
-        $translationKeys[] = 'UsersManager_Permissions';
-        $translationKeys[] = 'UsersManager_RemovePermissions';
-        $translationKeys[] = 'UsersManager_FirstSiteInlineHelp';
-        $translationKeys[] = 'UsersManager_SuperUsersPermissionsNotice';
-        $translationKeys[] = 'UsersManager_SuperUserIntro1';
-        $translationKeys[] = 'UsersManager_SuperUserIntro2';
-        $translationKeys[] = 'UsersManager_HasSuperUserAccess';
-        $translationKeys[] = 'UsersManager_AreYouSure';
-        $translationKeys[] = 'UsersManager_RemoveSuperuserAccessConfirm';
-        $translationKeys[] = 'UsersManager_AddSuperuserAccessConfirm';
-        $translationKeys[] = 'UsersManager_UserSearch';
-        $translationKeys[] = 'UsersManager_DeleteUsers';
-        $translationKeys[] = 'UsersManager_FilterByAccess';
-        $translationKeys[] = 'UsersManager_Username';
-        $translationKeys[] = 'UsersManager_RoleFor';
-        $translationKeys[] = 'UsersManager_TheDisplayedUsersAreSelected';
-        $translationKeys[] = 'UsersManager_AllUsersAreSelected';
-        $translationKeys[] = 'UsersManager_ClickToSelectDisplayedUsers';
-        $translationKeys[] = 'UsersManager_DeleteUserConfirmSingle';
+        $translationKeys[] = 'UsersManager_DeletePermConfirmSingle';
+        $translationKeys[] = 'UsersManager_DeleteSuccess';
         $translationKeys[] = 'UsersManager_DeleteUserConfirmMultiple';
-        $translationKeys[] = 'UsersManager_DeleteUserPermConfirmSingle';
+        $translationKeys[] = 'UsersManager_DeleteUserConfirmSingle';
         $translationKeys[] = 'UsersManager_DeleteUserPermConfirmMultiple';
-        $translationKeys[] = 'UsersManager_ResetTwoFactorAuthentication';
-        $translationKeys[] = 'UsersManager_ResetTwoFactorAuthenticationInfo';
-        $translationKeys[] = 'UsersManager_TwoFactorAuthentication';
-        $translationKeys[] = 'UsersManager_InviteNewUser';
+        $translationKeys[] = 'UsersManager_DeleteUserPermConfirmSingle';
+        $translationKeys[] = 'UsersManager_DeleteUsers';
+        $translationKeys[] = 'UsersManager_DoNotStoreToken';
         $translationKeys[] = 'UsersManager_EditUser';
-        $translationKeys[] = 'UsersManager_InviteUser';
-        $translationKeys[] = 'UsersManager_SaveBasicInfo';
         $translationKeys[] = 'UsersManager_Email';
-        $translationKeys[] = 'UsersManager_LastSeen';
-        $translationKeys[] = 'UsersManager_SuperUserAccess';
-        $translationKeys[] = 'UsersManager_AreYouSureChangeDetails';
-        $translationKeys[] = 'UsersManager_AnonymousUserRoleChangeWarning';
-        $translationKeys[] = 'General_Warning';
-        $translationKeys[] = 'General_Add';
-        $translationKeys[] = 'General_Note';
-        $translationKeys[] = 'General_Yes';
+        $translationKeys[] = 'UsersManager_EmailYourAdministrator';
+        $translationKeys[] = 'UsersManager_EnterUsernameOrEmail';
+        $translationKeys[] = 'UsersManager_ExcludeVisitsViaCookie';
+        $translationKeys[] = 'UsersManager_ExpireDate';
+        $translationKeys[] = 'UsersManager_Expired';
+        $translationKeys[] = 'UsersManager_ExpiredInviteAutomaticallyRemoved';
+        $translationKeys[] = 'UsersManager_ExpiredTokensDeleteAutomatically';
+        $translationKeys[] = 'UsersManager_FilterByAccess';
+        $translationKeys[] = 'UsersManager_FilterByStatus';
         $translationKeys[] = 'UsersManager_FilterByWebsite';
+        $translationKeys[] = 'UsersManager_FirstSiteInlineHelp';
+        $translationKeys[] = 'UsersManager_FirstWebsitePermission';
+        $translationKeys[] = 'UsersManager_ForAnonymousUsersReportDateToLoadByDefault';
         $translationKeys[] = 'UsersManager_GiveAccessToAll';
-        $translationKeys[] = 'UsersManager_OrManageIndividually';
-        $translationKeys[] = 'UsersManager_ChangePermToAllSitesConfirm';
-        $translationKeys[] = 'UsersManager_ChangePermToAllSitesConfirm2';
-        $translationKeys[] = 'UsersManager_CapabilitiesHelp';
-        $translationKeys[] = 'UsersManager_Capabilities';
-        $translationKeys[] = 'UsersManager_AreYouSureAddCapability';
-        $translationKeys[] = 'UsersManager_AreYouSureRemoveCapability';
+        $translationKeys[] = 'UsersManager_GoBackSecurityPage';
+        $translationKeys[] = 'UsersManager_HasSuperUserAccess';
+        $translationKeys[] = 'UsersManager_IfYouWouldLikeToChangeThePasswordTypeANewOne';
         $translationKeys[] = 'UsersManager_IncludedInUsersRole';
+        $translationKeys[] = 'UsersManager_InjectedHostCannotChangePwd';
+        $translationKeys[] = 'UsersManager_InviteDayLeft';
+        $translationKeys[] = 'UsersManager_InviteNewUser';
+        $translationKeys[] = 'UsersManager_InviteSuccess';
+        $translationKeys[] = 'UsersManager_InviteSuccessNotification';
+        $translationKeys[] = 'UsersManager_InviteUser';
+        $translationKeys[] = 'UsersManager_LastSeen';
+        $translationKeys[] = 'UsersManager_LastUsed';
         $translationKeys[] = 'UsersManager_NewsletterSignupFailureMessage';
+        $translationKeys[] = 'UsersManager_NewsletterSignupMessage';
         $translationKeys[] = 'UsersManager_NewsletterSignupSuccessMessage';
-        $translationKeys[] = 'UsersManager_FirstWebsitePermission';
-        $translationKeys[] = 'UsersManager_YourUsernameCannotBeChanged';
-        $translationKeys[] = 'General_Language';
-        $translationKeys[] = 'LanguagesManager_AboutPiwikTranslations';
-        $translationKeys[] = 'General_TimeFormat';
-        $translationKeys[] = 'UsersManager_ReportToLoadByDefault';
-        $translationKeys[] = 'UsersManager_ReportDateToLoadByDefault';
         $translationKeys[] = 'UsersManager_NewsletterSignupTitle';
-        $translationKeys[] = 'UsersManager_NewsletterSignupMessage';
-        $translationKeys[] = 'UsersManager_WhenUsersAreNotLoggedInAndVisitPiwikTheyShouldAccess';
-        $translationKeys[] = 'UsersManager_ForAnonymousUsersReportDateToLoadByDefault';
-        $translationKeys[] = 'UsersManager_InviteSuccessNotification';
-        $translationKeys[] = 'UsersManager_ResendInviteConfirmSingle';
-        $translationKeys[] = 'UsersManager_Status';
-        $translationKeys[] = 'UsersManager_Active';
+        $translationKeys[] = 'UsersManager_NoAccessWarning';
+        $translationKeys[] = 'UsersManager_NoTokenCreatedYetCreateNow';
+        $translationKeys[] = 'UsersManager_NoteNoAnonymousUserAccessSettingsWontBeUsed2';
+        $translationKeys[] = 'UsersManager_OrManageIndividually';
+        $translationKeys[] = 'UsersManager_PasswordChangeTerminatesOtherSessions';
         $translationKeys[] = 'UsersManager_Pending';
-        $translationKeys[] = 'UsersManager_Expired';
-        $translationKeys[] = 'UsersManager_Decline';
+        $translationKeys[] = 'UsersManager_Permissions';
+        $translationKeys[] = 'UsersManager_PleaseStoreToken';
+        $translationKeys[] = 'UsersManager_RemovePermissions';
+        $translationKeys[] = 'UsersManager_RemoveSuperuserAccessConfirm';
+        $translationKeys[] = 'UsersManager_ReportDateToLoadByDefault';
+        $translationKeys[] = 'UsersManager_ReportToLoadByDefault';
+        $translationKeys[] = 'UsersManager_ResendInviteConfirmSingle';
         $translationKeys[] = 'UsersManager_ResendInviteSuccess';
-        $translationKeys[] = 'UsersManager_InviteSuccess';
-        $translationKeys[] = 'UsersManager_InviteDayLeft';
-        $translationKeys[] = 'UsersManager_FilterByStatus';
-        $translationKeys[] = 'UsersManager_ExpiredInviteAutomaticallyRemoved';
-        $translationKeys[] = 'UsersManager_AuthTokens';
+        $translationKeys[] = 'UsersManager_ResetTwoFactorAuthentication';
+        $translationKeys[] = 'UsersManager_ResetTwoFactorAuthenticationInfo';
+        $translationKeys[] = 'UsersManager_Role';
+        $translationKeys[] = 'UsersManager_RoleFor';
+        $translationKeys[] = 'UsersManager_RolesHelp';
+        $translationKeys[] = 'UsersManager_SaveBasicInfo';
+        $translationKeys[] = 'UsersManager_SetPermission';
+        $translationKeys[] = 'UsersManager_Status';
+        $translationKeys[] = 'UsersManager_SuperUserAccess';
+        $translationKeys[] = 'UsersManager_SuperUserIntro1';
+        $translationKeys[] = 'UsersManager_SuperUserIntro2';
+        $translationKeys[] = 'UsersManager_SuperUsersPermissionsNotice';
+        $translationKeys[] = 'UsersManager_TheDisplayedUsersAreSelected';
+        $translationKeys[] = 'UsersManager_TheDisplayedWebsitesAreSelected';
         $translationKeys[] = 'UsersManager_TokenAuthIntro';
-        $translationKeys[] = 'General_Description';
-        $translationKeys[] = 'General_ValidatorErrorEmptyValue';
-        $translationKeys[] = 'UsersManager_AuthTokenPurpose';
-        $translationKeys[] = 'UsersManager_CreateNewToken';
         $translationKeys[] = 'UsersManager_TokenSuccessfullyGenerated';
-        $translationKeys[] = 'UsersManager_PleaseStoreToken';
-        $translationKeys[] = 'UsersManager_DoNotStoreToken';
-        $translationKeys[] = 'UsersManager_ConfirmTokenCopied';
-        $translationKeys[] = 'UsersManager_GoBackSecurityPage';
-        $translationKeys[] = 'General_ChangePassword';
-        $translationKeys[] = 'Login_NewPassword';
-        $translationKeys[] = 'UsersManager_IfYouWouldLikeToChangeThePasswordTypeANewOne';
-        $translationKeys[] = 'Login_NewPasswordRepeat';
-        $translationKeys[] = 'UsersManager_TypeYourPasswordAgain';
-        $translationKeys[] = 'UsersManager_TypeYourCurrentPassword';
-        $translationKeys[] = 'UsersManager_PasswordChangeTerminatesOtherSessions';
-        $translationKeys[] = 'UsersManager_InjectedHostCannotChangePwd';
-        $translationKeys[] = 'UsersManager_EmailYourAdministrator';
-        $translationKeys[] = 'UsersManager_ExpiredTokensDeleteAutomatically';
-        $translationKeys[] = 'General_CreationDate';
-        $translationKeys[] = 'UsersManager_LastUsed';
         $translationKeys[] = 'UsersManager_TokensWithExpireDateCreationBySystem';
-        $translationKeys[] = 'UsersManager_ExpireDate';
-        $translationKeys[] = 'UsersManager_NoTokenCreatedYetCreateNow';
-        $translationKeys[] = 'General_Never';
-        $translationKeys[] = 'General_Delete';
-        $translationKeys[] = 'UsersManager_DeleteAllTokens';
-        $translationKeys[] = 'UsersManager_ExcludeVisitsViaCookie';
-        $translationKeys[] = 'UsersManager_ClickHereToDeleteTheCookie';
-        $translationKeys[] = 'UsersManager_ClickHereToSetTheCookieOnDomain';
+        $translationKeys[] = 'UsersManager_TwoFactorAuthentication';
+        $translationKeys[] = 'UsersManager_TypeYourCurrentPassword';
+        $translationKeys[] = 'UsersManager_TypeYourPasswordAgain';
+        $translationKeys[] = 'UsersManager_UserSearch';
+        $translationKeys[] = 'UsersManager_Username';
+        $translationKeys[] = 'UsersManager_UsesTwoFactorAuthentication';
+        $translationKeys[] = 'UsersManager_WhenUsersAreNotLoggedInAndVisitPiwikTheyShouldAccess';
+        $translationKeys[] = 'UsersManager_YourUsernameCannotBeChanged';
         $translationKeys[] = 'UsersManager_YourVisitsAreIgnoredOnDomain';
         $translationKeys[] = 'UsersManager_YourVisitsAreNotIgnored';
-        $translationKeys[] = 'General_AllWebsitesDashboard';
-        $translationKeys[] = 'General_Ok';
-        $translationKeys[] = 'UsersManager_NoteNoAnonymousUserAccessSettingsWontBeUsed2';
-        $translationKeys[] = 'UsersManager_DeleteSuccess';
-        $translationKeys[] = 'UsersManager_DeleteNotSuccessful';
     }
 }
diff --git a/tests/PHPUnit/Integration/AssetManagerTest.php b/tests/PHPUnit/Integration/AssetManagerTest.php
index b08bcdc9a5..f158e08601 100644
--- a/tests/PHPUnit/Integration/AssetManagerTest.php
+++ b/tests/PHPUnit/Integration/AssetManagerTest.php
@@ -206,6 +206,7 @@ class AssetManagerTest extends IntegrationTestCase
     {
         $this->pluginManager->setPlugins(
             array(
+                 new PluginMock('Login'), // PluginUmdAssetFetcher assumes Login is always available
                  $this->getCoreTheme()->getPlugin(),
                  $this->getNonCoreTheme()->getPlugin(),
                  $this->getCorePlugin(),