feat(cms): add network page video upload

tests/int/netzwerk-video.int.spec.tsx

@@ -0,0 +1,120 @@
+import { cleanup, fireEvent, render, screen } from '@testing-library/react'
+import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest'
+
+import { CmsRouteProvider, type CmsRouteData, type CmsRouteDoc } from '@/spa/cmsRoute'
+import { netzwerkContent } from '@/spa/netzwerkContent'
+import Netzwerk from '@/spa/pages/Netzwerk'
+
+vi.mock('next/navigation', () => ({
+  usePathname: () => '/netzwerk',
+  useRouter: () => ({ push: vi.fn(), replace: vi.fn() }),
+}))
+
+const homePage = (videoUrl: string): CmsRouteDoc => ({
+  id: `home-${videoUrl}`,
+  slug: 'startseite',
+  spaPath: '/',
+  home: {
+    hero: { videoLabel: 'Homepage film' },
+    videoModal: {
+      video: { url: videoUrl },
+      title: 'Homepage video',
+      closeLabel: 'Homepage video close',
+    },
+  },
+})
+
+const networkRoute = (video?: { url: string; label: string; title: string }): CmsRouteData => ({
+  collection: 'pages',
+  doc: {
+    id: 'network-page',
+    slug: 'netzwerk',
+    spaPath: '/netzwerk',
+    netzwerk: {
+      patronage: {
+        ...(video
+          ? {
+              greetingVideo: { url: video.url },
+              greetingVideoButtonLabel: video.label,
+              greetingVideoTitle: video.title,
+              greetingVideoDescription: `${video.title} description`,
+              greetingVideoCloseLabel: `${video.title} close`,
+            }
+          : {}),
+      },
+    },
+  },
+  lists: {
+    pages: [homePage('/api/media/file/homepage.mp4')],
+    partners: [],
+    'jury-mitglieder': [],
+  },
+})
+
+describe('Netzwerk greeting video', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'matchMedia', {
+      configurable: true,
+      value: vi.fn().mockImplementation((query: string) => ({
+        addEventListener: vi.fn(),
+        matches: false,
+        media: query,
+        removeEventListener: vi.fn(),
+      })),
+    })
+    vi.spyOn(HTMLMediaElement.prototype, 'play').mockResolvedValue(undefined)
+  })
+
+  afterEach(() => cleanup())
+
+  it('does not fall back to the homepage video when Netzwerk media is empty', () => {
+    render(
+      <CmsRouteProvider value={networkRoute()}>
+        <Netzwerk />
+      </CmsRouteProvider>,
+    )
+
+    expect(screen.queryByRole('button', { name: netzwerkContent.patronage.greetingVideoButtonLabel })).toBeNull()
+    expect(screen.queryByLabelText('Homepage video')).toBeNull()
+  })
+
+  it('resolves the page-owned Netzwerk media independently of homepage changes', () => {
+    const firstNetworkVideo = {
+      url: '/api/media/file/network-first.mp4',
+      label: 'Play Netzwerk greeting',
+      title: 'Netzwerk greeting one',
+    }
+    const secondNetworkVideo = {
+      url: '/api/media/file/network-second.mp4',
+      label: 'Play second Netzwerk greeting',
+      title: 'Netzwerk greeting two',
+    }
+    const { rerender } = render(
+      <CmsRouteProvider value={networkRoute(firstNetworkVideo)}>
+        <Netzwerk />
+      </CmsRouteProvider>,
+    )
+
+    fireEvent.click(screen.getByRole('button', { name: firstNetworkVideo.label }))
+    expect(screen.getByRole('dialog').querySelector('video')?.getAttribute('src')).toBe(firstNetworkVideo.url)
+
+    const homeChanged = networkRoute(firstNetworkVideo)
+    homeChanged.lists = {
+      ...homeChanged.lists,
+      pages: [homePage('/api/media/file/homepage-changed.mp4')],
+    }
+    rerender(
+      <CmsRouteProvider value={homeChanged}>
+        <Netzwerk />
+      </CmsRouteProvider>,
+    )
+    expect(screen.getByRole('dialog').querySelector('video')?.getAttribute('src')).toBe(firstNetworkVideo.url)
+
+    rerender(
+      <CmsRouteProvider value={networkRoute(secondNetworkVideo)}>
+        <Netzwerk />
+      </CmsRouteProvider>,
+    )
+    expect(screen.getByRole('dialog').querySelector('video')?.getAttribute('src')).toBe(secondNetworkVideo.url)
+  })
+})

tests/int/payload-field-inventory.int.spec.ts

@@ -99,6 +99,11 @@ describe('Payload field inventory', () => {
         'pressIndex.events.statusLabels',
         'pressIndex.downloads.contactName',
         'netzwerk.jury.members',
+        'netzwerk.patronage.greetingVideo',
+        'netzwerk.patronage.greetingVideoButtonLabel',
+        'netzwerk.patronage.greetingVideoTitle',
+        'netzwerk.patronage.greetingVideoDescription',
+        'netzwerk.patronage.greetingVideoCloseLabel',
         'netzwerk.partners.tiers',
         'netzwerk.partners.modal.websiteLabel',
         'netzwerk.sponsoringForm.steps',
@@ -130,4 +135,19 @@ describe('Payload field inventory', () => {
       maxRows: 2,
     })
   })
+
+  it('limits the Netzwerk greeting upload to video media', () => {
+    const field = findField(netzwerkFields, 'netzwerk.patronage.greetingVideo')
+
+    expect(field).toMatchObject({
+      type: 'upload',
+      relationTo: 'media',
+      filterOptions: {
+        mimeType: {
+          contains: 'video',
+        },
+      },
+    })
+    expect(field).not.toHaveProperty('defaultValue')
+  })
 })