diff options
Diffstat (limited to 'apps/settings/src/components/PersonalInfo/shared/FederationControl.vue')
| -rw-r--r-- | apps/settings/src/components/PersonalInfo/shared/FederationControl.vue | 95 |
1 files changed, 40 insertions, 55 deletions
diff --git a/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue b/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue index ae1392fe580..e55a50056d3 100644 --- a/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue +++ b/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue @@ -1,50 +1,39 @@ <!-- - - @copyright 2021, Christopher Ng <chrng8@gmail.com> - - - - @author Christopher Ng <chrng8@gmail.com> - - - - @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/>. - - + - SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors + - SPDX-License-Identifier: AGPL-3.0-or-later --> <template> - <NcActions :class="{ 'federation-actions': !additional, 'federation-actions--additional': additional }" + <NcActions ref="federationActions" + class="federation-actions" :aria-label="ariaLabel" - :default-icon="scopeIcon" :disabled="disabled"> - <FederationControlAction v-for="federationScope in federationScopes" + <template #icon> + <NcIconSvgWrapper :path="scopeIcon" /> + </template> + + <NcActionButton v-for="federationScope in federationScopes" :key="federationScope.name" - :active-scope="scope" - :display-name="federationScope.displayName" - :handle-scope-change="changeScope" - :icon-class="federationScope.iconClass" - :is-supported-scope="supportedScopes.includes(federationScope.name)" - :name="federationScope.name" - :tooltip-disabled="federationScope.tooltipDisabled" - :tooltip="federationScope.tooltip" - :aria-label="federationScope.tooltip" /> + :close-after-click="true" + :disabled="!supportedScopes.includes(federationScope.name)" + :name="federationScope.displayName" + type="radio" + :value="federationScope.name" + :model-value="scope" + @update:modelValue="changeScope"> + <template #icon> + <NcIconSvgWrapper :path="federationScope.icon" /> + </template> + {{ supportedScopes.includes(federationScope.name) ? federationScope.tooltip : federationScope.tooltipDisabled }} + </NcActionButton> </NcActions> </template> <script> -import NcActions from '@nextcloud/vue/dist/Components/NcActions' +import NcActions from '@nextcloud/vue/components/NcActions' +import NcActionButton from '@nextcloud/vue/components/NcActionButton' +import NcIconSvgWrapper from '@nextcloud/vue/components/NcIconSvgWrapper' import { loadState } from '@nextcloud/initial-state' -import { showError } from '@nextcloud/dialogs' - -import FederationControlAction from './FederationControlAction.vue' import { ACCOUNT_PROPERTY_READABLE_ENUM, @@ -52,11 +41,12 @@ import { PROFILE_READABLE_ENUM, PROPERTY_READABLE_KEYS_ENUM, PROPERTY_READABLE_SUPPORTED_SCOPES_ENUM, - SCOPE_ENUM, SCOPE_PROPERTY_ENUM, + SCOPE_PROPERTY_ENUM, + SCOPE_ENUM, UNPUBLISHED_READABLE_PROPERTIES, } from '../../../constants/AccountPropertyConstants.js' import { savePrimaryAccountPropertyScope } from '../../../service/PersonalInfo/PersonalInfoService.js' -import logger from '../../../logger.js' +import { handleError } from '../../../utils/handlers.ts' const { federationEnabled, @@ -68,7 +58,8 @@ export default { components: { NcActions, - FederationControlAction, + NcActionButton, + NcIconSvgWrapper, }, props: { @@ -99,6 +90,8 @@ export default { }, }, + emits: ['update:scope'], + data() { return { readableLowerCase: this.readable.toLocaleLowerCase(), @@ -116,7 +109,7 @@ export default { }, scopeIcon() { - return SCOPE_PROPERTY_ENUM[this.scope].iconClass + return SCOPE_PROPERTY_ENUM[this.scope].icon }, federationScopes() { @@ -151,6 +144,9 @@ export default { } else { await this.updateAdditionalScope(scope) } + + // TODO: provide focus method from NcActions + this.$refs.federationActions.$refs?.triggerButton?.$el?.focus?.() }, async updatePrimaryScope(scope) { @@ -188,8 +184,7 @@ export default { this.initialScope = scope } else { this.$emit('update:scope', this.initialScope) - showError(errorMessage) - logger.error(errorMessage, error) + handleError(error, errorMessage) } }, }, @@ -197,25 +192,15 @@ export default { </script> <style lang="scss" scoped> - .federation-actions, - .federation-actions--additional { - opacity: 0.4 !important; - - &:hover, - &:focus, - &:active { - opacity: 0.8 !important; - } - } - - .federation-actions--additional { - &::v-deep button { +.federation-actions { + &--additional { + &:deep(button) { // TODO remove this hack - padding-bottom: 7px; height: 30px !important; min-height: 30px !important; width: 30px !important; min-width: 30px !important; } } +} </style> |