feat(files): add files_sharing indicator

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

apps/files/src/actions/deleteAction.ts

@@ -31,7 +31,7 @@ export const action = new FileAction({
 	id: 'delete',
 	displayName(nodes: Node[], view: View) {
 		return view.id === 'trashbin'
-			? t('files_trashbin', 'Delete permanently')
+			? t('files', 'Delete permanently')
 			: t('files', 'Delete')
 	},
 	iconSvgInline: () => TrashCanSvg,

apps/files/src/components/FileEntry.vue

@@ -109,16 +109,19 @@
 			<!-- Render actions -->
 			<CustomElementRender v-for="action in enabledRenderActions"
 				:key="action.id"
+				:class="'files-list__row-action-' + action.id"
 				:current-view="currentView"
 				:render="action.renderInline"
-				:source="source" />
+				:source="source"
+				class="files-list__row-action--inline" />
 
 			<!-- Menu actions -->
 			<NcActions v-if="visible"
 				ref="actionsMenu"
 				:boundaries-element="getBoundariesElement()"
 				:container="getBoundariesElement()"
 				:disabled="source._loading"
+				:force-name="true"
 				:force-menu="enabledInlineActions.length === 0 /* forceMenu only if no inline actions */"
 				:inline="enabledInlineActions.length"
 				:open.sync="openedMenu">

apps/files/src/components/FilesListVirtual.vue

@@ -461,6 +461,10 @@ export default Vue.extend({
 			}
 		}
 
+		.files-list__row-action--inline {
+			margin-right: 7px;
+		}
+
 		.files-list__row-mtime,
 		.files-list__row-size {
 			// Right align text

apps/files_sharing/lib/Listener/LoadAdditionalListener.php

@@ -44,7 +44,7 @@ public function handle(Event $event): void {
 
 		$shareManager = \OC::$server->get(IManager::class);
 		if ($shareManager->shareApiEnabled() && class_exists('\OCA\Files\App')) {
-			Util::addScript(Application::APP_ID, 'files_sharing', 'files');
+			Util::addInitScript(Application::APP_ID, 'init');
 		}
 	}
 }

apps/files_sharing/src/actions/sharingStatusAction.scss

@@ -0,0 +1,35 @@
+/**
+ * @copyright Copyright (c) 2023 John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @author John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @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/>.
+ *
+ */
+ // Only when rendered inline, when not enough space, this is put in the menu
+.action-items > .files-list__row-action-sharing-status {
+	// put icon at the end of the button
+	direction: rtl;
+	// align icons with textless inline actions
+    padding-right: 0 !important;
+}
+
+svg.sharing-status__avatar {
+	height: 32px !important;
+	width: 32px !important;
+	border-radius: 32px;
+	overflow: hidden;
+}

apps/files_sharing/src/actions/sharingStatusAction.ts

@@ -0,0 +1,106 @@
+/**
+ * @copyright Copyright (c) 2023 John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @author John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @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/>.
+ *
+ */
+import { Node, View, registerFileAction, FileAction } from '@nextcloud/files'
+import { translate as t } from '@nextcloud/l10n'
+import { Type } from '@nextcloud/sharing'
+
+import AccountGroupSvg from '@mdi/svg/svg/account-group.svg?raw'
+import AccountPlusSvg from '@mdi/svg/svg/account-plus.svg?raw'
+import LinkSvg from '@mdi/svg/svg/link.svg?raw'
+import CircleSvg from '../../../../core/img/apps/circles.svg?raw'
+
+import { action as sidebarAction } from '../../../files/src/actions/sidebarAction'
+import { generateUrl } from '@nextcloud/router'
+import { getCurrentUser } from '@nextcloud/auth'
+
+import './sharingStatusAction.scss'
+
+const generateAvatarSvg = (userId: string) => {
+	const avatarUrl = generateUrl('/avatar/{userId}/32', { userId })
+	return `<svg width="32" height="32" viewBox="0 0 32 32"
+		xmlns="http://www.w3.org/2000/svg" class="sharing-status__avatar">
+		<image href="${avatarUrl}" height="32" width="32" />
+	</svg>`
+}
+
+export const action = new FileAction({
+	id: 'sharing-status',
+	displayName(nodes: Node[]) {
+		const node = nodes[0]
+		const shareTypes = Object.values(node?.attributes?.['share-types'] || {}).flat() as number[]
+		if (shareTypes.length > 0) {
+			return t('files_sharing', 'Shared')
+		}
+
+		const ownerId = node?.attributes?.['owner-id']
+		if (ownerId && ownerId !== getCurrentUser()?.uid) {
+			return t('files_sharing', 'Shared')
+		}
+
+		return ''
+	},
+	iconSvgInline(nodes: Node[]) {
+		const node = nodes[0]
+		const shareTypes = Object.values(node?.attributes?.['share-types'] || {}).flat() as number[]
+
+		// Link shares
+		if (shareTypes.includes(Type.SHARE_TYPE_LINK)
+			|| shareTypes.includes(Type.SHARE_TYPE_EMAIL)) {
+			return LinkSvg
+		}
+
+		// Group shares
+		if (shareTypes.includes(Type.SHARE_TYPE_GROUP)
+			|| shareTypes.includes(Type.SHARE_TYPE_REMOTE_GROUP)) {
+			return AccountGroupSvg
+		}
+
+		// Circle shares
+		if (shareTypes.includes(Type.SHARE_TYPE_CIRCLE)) {
+			return CircleSvg
+		}
+
+		const ownerId = node?.attributes?.['owner-id']
+		if (ownerId && ownerId !== getCurrentUser()?.uid) {
+			return generateAvatarSvg(ownerId)
+		}
+
+		return AccountPlusSvg
+	},
+
+	enabled(nodes: Node[]) {
+		if (nodes.length !== 1) {
+			return false
+		}
+		return true
+	},
+
+	async exec(node: Node, view: View, dir: string) {
+		window.OCA?.Files?.Sidebar?.setActiveTab?.('sharing')
+		return sidebarAction.exec(node, view, dir)
+	},
+
+	inline: () => true,
+
+})
+
+registerFileAction(action)

apps/files_sharing/src/files_sharing.ts → apps/files_sharing/src/init.ts

@@ -26,5 +26,6 @@ import './actions/acceptShareAction'
 import './actions/openInFilesAction'
 import './actions/rejectShareAction'
 import './actions/restoreShareAction'
+import './actions/sharingStatusAction'
 
 registerSharingViews()

webpack.modules.js

@@ -64,7 +64,7 @@ module.exports = {
 		additionalScripts: path.join(__dirname, 'apps/files_sharing/src', 'additionalScripts.js'),
 		collaboration: path.join(__dirname, 'apps/files_sharing/src', 'collaborationresourceshandler.js'),
 		files_sharing_tab: path.join(__dirname, 'apps/files_sharing/src', 'files_sharing_tab.js'),
-		files_sharing: path.join(__dirname, 'apps/files_sharing/src', 'files_sharing.ts'),
+		init: path.join(__dirname, 'apps/files_sharing/src', 'init.ts'),
 		main: path.join(__dirname, 'apps/files_sharing/src', 'main.ts'),
 		'personal-settings': path.join(__dirname, 'apps/files_sharing/src', 'personal-settings.js'),
 	},