Merge pull request #32464 from nextcloud/port/sharebymail-admin-vue

Port share by mail settings to vue

6 files changed, 162 insertions, 82 deletions

diff --git a/apps/sharebymail/css/settings-admin.css b/apps/sharebymail/css/settings-admin.css
deleted file mode 100644
index fc6093ad525..00000000000
--- a/apps/sharebymail/css/settings-admin.css
+++ /dev/null
@@ -1,3 +0,0 @@
-#ncShareByMailSettings p {
-	padding-bottom: 10px;
-}
diff --git a/apps/sharebymail/js/settings-admin.js b/apps/sharebymail/js/settings-admin.js
deleted file mode 100644
index d586bde855b..00000000000
--- a/apps/sharebymail/js/settings-admin.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/**
- * @copyright Copyright (c) 2017 Bjoern Schiessle <bjoern@schiessle.org>
- *
- * @license AGPL-3.0-or-later
- *
- * 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/>.
- *
- */
-$(function() {
-
-	$('#sendPasswordMail').on('change', function() {
-		var status = 'no';
-		if ($(this).is(':checked')) {
-			status = 'yes';
-		}
-		OCP.AppConfig.setValue('sharebymail', 'sendpasswordmail', status);
-	});
-
-	$('#enforcePasswordProtection').on('change', function() {
-		var status = 'no';
-		if ($(this).is(':checked')) {
-			status = 'yes';
-		}
-		OCP.AppConfig.setValue('sharebymail', 'enforcePasswordProtection', status);
-	});
-
-	$('#replyToInitiator').on('change', function() {
-		var status = 'no';
-		if ($(this).is(':checked')) {
-			status = 'yes';
-		}
-		OCP.AppConfig.setValue('sharebymail', 'replyToInitiator', status);
-	});
-
-});
diff --git a/apps/sharebymail/lib/Settings/Admin.php b/apps/sharebymail/lib/Settings/Admin.php
index f1733b73bc0..5f690f16f2b 100644
--- a/apps/sharebymail/lib/Settings/Admin.php
+++ b/apps/sharebymail/lib/Settings/Admin.php
@@ -24,32 +24,29 @@
 namespace OCA\ShareByMail\Settings;
 
 use OCP\AppFramework\Http\TemplateResponse;
+use OCP\AppFramework\Services\IInitialState;
 use OCP\IL10N;
 use OCP\Settings\IDelegatedSettings;
 
 class Admin implements IDelegatedSettings {
+	private SettingsManager $settingsManager;
+	private IL10N $l;
+	private IInitialState $initialState;
 
-	/** @var SettingsManager */
-	private $settingsManager;
-
-	/** @var IL10N */
-	private $l;
-
-	public function __construct(SettingsManager $settingsManager, IL10N $l) {
+	public function __construct(SettingsManager $settingsManager, IL10N $l, IInitialState $initialState) {
 		$this->settingsManager = $settingsManager;
 		$this->l = $l;
+		$this->initialState = $initialState;
 	}
 
 	/**
 	 * @return TemplateResponse
 	 */
 	public function getForm() {
-		$parameters = [
-			'sendPasswordMail' => $this->settingsManager->sendPasswordByMail(),
-			'replyToInitiator' => $this->settingsManager->replyToInitiator()
-		];
+		$this->initialState->provideInitialState('sendPasswordMail', $this->settingsManager->sendPasswordByMail());
+		$this->initialState->provideInitialState('replyToInitiator', $this->settingsManager->replyToInitiator());
 
-		return new TemplateResponse('sharebymail', 'settings-admin', $parameters, '');
+		return new TemplateResponse('sharebymail', 'settings-admin', [], '');
 	}
 
 	/**
diff --git a/apps/sharebymail/src/components/AdminSettings.vue b/apps/sharebymail/src/components/AdminSettings.vue
new file mode 100644
index 00000000000..29b7f051a4b
--- /dev/null
+++ b/apps/sharebymail/src/components/AdminSettings.vue
@@ -0,0 +1,91 @@
+<!--
+	- @copyright 2022 Carl Schwan <carl@carlschwan.eu>
+	-
+	- @author Carl Schwan <carl@carlschwan.eu>
+	-
+	- @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/>.
+	-
+-->
+
+<template>
+	<SettingsSection :title="t('sharebymail', 'Share by mail')"
+		:description="t('sharebymail', 'Allows users to share a personalized link to a file or folder by putting in an email address.')">
+		<CheckboxRadioSwitch type="switch"
+			:checked.sync="sendPasswordMail"
+			@update:checked="update('sendpasswordmail', sendPasswordMail)">
+			{{ t('sharebymail', 'Send password by mail') }}
+		</CheckboxRadioSwitch>
+
+		<CheckboxRadioSwitch type="switch"
+			:checked.sync="replyToInitiator"
+			@update:checked="update('replyToInitiator', replyToInitiator)">
+			{{ t('sharebymail', 'Reply to initiator') }}
+		</CheckboxRadioSwitch>
+	</SettingsSection>
+</template>
+
+<script>
+import CheckboxRadioSwitch from '@nextcloud/vue/dist/Components/CheckboxRadioSwitch'
+import SettingsSection from '@nextcloud/vue/dist/Components/SettingsSection'
+import { loadState } from '@nextcloud/initial-state'
+import { showError } from '@nextcloud/dialogs'
+import axios from '@nextcloud/axios'
+import { generateOcsUrl } from '@nextcloud/router'
+import confirmPassword from '@nextcloud/password-confirmation'
+
+export default {
+	name: 'AdminSettings',
+	components: {
+		CheckboxRadioSwitch,
+		SettingsSection,
+	},
+	data() {
+		return {
+			sendPasswordMail: loadState('sharebymail', 'sendPasswordMail'),
+			replyToInitiator: loadState('sharebymail', 'replyToInitiator'),
+		}
+	},
+	methods: {
+		async update(key, value) {
+			await confirmPassword()
+			const url = generateOcsUrl('/apps/provisioning_api/api/v1/config/apps/{appId}/{key}', {
+				appId: 'sharebymail',
+				key,
+			})
+			const stringValue = value ? 'yes' : 'no'
+			try {
+				const { data } = await axios.post(url, {
+					value: stringValue,
+				})
+				this.handleResponse({
+					status: data.ocs?.meta?.status
+				})
+			} catch (e) {
+				this.handleResponse({
+					errorMessage: t('sharebymail', 'Unable to update share by mail config'),
+					error: e,
+				})
+			}
+		},
+		async handleResponse({ status, errorMessage, error }) {
+			if (status !== 'ok') {
+				showError(errorMessage)
+				console.error(errorMessage, error)
+			}
+		},
+	}
+}
+</script>
diff --git a/apps/sharebymail/src/main-admin.js b/apps/sharebymail/src/main-admin.js
new file mode 100644
index 00000000000..18b31a54e06
--- /dev/null
+++ b/apps/sharebymail/src/main-admin.js
@@ -0,0 +1,39 @@
+/**
+ * @copyright 2022 Carl Schwan <carl@carlschwan.eu>
+ *
+ * @author Carl Schwan <carl@carlschwan.eu>
+ *
+ * @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 { getRequestToken } from '@nextcloud/auth'
+import { translate as t } from '@nextcloud/l10n'
+import '@nextcloud/dialogs/styles/toast.scss'
+
+import AdminSettings from './components/AdminSettings'
+
+__webpack_nonce__ = btoa(getRequestToken())
+
+Vue.mixin({
+	methods: {
+		t,
+	},
+})
+
+const AdminSettingsView = Vue.extend(AdminSettings)
+new AdminSettingsView().$mount('#vue-admin-sharebymail')
diff --git a/apps/sharebymail/templates/settings-admin.php b/apps/sharebymail/templates/settings-admin.php
index 22c9fcedffd..cb58b4cfa48 100644
--- a/apps/sharebymail/templates/settings-admin.php
+++ b/apps/sharebymail/templates/settings-admin.php
@@ -1,24 +1,26 @@
 <?php
-/** @var array $_ */
+/**
+ * @copyright 2022 Carl Schwan <carl@carlschwan.eu>
+ *
+ * @author Carl Schwan <carl@carlschwan.eu>
+ *
+ * @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/>.
+ *
+ */
 
-/** @var \OCP\IL10N $l */
-script('sharebymail', 'settings-admin');
-style('sharebymail', 'settings-admin');
+\OCP\Util::addScript('sharebymail', 'vue-settings-admin-sharebymail');
 ?>
-<div id="ncShareByMailSettings" class="section">
-	<h2><?php p($l->t('Share by mail')); ?></h2>
-	<p class="settings-hint"><?php p($l->t('Allows users to share a personalized link to a file or folder by putting in an email address.')); ?></p>
-
-	<p>
-		<input id="sendPasswordMail" type="checkbox" class="checkbox" <?php if ($_['sendPasswordMail']) {
-	p('checked');
-} ?> />
-		<label for="sendPasswordMail"><?php p($l->t('Send password by mail')); ?></label><br/>
-
-		<input id="replyToInitiator" type="checkbox" class="checkbox" <?php if ($_['replyToInitiator']) {
-	p('checked');
-} ?> />
-		<label for="replyToInitiator"><?php p($l->t('Reply to initiator')); ?></label>
-	</p>
-
-</div>
+<div id="vue-admin-sharebymail"></div>