Merge pull request #13489 from nextcloud/enh/settings/2fa-security-store

Do not load 2fa admin settings async

lib/private/Settings/Admin/Security.php

@@ -25,25 +25,35 @@
 
 namespace OC\Settings\Admin;
 
+use OC\Authentication\TwoFactorAuth\MandatoryTwoFactor;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\Encryption\IManager;
+use OCP\IInitialStateService;
 use OCP\IUserManager;
 use OCP\Settings\ISettings;
 
 class Security implements ISettings {
+
 	/** @var IManager */
 	private $manager;
 
 	/** @var IUserManager */
 	private $userManager;
 
-	/**
-	 * @param IManager $manager
-	 * @param IUserManager $userManager
-	 */
-	public function __construct(IManager $manager, IUserManager $userManager) {
+	/** @var MandatoryTwoFactor */
+	private $mandatoryTwoFactor;
+
+	/** @var IInitialStateService */
+	private $initialState;
+
+	public function __construct(IManager $manager,
+								IUserManager $userManager,
+								MandatoryTwoFactor $mandatoryTwoFactor,
+								IInitialStateService $initialState) {
 		$this->manager = $manager;
 		$this->userManager = $userManager;
+		$this->mandatoryTwoFactor = $mandatoryTwoFactor;
+		$this->initialState = $initialState;
 	}
 
 	/**
@@ -61,6 +71,12 @@ class Security implements ISettings {
 			}
 		}
 
+		$this->initialState->provideInitialState(
+			'settings',
+			'mandatory2FAState',
+			$this->mandatoryTwoFactor->getState()
+		);
+
 		$parameters = [
 			// Encryption API
 			'encryptionEnabled'       => $this->manager->isEnabled(),

settings/src/components/AdminTwoFactor.vue

@@ -77,33 +77,24 @@
 		},
 		data () {
 			return {
-				state: {
-					enforced: false,
-					enforcedGroups: [],
-					excludedGroups: [],
-				},
 				loading: false,
 				groups: [],
 				loadingGroups: false,
 			}
 		},
+		computed: {
+			state: function() {
+				return  {
+					enforced: this.$store.state.enforced,
+					enforcedGroups: this.$store.state.enforcedGroups,
+					excludedGroups: this.$store.state.excludedGroups,
+				}
+			}
+		},
 		mounted () {
-			this.loading = true
-			Axios.get(OC.generateUrl('/settings/api/admin/twofactorauth'))
-				.then(resp => resp.data)
-				.then(state => {
-					this.state = state
-
-					// Groups are loaded dynamically, but the assigned ones *should*
-					// be valid groups, so let's add them as initial state
-					this.groups = _.sortedUniq(this.state.enforcedGroups.concat(this.state.excludedGroups))
-
-					this.loading = false
-				})
-				.catch(err => {
-					console.error('Could not load two-factor state', err)
-					throw err
-				})
+			// Groups are loaded dynamically, but the assigned ones *should*
+			// be valid groups, so let's add them as initial state
+			this.groups = _.sortedUniq(this.state.enforcedGroups.concat(this.state.excludedGroups))
 		},
 		methods: {
 			searchGroup: _.debounce(function (query) {

settings/src/main-admin-security.js

@@ -1,10 +1,17 @@
 import Vue from 'vue'
 
 import AdminTwoFactor from './components/AdminTwoFactor.vue'
+import store from './store/admin-security'
 
 __webpack_nonce__ = btoa(OC.requestToken)
 
 Vue.prototype.t = t;
 
+store.replaceState(
+	OCP.InitialState.loadState('settings', 'mandatory2FAState')
+)
+
 const View = Vue.extend(AdminTwoFactor)
-new View().$mount('#two-factor-auth-settings')
+new View({
+	store
+}).$mount('#two-factor-auth-settings')

settings/src/store/admin-security.js

@@ -0,0 +1,63 @@
+/*
+ * @copyright 2019 Roeland Jago Douma <roeland@famdouma.nl>
+ *
+ * @author 2019 Roeland Jago Douma <roeland@famdouma.nl>
+ *
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+Vue.use(Vuex)
+
+export const mutations = {
+	setEnforced(state, enabled) {
+		Vue.set(state, 'enforced', enabled)
+	},
+	setEnforcedGroups(state, total) {
+		Vue.set(state, 'enforcedGroups', total)
+	},
+	setExcludedGroups(state, used) {
+		Vue.set(state, 'excludedGroups', used)
+	}
+}
+
+export const actions = {
+	save ({commit}, ) {
+		commit('setEnabled', false);
+
+		return generateCodes()
+			.then(({codes, state})  => {
+			commit('setEnabled', state.enabled);
+		commit('setTotal', state.total);
+		commit('setUsed', state.used);
+		commit('setCodes', codes);
+		return true;
+	});
+	}
+}
+
+export default new Vuex.Store({
+	strict: process.env.NODE_ENV !== 'production',
+	state: {
+		enforced: false,
+		enforcedGroups: [],
+		excludedGroups: [],
+	},
+	mutations,
+	actions
+})

settings/templates/settings/admin/security.php

@@ -30,6 +30,7 @@ script('settings', 'vue-settings-admin-security');
 
 <div id="two-factor-auth" class="section">
 	<h2><?php p($l->t('Two-Factor Authentication'));?></h2>
+	<input type="hidden" id="two-factor-auth-settings-initial-state" value="<?php p(base64_encode(json_encode($_['mandatory2FAState']))); ?>">
 	<div id="two-factor-auth-settings"></div>
 </div>
 

tests/lib/Settings/Admin/SecurityTest.php

@@ -23,10 +23,13 @@
 
 namespace Test\Settings\Admin;
 
+use OC\Authentication\TwoFactorAuth\MandatoryTwoFactor;
 use OC\Encryption\Manager;
 use OC\Settings\Admin\Security;
 use OCP\AppFramework\Http\TemplateResponse;
+use OCP\IInitialStateService;
 use OCP\IUserManager;
+use PHPUnit\Framework\MockObject\MockObject;
 use Test\TestCase;
 
 class SecurityTest extends TestCase {
@@ -36,15 +39,23 @@ class SecurityTest extends TestCase {
 	private $manager;
 	/** @var IUserManager */
 	private $userManager;
+	/** @var MandatoryTwoFactor|MockObject */
+	private $mandatoryTwoFactor;
+	/** @var IInitialStateService|MockObject */
+	private $initialState;
 
 	public function setUp() {
 		parent::setUp();
 		$this->manager = $this->getMockBuilder('\OC\Encryption\Manager')->disableOriginalConstructor()->getMock();
 		$this->userManager = $this->getMockBuilder(IUserManager::class)->getMock();
+		$this->mandatoryTwoFactor = $this->createMock(MandatoryTwoFactor::class);
+		$this->initialState = $this->createMock(IInitialStateService::class);
 
 		$this->admin = new Security(
 			$this->manager,
-			$this->userManager
+			$this->userManager,
+			$this->mandatoryTwoFactor,
+			$this->initialState
 		);
 	}