Move SSO & Registration settings to the new admin panel's Auth page

app/Api/v1/Controllers/SettingController.php

@@ -6,6 +6,7 @@ use App\Api\v1\Requests\SettingStoreRequest;
 use App\Api\v1\Requests\SettingUpdateRequest;
 use App\Facades\Settings;
 use App\Http\Controllers\Controller;
+use Illuminate\Validation\ValidationException;
 
 class SettingController extends Controller
 {
@@ -95,8 +96,18 @@ class SettingController extends Controller
             abort(404);
         }
 
-        $appSettings = config('2fauth.settings');
-        if (array_key_exists($settingName, $appSettings)) {
+        $defaultAppSettings = config('2fauth.settings');
+
+        // When deleting a setting, it may be an original or an additional one:
+        // - Additional settings are created by administrators to extend 2FAuth, they are not registered in the laravel config object.
+        //   They are not nullable so empty string is not allowed.They only exist in the Options table, so it is possible to delete them. 
+        // - Original settings are part of 2FAuth, they are registered in the laravel config object with their default value.
+        //   When set by an admin, their custom value is stored in the Options table too. Deleting a custom value in the Options table from here
+        //   won't delete the setting at all, so we reject all requests that ask for.
+        //   But there is an exception with the restrictRule and restrictList settings:
+        //     Unlike other settings, these two have to support empty strings. Because the Options table does not allow empty strings,
+        //     the only way to set them like so is to restore their original value, an empty string.
+        if (array_key_exists($settingName, $defaultAppSettings) && $defaultAppSettings[$settingName] !== '') {
             return response()->json(
                 ['message'   => 'bad request',
                     'reason' => [__('errors.delete_user_setting_only')],

config/2fauth.php

@@ -89,6 +89,8 @@ return [
         'disableRegistration' => false,
         'enableSso' => true,
         'restrictRegistration' => false,
+        'restrictList' => '',
+        'restrictRule' => '',
         'keepSsoRegistrationEnabled' => false,
     ],
 

resources/js/composables/appSettingsUpdater.js

@@ -0,0 +1,32 @@
+import appSettingService from '@/services/appSettingService'
+import { useAppSettingsStore } from '@/stores/appSettings'
+import { useNotifyStore } from '@/stores/notify'
+
+/**
+ * Saves a setting on the backend
+ * @param {string} preference 
+ * @param {any} value 
+ */
+export async function useAppSettingsUpdater(setting, value, returnValidationError = false) {
+
+    // const appSettings = useAppSettingsStore()
+    let data = null
+    let error = null
+
+    await appSettingService.update(setting, value, { returnError: true })
+    .then(response => {
+        // appSettings[setting] = value
+        data = value
+        useNotifyStore().success({ type: 'is-success', text: trans('settings.forms.setting_saved') })
+    })
+    .catch(err => {
+        if( returnValidationError && err.response.status === 422 ) {
+            error = err
+        }
+        else {
+            useNotifyStore().error(err);
+        }
+    })
+
+    return { data, error }
+}

resources/js/services/appSettingService.js

@@ -7,7 +7,7 @@ export default {
      * 
      * @returns 
      */
-    get(config = {}) {
+    getAll(config = {}) {
         return apiClient.get('/settings', { ...config })
     },
 
@@ -15,8 +15,8 @@ export default {
      * 
      * @returns 
      */
-    update(name, value) {
-        return apiClient.put('/settings/' + name, { value: value })
+    update(name, value, config = {}) {
+        return apiClient.put('/settings/' + name, { value: value }, { ...config })
     },
     
     /**

resources/js/stores/appSettings.js

@@ -1,4 +1,6 @@
+import appSettingService from '@/services/appSettingService'
 import { defineStore } from 'pinia'
+import { useNotifyStore } from '@/stores/notify'
 
 export const useAppSettingsStore = defineStore({
     id: 'appSettings',
@@ -8,6 +10,20 @@ export const useAppSettingsStore = defineStore({
     },
 
     actions: {
-        
+
+        /**
+         * Fetches the appSetting collection from the backend
+         */
+        async fetch() {
+            appSettingService.getAll({ returnError: true })
+            .then(response => {
+                response.data.forEach(setting => {
+                    this[setting.key] = setting.value
+                })
+            })
+            .catch(error => {
+                useNotifyStore().alert({ text: trans('errors.data_cannot_be_refreshed_from_server') })
+            })
+        },
     },
 })

resources/js/views/admin/AppSetup.vue

@@ -1,7 +1,7 @@
 <script setup>
     import AdminTabs from '@/layouts/AdminTabs.vue'
-    import appSettingService from '@/services/appSettingService'
     import systemService from '@/services/systemService'
+    import { useAppSettingsUpdater } from '@/composables/appSettingsUpdater'
     import { useAppSettingsStore } from '@/stores/appSettings'
     import { useNotifyStore } from '@/stores/notify'
     import { useUserStore } from '@/stores/user'
@@ -18,68 +18,6 @@
     const listInfos = ref(null)
     const isSendingTestEmail = ref(false)
     const isClearingCache = ref(false)
-    const fieldErrors = ref({
-        restrictList: null,
-        restrictRule: null,
-    })
-    const _settings = ref({
-        checkForUpdate: appSettings.checkForUpdate,
-        useEncryption: appSettings.useEncryption,
-        restrictRegistration: appSettings.restrictRegistration,
-        restrictList: appSettings.restrictList,
-        restrictRule: appSettings.restrictRule,
-        disableRegistration: appSettings.disableRegistration,
-        keepSsoRegistrationEnabled: appSettings.keepSsoRegistrationEnabled,
-        enableSso: appSettings.enableSso,
-    })
-
-    /**
-     * Saves a setting on the backend
-     * @param {string} preference 
-     * @param {any} value 
-     */
-    function saveSetting(setting, value) {
-        fieldErrors.value[setting] = null
-
-        appSettingService.update(setting, value).then(response => {
-            appSettings[setting] = value
-            useNotifyStore().success({ type: 'is-success', text: trans('settings.forms.setting_saved') })
-        })
-        .catch(error => {
-            if( error.response.status === 422 ) {
-                fieldErrors.value[setting] = error.response.data.message
-            }
-            else {
-                notify.error(error);
-            }
-        })
-    }
-
-    /**
-     * Saves a setting on the backend
-     * @param {string} preference 
-     * @param {any} value 
-     */
-    function saveOrDeleteSetting(setting, value) {
-        if (value == '') {
-            fieldErrors.value[setting] = null
-
-            appSettingService.delete(setting, { returnError: true }).then(response => {
-                appSettings[setting] = ''
-                useNotifyStore().success({ type: 'is-success', text: trans('settings.forms.setting_saved') })
-            })
-            .catch(error => {
-                // appSettings[setting] = oldValue
-
-                if( error.response.status !== 404 ) {
-                    notify.error(error);
-                }
-            })
-        }
-        else {
-            saveSetting(setting, value)
-        }
-    }
 
     /**
      * Sends a test email
@@ -114,21 +52,7 @@
     })
 
     onMounted(async () => {
-        appSettingService.get({ returnError: true })
-        .then(response => {
-            // we reset those two because they are not registered on server side
-            // in order to be able to set them to blank
-            _settings.value.restrictList = ''
-            _settings.value.restrictRule = ''
-
-            response.data.forEach(setting => {
-                appSettings[setting.key] = setting.value
-                _settings.value[setting.key] = setting.value
-            })
-        })
-        .catch(error => {
-            notify.alert({ text: trans('errors.data_cannot_be_refreshed_from_server') })
-        })
+        await appSettings.fetch()
 
         systemService.getSystemInfos({returnError: true}).then(response => {
             infos.value = response.data.common
@@ -148,7 +72,7 @@
                 <form>
                     <h4 class="title is-4 pt-4 has-text-grey-light">{{ $t('settings.general') }}</h4>
                     <!-- Check for update -->
-                    <FormCheckbox v-model="_settings.checkForUpdate" @update:model-value="val => saveSetting('checkForUpdate', val)" fieldName="checkForUpdate" label="commons.check_for_update" help="commons.check_for_update_help" />
+                    <FormCheckbox v-model="appSettings.checkForUpdate" @update:model-value="val => useAppSettingsUpdater('checkForUpdate', val)" fieldName="checkForUpdate" label="commons.check_for_update" help="commons.check_for_update_help" />
                     <VersionChecker />
                     <!-- email config test -->
                     <div class="field">
@@ -170,20 +94,7 @@
 
                     <h4 class="title is-4 pt-4 has-text-grey-light">{{ $t('settings.security') }}</h4>
                     <!-- protect db -->
-                    <FormCheckbox v-model="_settings.useEncryption" @update:model-value="val => saveSetting('useEncryption', val)" fieldName="useEncryption" label="admin.forms.use_encryption.label" help="admin.forms.use_encryption.help" />
-                    <h4 class="title is-4 pt-4 has-text-grey-light">{{ $t('admin.registrations') }}</h4>
-                    <!-- disable SSO registration -->
-                    <FormCheckbox v-model="_settings.enableSso" @update:model-value="val => saveSetting('enableSso', val)" fieldName="enableSso" label="admin.forms.enable_sso.label" help="admin.forms.enable_sso.help" />
-                    <!-- restrict registration -->
-                    <FormCheckbox v-model="_settings.restrictRegistration" @update:model-value="val => saveSetting('restrictRegistration', val)" fieldName="restrictRegistration" :isDisabled="appSettings.disableRegistration" label="admin.forms.restrict_registration.label" help="admin.forms.restrict_registration.help" />
-                        <!-- restrict list -->
-                        <FormField v-model="_settings.restrictList" @change:model-value="val => saveOrDeleteSetting('restrictList', val)" :fieldError="fieldErrors.restrictList" fieldName="restrictList" :isDisabled="!appSettings.restrictRegistration || appSettings.disableRegistration" label="admin.forms.restrict_list.label" help="admin.forms.restrict_list.help" :isIndented="true" />
-                        <!-- restrict rule -->
-                        <FormField v-model="_settings.restrictRule" @change:model-value="val => saveOrDeleteSetting('restrictRule', val)" :fieldError="fieldErrors.restrictRule" fieldName="restrictRule" :isDisabled="!appSettings.restrictRegistration || appSettings.disableRegistration" label="admin.forms.restrict_rule.label" help="admin.forms.restrict_rule.help" :isIndented="true" leftIcon="slash" rightIcon="slash" />
-                    <!-- disable registration -->
-                    <FormCheckbox v-model="_settings.disableRegistration" @update:model-value="val => saveSetting('disableRegistration', val)" fieldName="disableRegistration" label="admin.forms.disable_registration.label" help="admin.forms.disable_registration.help" />
-                        <!-- keep sso registration -->
-                        <FormCheckbox v-model="_settings.keepSsoRegistrationEnabled" @update:model-value="val => saveSetting('keepSsoRegistrationEnabled', val)" :fieldError="fieldErrors.keepSsoRegistrationEnabled" fieldName="keepSsoRegistrationEnabled" :isDisabled="!appSettings.enableSso || !appSettings.disableRegistration" label="admin.forms.keep_sso_registration_enabled.label" help="admin.forms.keep_sso_registration_enabled.help" :isIndented="true" />
+                    <FormCheckbox v-model="appSettings.useEncryption" @update:model-value="val => useAppSettingsUpdater('useEncryption', val)" fieldName="useEncryption" label="admin.forms.use_encryption.label" help="admin.forms.use_encryption.help" />
                 </form>
 
                 <h4 class="title is-4 pt-5 has-text-grey-light">{{ $t('commons.environment') }}</h4>

resources/js/views/admin/Auth.vue

@@ -1,5 +1,99 @@
 <script setup>
+    import AdminTabs from '@/layouts/AdminTabs.vue'
+    import appSettingService from '@/services/appSettingService'
+    import { useAppSettingsUpdater } from '@/composables/appSettingsUpdater'
+    import { useAppSettingsStore } from '@/stores/appSettings'
+    import { useNotifyStore } from '@/stores/notify'
+
+    const $2fauth = inject('2fauth')
+    const notify = useNotifyStore()
+    const appSettings = useAppSettingsStore()
+    const returnTo = useStorage($2fauth.prefix + 'returnTo', 'accounts')
+
+    const fieldErrors = ref({
+        restrictList: null,
+        restrictRule: null,
+    })
+
+    /**
+     * Saves a setting on the backend
+     * 
+     * @param {string} preference 
+     * @param {any} value 
+     */
+    // async function saveSetting(setting, value) {
+
+    // }
+
+    /**
+     * Saves or deletes a setting on the backend
+     * 
+     * @param {string} preference 
+     * @param {any} value 
+     */
+    async function saveOrDeleteSetting(setting, value) {
+        fieldErrors.value[setting] = null
+
+        // restrictRule and RestrictList may be empty if the admin decides to not use them.
+        // As an app setting cannot be set with an empty string (the 'value' field in the 'Options'
+        // table is not NULLABLE), we 'delete' the appSetting instead of updating it.
+        if (value == '') {
+            appSettingService.delete(setting, { returnError: true }).then(response => {
+                appSettings[setting] = ''
+                notify.success({ type: 'is-success', text: trans('settings.forms.setting_saved') })
+            })
+            .catch(error => {
+                if( error.response.status !== 404 ) {
+                    notify.error(error);
+                }
+            })
+        }
+        else {
+            const { error } = await useAppSettingsUpdater(setting, value, true)
+
+            if( error ) {
+                fieldErrors.value[setting] = error.response.data.message
+            }
+        }
+    }
+
+    onBeforeRouteLeave((to) => {
+        if (! to.name.startsWith('admin.')) {
+            notify.clear()
+        }
+    })
+
+    onMounted(async () => {
+        await appSettings.fetch()
+    })
 
 </script>
 
 <template>
+    <div>
+        <AdminTabs activeTab="admin.auth" />
+        <div class="options-tabs">
+            <FormWrapper>
+                <form>
+                    <h4 class="title is-4 pt-4 has-text-grey-light">{{ $t('admin.single_sign_on') }}</h4>
+                    <!-- enable SSO -->
+                    <FormCheckbox v-model="appSettings.enableSso" @update:model-value="val => useAppSettingsUpdater('enableSso', val)" fieldName="enableSso" label="admin.forms.enable_sso.label" help="admin.forms.enable_sso.help" />
+                    <h4 class="title is-4 pt-4 has-text-grey-light">{{ $t('admin.registrations') }}</h4>
+                    <!-- restrict registration -->
+                    <FormCheckbox v-model="appSettings.restrictRegistration" @update:model-value="val => useAppSettingsUpdater('restrictRegistration', val)" fieldName="restrictRegistration" :isDisabled="appSettings.disableRegistration" label="admin.forms.restrict_registration.label" help="admin.forms.restrict_registration.help" />
+                        <!-- restrict list -->
+                        <FormField v-model="appSettings.restrictList" @change:model-value="val => saveOrDeleteSetting('restrictList', val)" :fieldError="fieldErrors.restrictList" fieldName="restrictList" :isDisabled="!appSettings.restrictRegistration || appSettings.disableRegistration" label="admin.forms.restrict_list.label" help="admin.forms.restrict_list.help" :isIndented="true" />
+                        <!-- restrict rule -->
+                        <FormField v-model="appSettings.restrictRule" @change:model-value="val => saveOrDeleteSetting('restrictRule', val)" :fieldError="fieldErrors.restrictRule" fieldName="restrictRule" :isDisabled="!appSettings.restrictRegistration || appSettings.disableRegistration" label="admin.forms.restrict_rule.label" help="admin.forms.restrict_rule.help" :isIndented="true" leftIcon="slash" rightIcon="slash" />
+                    <!-- disable registration -->
+                    <FormCheckbox v-model="appSettings.disableRegistration" @update:model-value="val => useAppSettingsUpdater('disableRegistration', val)" fieldName="disableRegistration" label="admin.forms.disable_registration.label" help="admin.forms.disable_registration.help" />
+                        <!-- keep sso registration -->
+                        <FormCheckbox v-model="appSettings.keepSsoRegistrationEnabled" @update:model-value="val => useAppSettingsUpdater('keepSsoRegistrationEnabled', val)" fieldName="keepSsoRegistrationEnabled" :isDisabled="!appSettings.enableSso || !appSettings.disableRegistration" label="admin.forms.keep_sso_registration_enabled.label" help="admin.forms.keep_sso_registration_enabled.help" :isIndented="true" />
+                </form>
+            </FormWrapper>
+        </div>
+        <VueFooter :showButtons="true">
+            <ButtonBackCloseCancel :returnTo="{ name: returnTo }" action="close" />
+        </VueFooter>
+    </div>
+</template>

resources/lang/en/admin.php

@@ -15,6 +15,7 @@ return [
 
     'admin' => 'Admin',
     'app_setup' => 'App setup',
+    'auth' => 'Auth',
     'registrations' => 'Registrations',
     'users' => 'Users',
     'users_legend' => 'Manage users registered on your instance or create new ones.',
@@ -83,6 +84,7 @@ return [
     'show_one_year_log' => 'Show entries from the last year',
     'sort_by_date_asc' => 'Show least recent first',
     'sort_by_date_desc' => 'Show most recent first',
+    'single_sign_on' => 'Single Sign-On (SSO)',
     'forms' => [
         'use_encryption' => [
             'label' => 'Protect sensitive data',
@@ -105,7 +107,7 @@ return [
             'help' => 'Prevent new user registration. Unless overridden (see below), this affects SSO as well, so new users won\'t be able to sign in via SSO',
         ],
         'enable_sso' => [
-            'label' => 'Enable Single Sign-On (SSO)',
+            'label' => 'Enable SSO',
             'help' => 'Allow visitors to authenticate using an external ID via the Single Sign-On scheme',
         ],
         'keep_sso_registration_enabled' => [