Video block new embed by jackahl · Pull Request #6359 · plone/volto

jackahl · 2024-10-01T09:06:23Z

Replacing the semantic ui embed component with a custom one, to allow for more flexibility especially in regards to accessibility. This does mainly address issues raised in #5731.

netlify · 2024-10-01T09:06:40Z

✅ Deploy Preview for plone-components canceled.

Name	Link
🔨 Latest commit	`ab00cfe`
🔍 Latest deploy log	https://app.netlify.com/sites/plone-components/deploys/67090c5f362aa40008609161

jackahl · 2024-10-01T15:28:31Z

@sneridagh should this new component be moved to the volto components package or shall it stay in there core package?

sneridagh · 2024-10-02T11:38:14Z

@jackahl LGTM, however, I'd put the component as general available component, in components folder (and, eventually, transfer it to @plone/components, but that's for later, if Volto has to use it right away).

stevepiercy

Grammar fixes.

Co-authored-by: Steve Piercy <web@stevepiercy.com>

iRohitSingh · 2025-04-07T11:11:48Z

@sneridagh What should be the behavior when someone pass the autoplay:true in video block. Video should start playing automatically when page loads right?

* main: (356 commits) Update or remove broken links (#6953) Only accept images in ImageInput component (#6926) Bump vite from 5.4.15 to 5.4.16 (#6932) Fetch vocabularies and querystring config in the current context (#6935) Remove the build from netlify for @plone/components Complete missing german translations and Storybook story for 'ContentsDeleteModal' (#6881) Remove duplicate configuration item `html_title` (#6933) Forwardport hand-cherrypicking the changes happened in Seven for `@plone/registry` relevant for be reintegrated in alpha (`main`). (#6929) Fixed regression on brown bag minor version of `@storybook/addon-webpack5-compiler-babel` (#6930) Amend PR #6885 changelog to be breaking s/Seven/Volto on `main` (#6925) Release @plone/registry 3.0.0-alpha.1 Release @plone/types 2.0.0-alpha.0 Remove news from packages that won't be released from main Fixed merge public folder from addons regression (#6919) Fixed handling of errors that are not coming from the backend (#6903) Move _hardware-requirements.md include from documentation to volto (#6918) Move includes from `plone/documentation` to `plone/volto` (#6917) Fix typo in Appextras documentation (#6083) Fix gray placeholder on horizontal scroll (#6877) ...

Co-authored-by: Steve Piercy <web@stevepiercy.com>

sneridagh · 2025-07-24T13:15:53Z

@iRohitSingh please make CI pass too, and solve conflicts.

davisagli · 2026-02-05T05:49:40Z

 #. Default: "Please enter a valid URL by deleting the block and adding a new video block."
 #: components/manage/Blocks/Video/Body
 msgid "Please enter a valid URL by deleting the block and adding a new video block."
-msgstr "Introduïu un URL vàlid suprimint el bloc i afegint un bloc de vídeo nou."


Make sure we don't remove existing translations. (here and in the other locales)

@iRohitSingh I meant for ALL of the locales. This is not the only one where this translation was removed.

davisagli · 2026-02-05T05:54:10Z

This should be .breaking since it's in the public UI and potentially breaks styles written for the old markup.

@sneridagh Can we include this for volto 19?

@davisagli yes, we can include it in 19!

@jackahl @iRohitSingh What is left to do in here? Could you please got through David's suggestions? Thanks!

davisagli · 2026-02-05T06:00:50Z

+  } = props;
+
+  const [isActive, setIsActive] = useState(false);
+  const PlayVideo = () => {


This should use useCallback so that a new function isn't created on every render.

@iRohitSingh The PlayVideo function is still created on every render.

iFlameing · 2026-02-17T08:23:21Z

@davisagli can you please review this pr. I think it is ready.

davisagli · 2026-02-17T18:25:35Z

@iFlameing See above, I already made some new comments after @iRohitSingh's latest changes.

Here is what still needs to be fixed:

don't remove existing translations (for all locales)
changelog should be .breaking
the PlayVideo function should use useCallback so it is not created on every render

iFlameing

LGTM!

iFlameing · 2026-02-18T14:17:04Z

@davisagli I did the review of code and now.

don't remove existing translations (for all locales)(I checked and now we are only adding.)
changelog should be .breaking (done)
the PlayVideo function should use useCallback so it is not created on every render (it is also wrapped in callback).

cc @sneridagh

sneridagh

Overall, LGTM!!

@plone/volto-team can we get more eyes on this one?

sneridagh · 2026-02-18T15:54:27Z

+
+[Peertube](https://joinpeertube.org/) is a free and open source, decentralized, ActivityPub federated video platform.
+
+To configure the video block to use other instances of Peertube, add them to the `allowedPeertubeInstances` array in your project configuration object, as shown in the following example.


Not clear why people need to do that. Do we whitelist them in the code?

PeerTube is federated and not centralized, like Mastodon. Plone has its own Mastodon instance of plone.social, as an example.

This is the whitelist.

davisagli

LGTM

Co-authored-by: Steve Piercy <web@stevepiercy.com> Co-authored-by: iRohitSingh <isinghrohit0@gmail.com> Co-authored-by: Victor Fernandez de Alba <sneridagh@gmail.com> Co-authored-by: Ion Lizarazu <ilizarazu@codesyntax.com>

* main: Release 19.0.0-alpha.26 Release @plone/slate 19.0.0-alpha.11 Backport @plone/components 4a6 (#7927) Use `getSlateEditorAndType` in `03-block-slate.js` to make the test more robust (#7924) Video block new embed (#6359) Add changelog check for volto-razzle (#7919) Add Vitest test for .well-known handling in production build (#7868) Make Slate tables responsive horizontally (#7916) fix: show only error message in toast instead of stringified JSON (#7692) Add missing i18n and fix duplicate id in Facet widget (#7909) Docs: Minor grammar and Clarity improvements in critical.css section (#7902)

Co-authored-by: Steve Piercy <web@stevepiercy.com> Co-authored-by: iRohitSingh <isinghrohit0@gmail.com> Co-authored-by: Victor Fernandez de Alba <sneridagh@gmail.com> Co-authored-by: Ion Lizarazu <ilizarazu@codesyntax.com>

jackahl added 6 commits September 27, 2024 09:16

WIP#1 on new Video Embed component

1f0ef62

add play icon to video embed component

5c0024c

add initial styling to video embed component

adb0069

improve styling for video play icon

8f350db

enable new videoembed for Vimeo as well

c6afc6a

add title field to video block for a11y

c1f69e2

jackahl requested a review from sneridagh October 1, 2024 09:06

jackahl added 4 commits October 1, 2024 15:24

update snapshots

adb45ad

update snapshots

38e79ff

Merge branch 'main' into video-block-new-embed

1eb2a39

update snapshots

e99f4b5

jackahl added 2 commits October 1, 2024 17:33

add css class to video placeholder image

109528a

update snapshots

8616739

jackahl added 4 commits October 7, 2024 16:12

move video embed component to components directory

d813ca2

add changelog entry

7942481

fix link in vite-js readme

01d412f

fix link in vite-ssr readme

7151f07

jackahl marked this pull request as ready for review October 8, 2024 07:22

Merge branch 'main' into video-block-new-embed

cd8fa0a

stevepiercy requested changes Oct 9, 2024

View reviewed changes

Comment thread packages/volto/news/6359.feature Outdated

Comment thread packages/volto/locales/volto.pot Outdated

jackahl and others added 2 commits October 11, 2024 13:30

typo and grammar fixes

ab00cfe

Co-authored-by: Steve Piercy <web@stevepiercy.com>

Fix Trigger video autoplay when the play button is clicked

2e425eb

sneridagh and others added 2 commits April 8, 2025 10:27

Update packages/volto/locales/volto.pot

098770a

Co-authored-by: Steve Piercy <web@stevepiercy.com>

Merge branch 'main' into video-block-new-embed

7a1a1b1

iRohitSingh added 2 commits December 18, 2025 18:14

Fix ci

21021c4

Merge branch 'main' into video-block-new-embed

020ed9b

davisagli requested changes Feb 5, 2026

View reviewed changes

davisagli reviewed Feb 5, 2026

View reviewed changes

Comment thread packages/volto/src/components/manage/Blocks/Video/Body.jsx Outdated

davisagli mentioned this pull request Feb 5, 2026

Fixed A11y Video Block Issue #5732

Closed

stevepiercy requested changes Feb 9, 2026

View reviewed changes

Comment thread docs/source/blocks/settings.md Outdated

Comment thread docs/source/blocks/settings.md Outdated

Comment thread packages/volto/news/6870.feature Outdated

Comment thread packages/volto/news/6359.feature Outdated

Comment thread packages/volto/locales/volto.pot Outdated

iRohitSingh added 5 commits February 10, 2026 19:17

update i18n,use useCallback and improve code

968f89c

Update i18n

a48b17f

Merge branch 'main' into video-block-new-embed

81e6412

Fix cypress test and Update video block snapshots

84a6463

Merge branch 'main' into video-block-new-embed

20979f9

iRohitSingh requested a review from davisagli February 11, 2026 13:44

sneridagh mentioned this pull request Feb 18, 2026

main: allow other sources in Video block #7318

Closed

iRohitSingh added 3 commits February 18, 2026 18:40

improve code

ef772fe

Merge branch 'main' into video-block-new-embed

11e1fde

Add german translation

2404d22

iFlameing approved these changes Feb 18, 2026

View reviewed changes

iFlameing changed the title ~~WIP: Video block new embed~~ Video block new embed Feb 18, 2026

iFlameing added the 24 status: ready label Feb 18, 2026

sneridagh approved these changes Feb 18, 2026

View reviewed changes

davisagli approved these changes Feb 19, 2026

View reviewed changes

sneridagh merged commit a8440a2 into main Feb 19, 2026
76 of 77 checks passed

sneridagh deleted the video-block-new-embed branch February 19, 2026 07:50

github-project-automation Bot moved this from Review in progress to Done in Accessibility Feb 19, 2026


		[Peertube](https://joinpeertube.org/) is a free and open source, decentralized, ActivityPub federated video platform.

		To configure the video block to use other instances of Peertube, add them to the `allowedPeertubeInstances` array in your project configuration object, as shown in the following example.

Uh oh!

Conversation

jackahl commented Oct 1, 2024

Uh oh!

netlify Bot commented Oct 1, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for plone-components canceled.

Uh oh!

jackahl commented Oct 1, 2024

Uh oh!

sneridagh commented Oct 2, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

stevepiercy left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

iRohitSingh commented Apr 7, 2025

Uh oh!

sneridagh commented Jul 24, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

iFlameing commented Feb 17, 2026

Uh oh!

davisagli commented Feb 17, 2026

Uh oh!

iFlameing left a comment

Choose a reason for hiding this comment

Uh oh!

iFlameing commented Feb 18, 2026

Uh oh!

sneridagh left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

davisagli left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

netlify Bot commented Oct 1, 2024 •

edited

Loading

sneridagh commented Oct 2, 2024 •

edited

Loading