FIX: allows youtube embeds to respect the `t` param (#21295)

plugins/discourse-lazy-videos/assets/javascripts/discourse/components/lazy-iframe.js

@@ -4,7 +4,11 @@ export default class LazyVideo extends Component {
   get iframeSrc() {
     switch (this.args.providerName) {
       case "youtube":
-        return `https://www.youtube.com/embed/${this.args.videoId}?autoplay=1`;
+        let url = `https://www.youtube.com/embed/${this.args.videoId}?autoplay=1`;
+        if (this.args.startTime > 0) {
+          url += `&start=${this.args.startTime}`;
+        }
+        return url;
       case "vimeo":
         return `https://player.vimeo.com/video/${this.args.videoId}${
           this.args.videoId.includes("?") ? "&" : "?"

plugins/discourse-lazy-videos/assets/javascripts/discourse/components/lazy-video.hbs

@@ -6,6 +6,7 @@
   }}
   data-video-id={{@videoAttributes.id}}
   data-video-title={{@videoAttributes.title}}
+  data-video-start-time={{@videoAttributes.startTime}}
   data-provider-name={{@videoAttributes.providerName}}
 >
   {{#if this.isLoaded}}
@@ -13,6 +14,7 @@
       @providerName={{@videoAttributes.providerName}}
       @title={{@videoAttributes.title}}
       @videoId={{@videoAttributes.id}}
+      @startTime={{@videoAttributes.startTime}}
     />
   {{else}}
     <div

plugins/discourse-lazy-videos/assets/javascripts/lib/lazy-video-attributes.js

@@ -8,8 +8,9 @@ export default function getVideoAttributes(cooked) {
   const thumbnail = img?.getAttribute("src");
   const dominantColor = img?.dataset?.dominantColor;
   const title = cooked.dataset.videoTitle;
+  const startTime = cooked.dataset.videoStartTime || 0;
   const providerName = cooked.dataset.providerName;
   const id = cooked.dataset.videoId;
 
-  return { url, thumbnail, title, providerName, id, dominantColor };
+  return { url, thumbnail, title, providerName, id, dominantColor, startTime };
 }

plugins/discourse-lazy-videos/lib/lazy-videos/lazy_youtube.rb

@@ -21,11 +21,13 @@ class Onebox::Engine::YoutubeOnebox
       end
 
       escaped_title = ERB::Util.html_escape(video_title)
+      escaped_start_time = ERB::Util.html_escape(params["t"] || 0)
 
       <<~HTML
         <div class="youtube-onebox lazy-video-container"
           data-video-id="#{video_id}"
           data-video-title="#{escaped_title}"
+          data-video-start-time="#{escaped_start_time}"
           data-provider-name="youtube">
           <a href="https://www.youtube.com/watch?v=#{video_id}" target="_blank">
             <img class="youtube-thumbnail"

plugins/discourse-lazy-videos/test/javascripts/components/lazy-video-test.js

@@ -13,6 +13,7 @@ module("Discourse Lazy Videos | Component | lazy-video", function (hooks) {
     providerName: "youtube",
     id: "kPRA0W1kECg",
     dominantColor: "00ffff",
+    startTime: 234,
   };
 
   test("displays the correct video title", async function (assert) {
@@ -21,6 +22,12 @@ module("Discourse Lazy Videos | Component | lazy-video", function (hooks) {
     assert.dom(".title-link").hasText(this.attributes.title);
   });
 
+  test("uses the correct video start time", async function (assert) {
+    await render(hbs`<LazyVideo @videoAttributes={{this.attributes}} />`);
+
+    assert.dom(".youtube-onebox").hasAttribute("data-video-start-time", "234");
+  });
+
   test("displays the correct provider icon", async function (assert) {
     await render(hbs`<LazyVideo @videoAttributes={{this.attributes}} />`);