feat: update bunny video support in HC (#13815)

Bunny Video has added a new URL player.mediadelivery.net, this PR adds
support for the new URL

app/javascript/dashboard/components-next/HelpCenter/EmptyState/Portal/PortalEmptyState.vue

@@ -26,6 +26,7 @@ const onPortalCreate = ({ slug: portalSlug, locale }) => {
   <EmptyStateLayout
     :title="$t('HELP_CENTER.TITLE')"
     :subtitle="$t('HELP_CENTER.NEW_PAGE.DESCRIPTION')"
+    class="bg-n-surface-1"
   >
     <template #empty-state-item>
       <div class="grid grid-cols-2 gap-4 p-px">

config/markdown_embeds.yml

@@ -104,11 +104,11 @@ wistia:
     </div>
 
 bunny:
-  regex: 'https?://iframe\.mediadelivery\.net/play/(?<library_id>\d+)/(?<video_id>[^&/?]+)'
+  regex: 'https?://(?:iframe|player)\.mediadelivery\.net/(?:play|embed)/(?<library_id>\d+)/(?<video_id>[^&/?]+)'
   template: |
     <div style="position: relative; padding-top: 56.25%;">
       <iframe
-        src="https://iframe.mediadelivery.net/embed/%{library_id}/%{video_id}?autoplay=false&loop=false&muted=false&preload=true&responsive=true"
+        src="https://player.mediadelivery.net/embed/%{library_id}/%{video_id}?autoplay=false&loop=false&muted=false&preload=true&responsive=true"
         title="Bunny video player"
         loading="lazy"
         style="border: 0; position: absolute; top: 0; height: 100%; width: 100%;"

spec/config/markdown_embeds_spec.rb

@@ -63,7 +63,11 @@ describe 'Markdown Embeds Configuration' do
         'bunny' => [
           { url: 'https://iframe.mediadelivery.net/play/431789/1f105841-cad9-46fe-a70e-b7623c60797c',
             expected: { 'library_id' => '431789', 'video_id' => '1f105841-cad9-46fe-a70e-b7623c60797c' } },
-          { url: 'https://iframe.mediadelivery.net/play/12345/abcdef-ghijkl', expected: { 'library_id' => '12345', 'video_id' => 'abcdef-ghijkl' } }
+          { url: 'https://iframe.mediadelivery.net/play/12345/abcdef-ghijkl', expected: { 'library_id' => '12345', 'video_id' => 'abcdef-ghijkl' } },
+          { url: 'https://player.mediadelivery.net/play/431789/1f105841-cad9-46fe-a70e-b7623c60797c',
+            expected: { 'library_id' => '431789', 'video_id' => '1f105841-cad9-46fe-a70e-b7623c60797c' } },
+          { url: 'https://iframe.mediadelivery.net/embed/256380/d9d9ab1f-fc9f-4488-9c26-4ffc653c0024',
+            expected: { 'library_id' => '256380', 'video_id' => 'd9d9ab1f-fc9f-4488-9c26-4ffc653c0024' } }
         ],
         'codepen' => [
           { url: 'https://codepen.io/username/pen/abcdef', expected: { 'user' => 'username', 'pen_id' => 'abcdef' } },

spec/lib/custom_markdown_renderer_spec.rb

@@ -184,12 +184,12 @@ describe CustomMarkdownRenderer do
       end
     end
 
-    context 'when link is a Bunny.net URL' do
+    context 'when link is a Bunny.net iframe URL' do
       let(:bunny_url) { 'https://iframe.mediadelivery.net/play/431789/1f105841-cad9-46fe-a70e-b7623c60797c' }
 
       it 'renders an iframe with Bunny embed code' do
         output = render_markdown_link(bunny_url)
-        expect(output).to include('src="https://iframe.mediadelivery.net/embed/431789/1f105841-cad9-46fe-a70e-b7623c60797c?autoplay=false&loop=false&muted=false&preload=true&responsive=true"')
+        expect(output).to include('src="https://player.mediadelivery.net/embed/431789/1f105841-cad9-46fe-a70e-b7623c60797c?autoplay=false&loop=false&muted=false&preload=true&responsive=true"')
         expect(output).to include('allowfullscreen')
         expect(output).to include('allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;"')
       end
@@ -200,5 +200,17 @@ describe CustomMarkdownRenderer do
         expect(output).to include('position: absolute; top: 0; height: 100%; width: 100%;')
       end
     end
+
+    context 'when link is a Bunny.net player URL' do
+      let(:bunny_url) { 'https://player.mediadelivery.net/play/431789/1f105841-cad9-46fe-a70e-b7623c60797c' }
+
+      it 'renders an iframe with Bunny embed code' do
+        output = render_markdown_link(bunny_url)
+        expect(output).to include('embed/431789/1f105841-cad9-46fe-a70e-b7623c60797c')
+        expect(output).to include('autoplay=false&loop=false&muted=false&preload=true&responsive=true')
+        expect(output).to include('allowfullscreen')
+        expect(output).to include('allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;"')
+      end
+    end
   end
 end