fix: Split into two actions to display lock state and to toggle lock/unlock

Signed-off-by: Julius Knorr <[email protected]>

Author: juliusknorr

playwright/e2e/viewer.spec.ts

@@ -17,6 +17,31 @@ test('can manually lock a file', async ({ page, user }) => {
 	const lockIndicator = page.getByRole('button', { name: 'Manually locked by ' + user.userId })
 	await expect(lockIndicator).toBeVisible()
 	await page.getByRole('button', { name: 'Actions' }).click()
-	await page.getByRole('menuitem', { name: 'Manually locked by ' + user.userId }).click()
+	const lockInfo = page.getByRole('menuitem', { name: 'Manually locked by ' + user.userId })
+	await expect(lockInfo).toBeVisible()
+	await page.getByRole('menuitem', { name: 'Unlock' }).click()
 	await expect(lockIndicator).not.toBeVisible()
-})
+})
+
+test('it shows the lock menu entry in grid view', async ({ page, user }) => {
+	await page.getByRole('button', { name: 'Switch to grid view' }).click()
+	await page.getByRole('button', { name: 'Actions' }).click()
+	const lockButton = page.getByRole('menuitem', { name: 'Lock file' })
+	await expect(lockButton).toBeVisible()
+	await lockButton.click()
+	await expect(lockButton).not.toBeVisible()
+
+	await page.getByRole('button', { name: 'Actions' }).click()
+
+	const lockIndicator = page.getByRole('menuitem', { name: 'Manually locked by ' + user.userId })
+	await expect(lockIndicator).toBeVisible()
+
+	// Ensure that the inline lock indicator is not visible
+	const inlineLockIndicator = page.locator('.files-list__row-action-lock_inline')
+	await expect(inlineLockIndicator).not.toBeVisible()
+
+	const unlockButton = page.getByRole('menuitem', { name: 'Unlock' })
+	await expect(unlockButton).toBeVisible()
+	await unlockButton.click()
+	await expect(unlockButton).not.toBeVisible()
+})

src/main.ts

@@ -58,6 +58,28 @@ const switchLock = async (node: Node) => {
 	}
 }
 
+const getLockStateIcon = (node: Node) => {
+	const state = getLockStateFromAttributes(node)
+
+	if (!state.isLocked) {
+		return ''
+	}
+
+	if (state.lockOwnerType === LockType.Token) {
+		return LockMonitorSvg
+	}
+
+	if (state.lockOwnerType === LockType.App) {
+		return LockEditSvg
+	}
+
+	if (state.lockOwner !== getCurrentUser()?.uid) {
+		return LockAccountSvg
+	}
+
+	return LockSvg
+}
+
 const inlineAction = new FileAction({
 	id: 'lock_inline',
 	title: (nodes: Node[]) => nodes.length === 1 ? getInfoLabel(nodes[0]) : '',
@@ -68,44 +90,43 @@ const inlineAction = new FileAction({
 
 	iconSvgInline(nodes: Node[]) {
 		const node = nodes[0]
+		return getLockStateIcon(node)
+	},
 
-		const state = getLockStateFromAttributes(node)
-
-		if (!state.isLocked) {
-			return ''
-		}
-
-		if (state.lockOwnerType === LockType.Token) {
-			return LockMonitorSvg
-		}
-
-		if (state.lockOwnerType === LockType.App) {
-			return LockEditSvg
+	enabled(nodes: Node[]) {
+		// Only works on single node
+		if (nodes.length !== 1) {
+			return false
 		}
 
-		if (state.lockOwner !== getCurrentUser()?.uid) {
-			return LockAccountSvg
-		}
+		const node = nodes[0]
+		const state = getLockStateFromAttributes(node)
 
-		return LockSvg
+		return state.isLocked
 	},
+})
 
+const menuInfo = new FileAction({
+	id: 'lock_info',
+	order: 25,
+	displayName: (nodes: Node[]) => getInfoLabel(nodes[0]),
+	iconSvgInline: (nodes: Node[]) => {
+		const node = nodes[0]
+		return getLockStateIcon(node)
+	},
 	enabled(nodes: Node[]) {
 		// Only works on single node
 		if (nodes.length !== 1) {
 			return false
 		}
-
 		const node = nodes[0]
 		const state = getLockStateFromAttributes(node)
-
 		return state.isLocked
 	},
+	async exec() {},
 })
-
 const menuAction = new FileAction({
 	id: 'lock',
-	title: (nodes: Node[]) => getInfoLabel(nodes[0]),
 	order: 25,
 
 	iconSvgInline(nodes: Node[]) {
@@ -166,4 +187,5 @@ const menuAction = new FileAction({
 })
 
 registerFileAction(inlineAction)
+registerFileAction(menuInfo)
 registerFileAction(menuAction)