Revert "Copy to clipboard with button instead of link"

This reverts commit 4ffc022c8b.

Signed-off-by: Christopher Ng <chrng8@gmail.com>

apps/files_sharing/src/components/SharingEntryInternal.vue

@@ -9,14 +9,13 @@
 				<div class="avatar-external icon-external-white" />
 			</template>
 
-			<NcActionButton :aria-label="t('files_sharing', 'Copy internal link to clipboard')"
+			<NcActionLink :href="internalLink"
+				:aria-label="t('files_sharing', 'Copy internal link to clipboard')"
+				target="_blank"
+				:icon="copied && copySuccess ? 'icon-checkmark-color' : 'icon-clippy'"
 				@click.prevent="copyLink">
-				<template #icon>
-					<Check v-if="copied && copySuccess" :size="20" />
-					<ClipboardTextMultipleOutline v-else :size="20" />
-				</template>
 				{{ clipboardTooltip }}
-			</NcActionButton>
+			</NcActionLink>
 		</SharingEntrySimple>
 	</ul>
 </template>
@@ -24,19 +23,14 @@
 <script>
 import { generateUrl } from '@nextcloud/router'
 import { showSuccess } from '@nextcloud/dialogs'
-import { NcActionButton } from '@nextcloud/vue'
+import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink'
 import SharingEntrySimple from './SharingEntrySimple'
 
-import Check from 'vue-material-design-icons/Check.vue'
-import ClipboardTextMultipleOutline from 'vue-material-design-icons/ClipboardTextMultipleOutline.vue'
-
 export default {
 	name: 'SharingEntryInternal',
 
 	components: {
-		Check,
-		ClipboardTextMultipleOutline,
-		NcActionButton,
+		NcActionLink,
 		SharingEntrySimple,
 	},
 

apps/files_sharing/src/components/SharingEntryLink.vue

@@ -38,14 +38,13 @@
 		<NcActions v-if="share && !isEmailShareType && share.token"
 			ref="copyButton"
 			class="sharing-entry__copy">
-			<NcActionButton :aria-label="t('files_sharing', 'Copy public link to clipboard')"
+			<NcActionLink :href="shareLink"
+				target="_blank"
+				:aria-label="t('files_sharing', 'Copy public link to clipboard')"
+				:icon="copied && copySuccess ? 'icon-checkmark-color' : 'icon-clippy'"
 				@click.stop.prevent="copyLink">
-				<template #icon>
-					<Check v-if="copied && copySuccess" :size="20" />
-					<ClipboardTextMultipleOutline v-else :size="20" />
-				</template>
 				{{ clipboardTooltip }}
-			</NcActionButton>
+			</NcActionLink>
 		</NcActions>
 
 		<!-- pending actions -->
@@ -304,18 +303,16 @@ import { showError, showSuccess } from '@nextcloud/dialogs'
 import { Type as ShareTypes } from '@nextcloud/sharing'
 import Vue from 'vue'
 
-import {
-	NcActionButton,
-	NcActionCheckbox,
-	NcActionInput,
-	NcActionLink,
-	NcActions,
-	NcActionSeparator,
-	NcActionText,
-	NcActionTextEditable,
-	NcAvatar,
-	Tooltip,
-} from '@nextcloud/vue'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import NcActionCheckbox from '@nextcloud/vue/dist/Components/NcActionCheckbox'
+import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
+import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink'
+import NcActionText from '@nextcloud/vue/dist/Components/NcActionText'
+import NcActionSeparator from '@nextcloud/vue/dist/Components/NcActionSeparator'
+import NcActionTextEditable from '@nextcloud/vue/dist/Components/NcActionTextEditable'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions'
+import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
+import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
 
 import ExternalShareAction from './ExternalShareAction.vue'
 import SharePermissionsEditor from './SharePermissionsEditor.vue'
@@ -323,25 +320,20 @@ import GeneratePassword from '../utils/GeneratePassword.js'
 import Share from '../models/Share.js'
 import SharesMixin from '../mixins/SharesMixin.js'
 
-import Check from 'vue-material-design-icons/Check.vue'
-import ClipboardTextMultipleOutline from 'vue-material-design-icons/ClipboardTextMultipleOutline.vue'
-
 export default {
 	name: 'SharingEntryLink',
 
 	components: {
-		Check,
-		ClipboardTextMultipleOutline,
-		ExternalShareAction,
+		NcActions,
 		NcActionButton,
 		NcActionCheckbox,
 		NcActionInput,
 		NcActionLink,
-		NcActions,
-		NcActionSeparator,
 		NcActionText,
 		NcActionTextEditable,
+		NcActionSeparator,
 		NcAvatar,
+		ExternalShareAction,
 		SharePermissionsEditor,
 	},
 

tests/acceptance/features/bootstrap/FilesAppSharingContext.php

@@ -206,7 +206,7 @@ class FilesAppSharingContext implements Context, ActorAwareInterface {
 	 * @return Locator
 	 */
 	public static function copyLinkButton() {
-		return Locator::forThe()->css("button.sharing-entry__copy")->
+		return Locator::forThe()->css("a.sharing-entry__copy")->
 				descendantOf(self::shareLinkRow())->
 				describedAs("Copy link button in the details view in Files app");
 	}
@@ -391,7 +391,7 @@ class FilesAppSharingContext implements Context, ActorAwareInterface {
 		// Clicking on the menu item copies the link to the clipboard, but it is
 		// not possible to access that value from the acceptance tests. Due to
 		// this the value of the attribute that holds the URL is used instead.
-		$this->actor->getSharedNotebook()["shared link"] = $this->actor->getSession()->evaluateScript("return document.querySelector('.sharing-entry__link').__vue__.shareLink;");
+		$this->actor->getSharedNotebook()["shared link"] = $this->actor->find(self::copyLinkButton(), 2)->getWrappedElement()->getAttribute("href");
 	}
 
 	/**