diff --git a/apps/app/src/layouts/OrganizerLayoutV2.vue b/apps/app/src/layouts/OrganizerLayoutV2.vue
new file mode 100644
index 00000000..9f9970d3
--- /dev/null
+++ b/apps/app/src/layouts/OrganizerLayoutV2.vue
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/apps/app/src/layouts/components/AppShellV2.vue b/apps/app/src/layouts/components/AppShellV2.vue
new file mode 100644
index 00000000..628f8fb1
--- /dev/null
+++ b/apps/app/src/layouts/components/AppShellV2.vue
@@ -0,0 +1,44 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/apps/app/tests/component/layouts/AppShellV2.spec.ts b/apps/app/tests/component/layouts/AppShellV2.spec.ts
new file mode 100644
index 00000000..012db098
--- /dev/null
+++ b/apps/app/tests/component/layouts/AppShellV2.spec.ts
@@ -0,0 +1,34 @@
+import { describe, expect, it } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { createPinia } from 'pinia'
+import AppShellV2 from '@/layouts/components/AppShellV2.vue'
+
+describe('AppShellV2 (skeleton)', () => {
+ it('renders the grid regions and default slot content', () => {
+ const wrapper = mount(AppShellV2, {
+ global: { plugins: [createPinia()] },
+ slots: {
+ sidebar: '',
+ topbar: '',
+ default: 'CONTENT',
+ drawer: '',
+ },
+ })
+
+ expect(wrapper.find('[data-testid="appshell-v2"]').exists()).toBe(true)
+ expect(wrapper.find('[data-testid="sb"]').exists()).toBe(true)
+ expect(wrapper.find('[data-testid="tb"]').exists()).toBe(true)
+ expect(wrapper.find('[data-testid="content"]').text()).toBe('CONTENT')
+ expect(wrapper.find('[data-testid="dr"]').exists()).toBe(true)
+ })
+
+ it('applies the collapsed modifier from useShellUiStore', async () => {
+ const pinia = createPinia()
+ const wrapper = mount(AppShellV2, { global: { plugins: [pinia] } })
+ const { useShellUiStore } = await import('@/stores/useShellUiStore')
+
+ useShellUiStore().toggleSidebar()
+ await wrapper.vm.$nextTick()
+ expect(wrapper.find('[data-testid="appshell-v2"]').classes()).toContain('is-collapsed')
+ })
+})