fix: Use video player only for embedded videos (#60)

[andrew-polk]

#60

---

This change is 

[bolt-new-by-stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[hatton]

Reviewable status: 0 of 8 files reviewed, 3 unresolved discussions (waiting on @andrew-polk)

---

src/transform.ts line 147 at r1 (raw file):

          // add any library imports
          if (!context.imports) context.imports = [];
          mod.imports?.forEach(imp => context.imports!.push(imp));

To avoid the Forbidden non-null assertion, you could do

 context.imports?.push(...mod.imports || []);

---

src/plugins/VideoTransformer.ts line 9 at r1 (raw file):

      type: "video",
      getStringFromBlock: async (context, block) => {
        const blockAsAny = block as any;

You can avoid any here, something like this:

        const video = (block as VideoBlockObjectResponse).video;

        if (video.type === "external") {

          context.imports = [`import ReactPlayer from "react-player";`];

          return `<ReactPlayer controls url="${video.external.url}" />`;
 else {

          error(`Docunotion cannot handle this video type: ${video.type}`);
           ...

---

src/plugins/VideoTransformer.ts line 11 at r1 (raw file):

        const blockAsAny = block as any;
        if (blockAsAny?.video?.external?.url) {
          context.imports = [`import ReactPlayer from "react-player";`];

Should this be something like

context.imports += `import ReactPlayer from "react-player";`

So that it doesn't collide with imports from other plugins?

[andrew-polk]

Reviewable status: 0 of 8 files reviewed, 3 unresolved discussions (waiting on @hatton)

---

src/transform.ts line 147 at r1 (raw file):

Previously, hatton (John Hatton) wrote…

To avoid the Forbidden non-null assertion, you could do

 context.imports?.push(...mod.imports || []);

Done. Thanks.

---

src/plugins/VideoTransformer.ts line 9 at r1 (raw file):

Previously, hatton (John Hatton) wrote…

You can avoid any here, something like this:

        const video = (block as VideoBlockObjectResponse).video;

        if (video.type === "external") {

          context.imports = [`import ReactPlayer from "react-player";`];

          return `<ReactPlayer controls url="${video.external.url}" />`;
 else {

          error(`Docunotion cannot handle this video type: ${video.type}`);
           ...

Done. Thanks.

---

src/plugins/VideoTransformer.ts line 11 at r1 (raw file):

Previously, hatton (John Hatton) wrote…

Should this be something like

context.imports += `import ReactPlayer from "react-player";`

So that it doesn't collide with imports from other plugins?

Yep!
Good catch.

[hatton]

Reviewable status: 0 of 8 files reviewed, 4 unresolved discussions (waiting on @andrew-polk)

---

src/plugins/pluginTypes.ts line 78 at r2 (raw file):

  counts: ICounts;

  // If the output is creating things like react elements, you can import their definitions here

Let's set the comment to emphasize that you should append to this

[andrew-polk]

Reviewable status: 0 of 8 files reviewed, 4 unresolved discussions (waiting on @hatton)

---

src/plugins/pluginTypes.ts line 78 at r2 (raw file):

Previously, hatton (John Hatton) wrote…

Let's set the comment to emphasize that you should append to this

Done.

[hatton]

Reviewed 5 of 8 files at r1, 2 of 2 files at r2, 1 of 1 files at r3, all commit messages.
Reviewable status: all files reviewed, 4 unresolved discussions (waiting on @andrew-polk)

[github-actions]

🎉 This PR is included in version 0.13.2-alpha.4 🎉

The release is available on:

• npm package (@alpha dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[github-actions]

🎉 This PR is included in version 0.14.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀