fix(files): CustomElementRender $el replacement bug

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>

apps/files/src/components/CustomElementRender.vue

@@ -59,14 +59,11 @@ export default {
 	},
 	methods: {
 		async updateRootElement() {
-			const span = document.createElement('span') as HTMLSpanElement
-			this.$el.replaceWith(span)
-			this.$el = span
-
 			const element = await this.render(this.source, this.currentView)
 			if (element) {
-				this.$el.replaceWith(element)
-				this.$el = element
+				this.$el.replaceChildren(element)
+			} else {
+				this.$el.replaceChildren()
 			}
 		},
 	},

apps/files/src/components/FileEntry.vue

@@ -25,7 +25,7 @@
 		data-cy-files-list-row
 		:data-cy-files-list-row-fileid="fileid"
 		:data-cy-files-list-row-name="source.basename"
-		class="list__row"
+		class="files-list__row"
 		@contextmenu="onRightClick">
 		<!-- Failed indicator -->
 		<span v-if="source.attributes.failed" class="files-list__row--failed" />

apps/files/src/components/FilesListVirtual.vue

@@ -309,9 +309,12 @@ export default Vue.extend({
 			}
 		}
 
-		.files-list__row{
+		.files-list__row {
 			&:hover, &:focus, &:active, &--active {
 				background-color: var(--color-background-dark);
+				> * {
+					--color-border: var(--color-border-dark);
+				}
 				// Hover state of the row should also change the favorite markers background
 				.favorite-marker-icon svg path {
 					stroke: var(--color-background-dark);

apps/systemtags/src/actions/inlineSystemTagsAction.spec.ts

@@ -43,8 +43,26 @@ describe('Inline system tags action conditions tests', () => {
 		expect(action.displayName([file], view)).toBe('')
 		expect(action.iconSvgInline([], view)).toBe('')
 		expect(action.default).toBeUndefined()
-		expect(action.enabled).toBeUndefined()
+		expect(action.enabled).toBeDefined()
 		expect(action.order).toBe(0)
+		expect(action.enabled!([file], view)).toBe(false)
+	})
+
+	test('Enabled with valid system tags', () => {
+		const file = new File({
+			id: 1,
+			source: 'https://cloud.domain.com/remote.php/dav/files/admin/foobar.txt',
+			owner: 'admin',
+			mime: 'text/plain',
+			permissions: Permission.ALL,
+			attributes: {
+				'system-tags': {
+					'system-tag': 'Confidential',
+				},
+			},
+		})
+
+		expect(action.enabled!([file], view)).toBe(true)
 	})
 })
 

apps/systemtags/src/actions/inlineSystemTagsAction.ts

@@ -50,6 +50,24 @@ export const action = new FileAction({
 	id: 'system-tags',
 	displayName: () => '',
 	iconSvgInline: () => '',
+
+	enabled(nodes: Node[]) {
+		// Only show the action on single nodes
+		if (nodes.length !== 1) {
+			return false
+		}
+
+		const node = nodes[0]
+		const tags = getNodeSystemTags(node)
+
+		// Only show the action if the node has system tags
+		if (tags.length === 0) {
+			return false
+		}
+
+		return true
+	},
+
 	exec: async () => null,
 
 	async renderInline(node: Node) {