feat(sharing): Replace sharing options with link in collective actions

Signed-off-by: Jonas <[email protected]>
nextcloud · Dec 13, 2023 · e1b379a · e1b379a
1 parent 924952b
commit e1b379a
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 113 deletions.
diff --git a/src/components/Collective/CollectiveActions.vue b/src/components/Collective/CollectiveActions.vue
@@ -10,44 +10,13 @@
 		</NcActionButton>
 		<NcActionSeparator v-if="isCollectiveAdmin(collective)" />
 		<NcActionButton v-if="collectiveCanShare(collective)"
-			v-show="!isShared"
-			:close-after-click="false"
-			@click="share(collective)">
-			{{ t('collectives', 'Share link') }}
-			<template #icon>
-				<NcLoadingIcon v-if="loading('share')" :size="20" />
-				<LinkVariantIcon v-else :size="20" />
-			</template>
-		</NcActionButton>
-		<NcActionButton v-if="!isPublic"
-			v-show="isShared"
-			:close-after-click="false"
-			@click.stop.prevent="copyShare(collective)">
-			<template #icon>
-				<CheckIcon v-if="copySuccess" :size="20" />
-				<NcLoadingIcon v-else-if="copyLoading" :size="20" />
-				<ContentPasteIcon v-else :size="20" />
-			</template>
-			{{ copyButtonText }}
-		</NcActionButton>
-		<NcActionCheckbox v-if="!isPublic"
-			v-show="isShared && collectiveCanEdit(collective)"
-			id="shareEditable"
-			:disabled="loading('shareEditable')"
-			:checked.sync="shareEditable">
-			{{ t('collectives', 'Allow editing in share') }}
-		</NcActionCheckbox>
-		<NcActionButton v-if="!isPublic"
-			v-show="isShared"
-			:close-after-click="false"
-			@click="unshare(collective)">
+			:close-after-click="true"
+			@click="openShareTab(collective)">
+			{{ t('collectives', 'Manage share links') }}
 			<template #icon>
-				<NcLoadingIcon v-if="loading('unshare')" :size="20" />
-				<LinkVariantIcon v-else :size="20" />
+				<ShareVariantIcon :size="20" />
 			</template>
-			{{ t('collectives', 'Unshare') }}
 		</NcActionButton>
-		<NcActionSeparator v-if="collectiveCanShare(collective) && !isPublic" />
 		<NcActionLink :close-after-click="true"
 			:href="printLink"
 			target="_blank">
@@ -77,49 +46,34 @@
 
 <script>
 import { mapActions, mapGetters, mapMutations } from 'vuex'
-import { NcActionButton, NcActionCheckbox, NcActionLink, NcActionSeparator, NcLoadingIcon } from '@nextcloud/vue'
+import { NcActionButton, NcActionLink, NcActionSeparator } from '@nextcloud/vue'
 import { showError, showUndo } from '@nextcloud/dialogs'
 import { generateUrl } from '@nextcloud/router'
 import AccountMultipleIcon from 'vue-material-design-icons/AccountMultiple.vue'
-import CheckIcon from 'vue-material-design-icons/Check.vue'
 import CogIcon from 'vue-material-design-icons/Cog.vue'
-import ContentPasteIcon from 'vue-material-design-icons/ContentPaste.vue'
 import DownloadIcon from 'vue-material-design-icons/Download.vue'
-import LinkVariantIcon from 'vue-material-design-icons/LinkVariant.vue'
 import LogoutIcon from 'vue-material-design-icons/Logout.vue'
+import ShareVariantIcon from 'vue-material-design-icons/ShareVariant.vue'
 import {
 	LEAVE_CIRCLE,
 	MARK_COLLECTIVE_DELETED,
 	UNMARK_COLLECTIVE_DELETED,
-	CREATE_SHARE,
-	UPDATE_SHARE,
-	DELETE_SHARE,
 } from '../../store/actions.js'
-import displayError from '../../util/displayError.js'
-import CopyToClipboardMixin from '../../mixins/CopyToClipboardMixin.js'
 
 export default {
 	name: 'CollectiveActions',
 
 	components: {
 		AccountMultipleIcon,
-		CheckIcon,
 		CogIcon,
-		ContentPasteIcon,
 		DownloadIcon,
-		LinkVariantIcon,
 		LogoutIcon,
 		NcActionButton,
-		NcActionCheckbox,
 		NcActionLink,
 		NcActionSeparator,
-		NcLoadingIcon,
+		ShareVariantIcon,
 	},
 
-	mixins: [
-		CopyToClipboardMixin,
-	],
-
 	props: {
 		collective: {
 			type: Object,
@@ -130,85 +84,46 @@ export default {
 	data() {
 		return {
 			leaveTimeout: null,
-			shareEditable: this.collective.shareEditable,
 		}
 	},
 
 	computed: {
 		...mapGetters([
-			'collectiveCanEdit',
 			'collectiveCanShare',
-			'collectiveParam',
-			'collectiveShareUrl',
 			'isCollectiveAdmin',
 			'isPublic',
-			'loading',
 			'shareTokenParam',
 		]),
 
 		circleLink() {
 			return generateUrl('/apps/contacts/direct/circle/' + this.collective.circleId)
 		},
 
-		isShared() {
-			return !!this.collective.shareToken
-		},
-
-		copyButtonText() {
-			if (this.copied) {
-				return this.copySuccess
-					? t('collectives', 'Copied')
-					: t('collectives', 'Cannot copy')
-			}
-			return t('collectives', 'Copy share link')
-		},
-
 		printLink() {
 			return this.isPublic
 				? generateUrl(`/apps/collectives/p/${this.shareTokenParam}/print/${this.collective.name}`)
 				: generateUrl(`/apps/collectives/_/print/${this.collective.name}`)
 		},
 	},
 
-	watch: {
-		shareEditable(val) {
-			if (val !== undefined) {
-				const collective = { ...this.collective }
-				collective.shareEditable = val
-				return this.dispatchUpdateShare(collective)
-					.catch(displayError('Could not change the collective share editing permissions'))
-			}
-		},
-	},
-
 	methods: {
 		...mapActions({
 			dispatchLeaveCircle: LEAVE_CIRCLE,
-			dispatchCreateShare: CREATE_SHARE,
-			dispatchDeleteShare: DELETE_SHARE,
-			dispatchUpdateShare: UPDATE_SHARE,
 			dispatchMarkCollectiveDeleted: MARK_COLLECTIVE_DELETED,
 			dispatchUnmarkCollectiveDeleted: UNMARK_COLLECTIVE_DELETED,
 		}),
 
 		...mapMutations([
+			'setActiveSidebarTab',
 			'setMembersCollectiveId',
 			'setSettingsCollectiveId',
+			'show',
 		]),
 
-		share(collective) {
-			return this.dispatchCreateShare(collective)
-				.catch(displayError('Could not share the collective'))
-		},
-
-		unshare(collective) {
-			this.shareEditable = undefined
-			return this.dispatchDeleteShare(collective)
-				.catch(displayError('Could not unshare the collective'))
-		},
-
-		copyShare(collective) {
-			this.copyToClipboard(window.location.origin + this.collectiveShareUrl(collective))
+		openShareTab(collective) {
+			this.$router.push(`/${encodeURIComponent(collective.name)}`)
+			this.show('sidebar')
+			this.setActiveSidebarTab('sharing')
 		},
 
 		openCollectiveMembers() {

diff --git a/src/components/PageSidebar.vue b/src/components/PageSidebar.vue
@@ -1,6 +1,7 @@
 <template>
 	<NcAppSidebar ref="sidebar"
 		:title="title"
+		:active.sync="active"
 		@close="close">
 		<NcAppSidebarTab id="attachments"
 			:order="0"
@@ -71,19 +72,34 @@ export default {
 		SidebarTabVersions,
 	},
 
+	data() {
+		return {
+		}
+	},
+
 	computed: {
 		...mapGetters([
-			'isPublic',
+			'activeSidebarTab',
 			'currentCollectiveCanEdit',
 			'currentCollectiveCanShare',
 			'currentPage',
-			'title',
+			'isPublic',
 			'showing',
+			'title',
 		]),
+
+		active: {
+			get() {
+				return this.activeSidebarTab
+			},
+			set(id) {
+				this.setActiveSidebarTab(id)
+			},
+		},
 	},
 
 	methods: {
-		...mapMutations(['hide']),
+		...mapMutations(['hide', 'setActiveSidebarTab']),
 
 		/**
 		 * Load the current version and close the sidebar

diff --git a/src/components/PageSidebar/SharingEntryLink.vue b/src/components/PageSidebar/SharingEntryLink.vue
@@ -8,7 +8,8 @@
 				<span class="sharing-entry__title" :title="title">
 					{{ title }}
 				</span>
-				<div ref="quickShareDropdownContainer"
+				<div v-if="share"
+					ref="quickShareDropdownContainer"
 					:class="{ 'active': showDropdown, 'share-select': true }">
 					<span :id="dropdownId"
 						class="trigger-text"
@@ -67,7 +68,7 @@
 					{{ t('collectives', 'Add another link') }}
 				</NcActionButton>
 
-				<NcActionButton @click.prevent="onDelete">
+				<NcActionButton class="unshare-button" @click.prevent="onDelete">
 					<template #icon>
 						<CloseIcon :size="20" />
 					</template>

diff --git a/src/store/collectives.js b/src/store/collectives.js
@@ -61,8 +61,8 @@ export default {
 
 		collectivePath(state, getters) {
 			return (collective) => {
-				if (getters.isPublic && collective.shareToken) {
-					return `/p/${collective.shareToken}/${encodeURIComponent(collective.name)}`
+				if (getters.isPublic) {
+					return `/p/${getters.shareTokenParam}/${encodeURIComponent(collective.name)}`
 				} else {
 					return `/${encodeURIComponent(collective.name)}`
 				}
@@ -119,14 +119,6 @@ export default {
 			return state.shares.filter(s => s.pageId === pageId)
 		},
 
-		collectiveShareUrl: (state, getters) => (collective) => {
-			if (collective.shareToken) {
-				return generateUrl(`/apps/collectives/p/${collective.shareToken}/${encodeURIComponent(collective.name)}`)
-			} else {
-				return null
-			}
-		},
-
 		isCollectiveAdmin: (state, getters) => (collective) => {
 			return collective.level >= memberLevels.LEVEL_ADMIN
 		},

diff --git a/src/store/store.js b/src/store/store.js
@@ -26,6 +26,7 @@ export default new Store({
 		showing: {},
 		loading: {},
 		printView: false,
+		activeSidebarTab: 'attachments',
 	},
 
 	getters: {
@@ -72,6 +73,8 @@ export default new Store({
 			}
 			return flags
 		},
+
+		activeSidebarTab: (state) => state.activeSidebarTab,
 	},
 
 	mutations: {
@@ -87,5 +90,6 @@ export default new Store({
 		setPrintView: (state) => { state.printView = true },
 		setTextEdit: (state) => { state.textMode = pageModes.MODE_EDIT },
 		setTextView: (state) => { state.textMode = pageModes.MODE_VIEW },
+		setActiveSidebarTab: (state, id) => { state.activeSidebarTab = id },
 	},
 })