App mode - Unify menus - 2 (#9023)

## Summary

Updates subgraph breadcrumbs menu, workflow tabs context menu & linear
mode menu to use a single implementation.
Adds new menu items for enter/exit app mode  
Hides menu when in builder mode

## Changes

- **What**: Changes the components to use either a reka-ui context menu
or dropdown, with a standard inner list
- **Breaking**: Remove existing linear toggle from sidebar as it is now
in the menu


## Screenshots (if applicable)
It looks basically identical other than the icon changes based on mode:

In Graph Mode:
<img width="261" height="497" alt="image"
src="https://github.com/user-attachments/assets/eb9968a2-b528-4e21-9e14-ab4a67e717ae"
/>

In App Mode:
<img width="254" height="499" alt="image"
src="https://github.com/user-attachments/assets/54a89fab-e7b2-4cb0-bcb7-43d6d076ac83"
/>

Right click tab:
<img width="321" height="564" alt="image"
src="https://github.com/user-attachments/assets/c12c7d64-2dba-45bb-be76-2615f3e38cc6"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-9023-App-mode-Unify-menus-2-30d6d73d36508162bfc0e308d5f705de)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>

src/components/common/WorkflowActionsList.test.ts

@@ -0,0 +1,81 @@
+import { shallowMount } from '@vue/test-utils'
+import { describe, expect, it, vi } from 'vitest'
+
+import WorkflowActionsList from '@/components/common/WorkflowActionsList.vue'
+import type {
+  WorkflowMenuAction,
+  WorkflowMenuItem
+} from '@/types/workflowMenuItem'
+
+function createWrapper(items: WorkflowMenuItem[]) {
+  return shallowMount(WorkflowActionsList, {
+    props: { items },
+    global: { renderStubDefaultSlot: true }
+  })
+}
+
+describe('WorkflowActionsList', () => {
+  it('renders action items with label and icon', () => {
+    const items: WorkflowMenuItem[] = [
+      { label: 'Save', icon: 'pi pi-save', command: vi.fn() }
+    ]
+
+    const wrapper = createWrapper(items)
+
+    expect(wrapper.text()).toContain('Save')
+    expect(wrapper.find('.pi-save').exists()).toBe(true)
+  })
+
+  it('renders separator items', () => {
+    const items: WorkflowMenuItem[] = [
+      { label: 'Before', icon: 'pi pi-a', command: vi.fn() },
+      { separator: true },
+      { label: 'After', icon: 'pi pi-b', command: vi.fn() }
+    ]
+
+    const wrapper = createWrapper(items)
+    const html = wrapper.html()
+
+    expect(html).toContain('dropdown-menu-separator-stub')
+    expect(wrapper.text()).toContain('Before')
+    expect(wrapper.text()).toContain('After')
+  })
+
+  it('dispatches command on select', async () => {
+    const command = vi.fn()
+    const items: WorkflowMenuItem[] = [
+      { label: 'Action', icon: 'pi pi-play', command }
+    ]
+
+    const wrapper = createWrapper(items)
+    const item = wrapper.findComponent({ name: 'DropdownMenuItem' })
+    await item.vm.$emit('select')
+
+    expect(command).toHaveBeenCalledOnce()
+  })
+
+  it('renders badge when present', () => {
+    const items: WorkflowMenuItem[] = [
+      {
+        label: 'New Feature',
+        icon: 'pi pi-star',
+        command: vi.fn(),
+        badge: 'NEW'
+      }
+    ]
+
+    const wrapper = createWrapper(items)
+
+    expect(wrapper.text()).toContain('NEW')
+  })
+
+  it('does not render badge when absent', () => {
+    const items: WorkflowMenuAction[] = [
+      { label: 'Plain', icon: 'pi pi-check', command: vi.fn() }
+    ]
+
+    const wrapper = createWrapper(items)
+
+    expect(wrapper.text()).not.toContain('NEW')
+  })
+})