Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Block Library: Remove store subscriptions from Audio and Video blocks #57449

Merged
merged 2 commits into from
Jan 3, 2024
Merged

Block Library: Remove store subscriptions from Audio and Video blocks #57449

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
79b26a4
Block Library: Remove store subscriptions from Audio and Video blocks
Mamaduka Dec 29, 2023
5172ab7
Fix typos
Mamaduka Jan 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
27 changes: 7 additions & 20 deletions packages/block-library/src/audio/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,32 +42,19 @@ function AudioEdit( {
className,
setAttributes,
onReplace,
isSelected,
isSelected: isSingleSelected,
insertBlocksAfter,
} ) {
const { id, autoplay, loop, preload, src } = attributes;
const isTemporaryAudio = ! id && isBlobURL( src );
const { mediaUpload, multiAudioSelection } = useSelect( ( select ) => {
const { getSettings, getMultiSelectedBlockClientIds, getBlockName } =
select( blockEditorStore );
const multiSelectedClientIds = getMultiSelectedBlockClientIds();

return {
mediaUpload: getSettings().mediaUpload,
multiAudioSelection:
multiSelectedClientIds.length &&
multiSelectedClientIds.every(
( _clientId ) => getBlockName( _clientId ) === 'core/audio'
),
};
}, [] );
const { getSettings } = useSelect( blockEditorStore );

useEffect( () => {
if ( ! id && isBlobURL( src ) ) {
const file = getBlobByURL( src );

if ( file ) {
mediaUpload( {
getSettings().mediaUpload( {
filesList: [ file ],
onFileChange: ( [ media ] ) => onSelectAudio( media ),
onError: ( e ) => onUploadError( e ),
Expand Down Expand Up @@ -156,7 +143,7 @@ function AudioEdit( {

return (
<>
{ ! multiAudioSelection && (
{ isSingleSelected && (
<BlockControls group="other">
<MediaReplaceFlow
mediaId={ id }
Expand Down Expand Up @@ -212,17 +199,17 @@ function AudioEdit( {
so the user clicking on it won't play the
file or change the position slider when the controls are enabled.
*/ }
<Disabled isDisabled={ ! isSelected }>
<Disabled isDisabled={ ! isSingleSelected }>
<audio controls="controls" src={ src } />
</Disabled>
{ isTemporaryAudio && <Spinner /> }
<Caption
attributes={ attributes }
setAttributes={ setAttributes }
isSelected={ isSelected }
isSelected={ isSingleSelected }
insertBlocksAfter={ insertBlocksAfter }
label={ __( 'Audio caption text' ) }
showToolbarButton={ ! multiAudioSelection }
showToolbarButton={ isSingleSelected }
/>
</figure>
</>
Expand Down
27 changes: 7 additions & 20 deletions packages/block-library/src/video/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ const ALLOWED_MEDIA_TYPES = [ 'video' ];
const VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ];

function VideoEdit( {
isSelected,
isSelected: isSingleSelected,
attributes,
className,
setAttributes,
Expand All @@ -75,26 +75,13 @@ function VideoEdit( {
const posterImageButton = useRef();
const { id, controls, poster, src, tracks } = attributes;
const isTemporaryVideo = ! id && isBlobURL( src );
const { mediaUpload, multiVideoSelection } = useSelect( ( select ) => {
const { getSettings, getMultiSelectedBlockClientIds, getBlockName } =
select( blockEditorStore );
const multiSelectedClientIds = getMultiSelectedBlockClientIds();

return {
mediaUpload: getSettings().mediaUpload,
multiVideoSelection:
multiSelectedClientIds.length &&
multiSelectedClientIds.every(
( _clientId ) => getBlockName( _clientId ) === 'core/video'
),
};
}, [] );
const { getSettings } = useSelect( blockEditorStore );

useEffect( () => {
if ( ! id && isBlobURL( src ) ) {
const file = getBlobByURL( src );
if ( file ) {
mediaUpload( {
getSettings().mediaUpload( {
filesList: [ file ],
onFileChange: ( [ media ] ) => onSelectVideo( media ),
onError: onUploadError,
Expand Down Expand Up @@ -195,7 +182,7 @@ function VideoEdit( {

return (
<>
{ ! multiVideoSelection && (
{ isSingleSelected && (
<>
<BlockControls>
<TracksEditor
Expand Down Expand Up @@ -281,7 +268,7 @@ function VideoEdit( {
so the user clicking on it won't play the
video when the controls are enabled.
*/ }
<Disabled isDisabled={ ! isSelected }>
<Disabled isDisabled={ ! isSingleSelected }>
<video
controls={ controls }
poster={ poster }
Expand All @@ -295,10 +282,10 @@ function VideoEdit( {
<Caption
attributes={ attributes }
setAttributes={ setAttributes }
isSelected={ isSelected }
isSelected={ isSingleSelected }
insertBlocksAfter={ insertBlocksAfter }
label={ __( 'Video caption text' ) }
showToolbarButton={ ! multiVideoSelection }
showToolbarButton={ isSingleSelected }
/>
</figure>
</>
Expand Down