Skip to content

Commit

Permalink
Check if aspect ratio class exists before regenerating. Resets if the…
Browse files Browse the repository at this point in the history
… URL has changed.
  • Loading branch information
TylerB24890 committed Feb 24, 2023
1 parent 8164936 commit 7c09de3
Show file tree
Hide file tree
Showing 2 changed files with 31 additions and 1 deletion.
9 changes: 8 additions & 1 deletion packages/block-library/src/embed/edit.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
import {
createUpgradedEmbedBlock,
getClassNames,
removeAspectRatioClasses,
fallback,
getEmbedInfoByProvider,
getMergedAttributesWithPreview,
Expand Down Expand Up @@ -188,8 +189,14 @@ const EmbedEdit = ( props ) => {
event.preventDefault();
}

// If the embed URL was changed, we need to reset the aspect ratio class.
// To do this we have to remove the existing ratio class so it can be recalculated.
const blockClass = removeAspectRatioClasses(
attributes.className
);

setIsEditingURL( false );
setAttributes( { url } );
setAttributes( { url, className: blockClass } );
} }
value={ url }
cannotEmbed={ cannotEmbed }
Expand Down
23 changes: 23 additions & 0 deletions packages/block-library/src/embed/util.js
Original file line number Diff line number Diff line change
Expand Up @@ -152,6 +152,21 @@ export const createUpgradedEmbedBlock = (
} );
};

/**
* Determine if the block already has an aspect ratio class applied.
*
* @param {string} existingClassNames Existing block classes.
* @return {boolean} True or false if the classnames contain an aspect ratio class.
*/
export const hasAspectRatioClass = ( existingClassNames ) => {
if ( ! existingClassNames ) {
return false;
}
return ASPECT_RATIOS.some( ( { className } ) =>
existingClassNames.includes( className )
);
};

/**
* Removes all previously set aspect ratio related classes and return the rest
* existing class names.
Expand Down Expand Up @@ -311,6 +326,14 @@ export const getMergedAttributesWithPreview = (
ignorePreviousClassName = false
) => {
const { allowResponsive, className } = currentAttributes;

// Aspect ratio classes are removed when the embed URL is updated.
// If the embed already has an aspect ratio class, that means the URL has not changed.
// Which also means no need to regenerate it.
if ( hasAspectRatioClass( className ) ) {
return currentAttributes;
}

return {
...currentAttributes,
...getAttributesFromPreview(
Expand Down

0 comments on commit 7c09de3

Please sign in to comment.