Skip to content

Commit

Permalink
Introduce a separation of the block editor assets
Browse files Browse the repository at this point in the history
  • Loading branch information
@ingeniumed
ingeniumed committed Jul 2, 2024
1 parent 60426a3 commit 75690d7
Show file tree
Hide file tree
Showing 2 changed files with 127 additions and 120 deletions.
2 changes: 1 addition & 1 deletion dist/custom-status.build.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

245 changes: 126 additions & 119 deletions modules/custom-status/lib/custom-status-block.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,133 +8,140 @@ const { subscribe, dispatch, select, withSelect, withDispatch } = wp.data;
const { compose } = wp.compose;
const { SelectControl } = wp.components;

/**
* Map Custom Statuses as options for SelectControl
*/
const statuses = window.EditFlowCustomStatuses.map( s => ( { label: s.name, value: s.slug } ) );

/**
* Subscribe to changes so we can set a default status and update a button's text.
*/
let buttonTextObserver = null;
subscribe( function () {
const postId = select( 'core/editor' ).getCurrentPostId();
if ( ! postId ) {
// Post isn't ready yet so don't do anything.
return;
}
let is_vip_feature_enabled = true;

if (is_vip_feature_enabled) {

Check failure on line 13 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `is_vip_feature_enabled` with `·is_vip_feature_enabled·`
console.log('VIP feature is enabled');

Check failure on line 14 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `'VIP·feature·is·enabled'` with `·'VIP·feature·is·enabled'·`
} else {
console.log('VIP feature is disabled');

Check failure on line 16 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `'VIP·feature·is·disabled'` with `·'VIP·feature·is·disabled'·`
/**
* Map Custom Statuses as options for SelectControl
*/
const statuses = window.EditFlowCustomStatuses.map(s => ({ label: s.name, value: s.slug }));

Check failure on line 20 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `s·=>·({·label:·s.name,·value:·s.slug·})` with `·s·=>·(·{·label:·s.name,·value:·s.slug·}·)·`

// For new posts, we need to force the default custom status.
const isCleanNewPost = select( 'core/editor' ).isCleanNewPost();
if ( isCleanNewPost ) {
dispatch( 'core/editor' ).editPost( {
status: ef_default_custom_status,
} );
}
/**
* Subscribe to changes so we can set a default status and update a button's text.
*/
let buttonTextObserver = null;
subscribe(function () {

Check failure on line 26 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Insert `·`
const postId = select('core/editor').getCurrentPostId();

Check failure on line 27 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `'core/editor'` with `·'core/editor'·`
if (!postId) {

Check failure on line 28 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `!postId` with `·!·postId·`
// Post isn't ready yet so don't do anything.
return;
}

// If the save button exists, let's update the text if needed.
maybeUpdateButtonText( document.querySelector( '.editor-post-save-draft' ) );

// The post is being saved, so we need to set up an observer to update the button text when it's back.
if (
buttonTextObserver === null &&
window.MutationObserver &&
select( 'core/editor' ).isSavingPost()
) {
buttonTextObserver = createButtonObserver(
document.querySelector( '.edit-post-header__settings' )
);
}
} );

/**
* Create a mutation observer that will update the
* save button text right away when it's changed/re-added.
*
* Ideally there will be better ways to go about this in the future.
* @see https://github.com/Automattic/Edit-Flow/issues/583
*/
function createButtonObserver( parentNode ) {
if ( ! parentNode ) {
return null;
}
// For new posts, we need to force the default custom status.
const isCleanNewPost = select('core/editor').isCleanNewPost();

Check failure on line 34 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `'core/editor'` with `·'core/editor'·`
if (isCleanNewPost) {

Check failure on line 35 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `isCleanNewPost` with `·isCleanNewPost·`
dispatch('core/editor').editPost({

Check failure on line 36 in modules/custom-status/lib/custom-status-block.js

View workflow job for this annotation

GitHub Actions / test 

Replace `'core/editor').editPost(` with `·'core/editor'·).editPost(·`
status: ef_default_custom_status,
});
}

const observer = new MutationObserver( mutationsList => {
for ( const mutation of mutationsList ) {
for ( const node of mutation.addedNodes ) {
maybeUpdateButtonText( node );
}
// If the save button exists, let's update the text if needed.
maybeUpdateButtonText(document.querySelector('.editor-post-save-draft'));

// The post is being saved, so we need to set up an observer to update the button text when it's back.
if (
buttonTextObserver === null &&
window.MutationObserver &&
select('core/editor').isSavingPost()
) {
buttonTextObserver = createButtonObserver(
document.querySelector('.edit-post-header__settings')
);
}
});

/**
* Create a mutation observer that will update the
* save button text right away when it's changed/re-added.
*
* Ideally there will be better ways to go about this in the future.
* @see https://github.com/Automattic/Edit-Flow/issues/583
*/
function createButtonObserver(parentNode) {
if (!parentNode) {
return null;
}
} );

observer.observe( parentNode, { childList: true } );
return observer;
}
const observer = new MutationObserver(mutationsList => {
for (const mutation of mutationsList) {
for (const node of mutation.addedNodes) {
maybeUpdateButtonText(node);
}
}
});

function maybeUpdateButtonText( saveButton ) {
/*
* saveButton.children < 1 accounts for when a user hovers over the save button
* and a tooltip is rendered
*/
if (
saveButton &&
saveButton.children < 1 &&
( saveButton.innerText === __( 'Save Draft' ) ||
saveButton.innerText === __( 'Save as Pending' ) )
) {
saveButton.innerText = __( 'Save' );
observer.observe(parentNode, { childList: true });
return observer;
}

function maybeUpdateButtonText(saveButton) {
/*
* saveButton.children < 1 accounts for when a user hovers over the save button
* and a tooltip is rendered
*/
if (
saveButton &&
saveButton.children < 1 &&
(saveButton.innerText === __('Save Draft') ||
saveButton.innerText === __('Save as Pending'))
) {
saveButton.innerText = __('Save');
}
}
}

/**
* Custom status component
* @param object props
*/
const EditFlowCustomPostStati = ( { onUpdate, status } ) => (
<PluginPostStatusInfo
className={ `edit-flow-extended-post-status edit-flow-extended-post-status-${ status }` }
>
<h4>
{ status !== 'publish'
? __( 'Extended Post Status', 'edit-flow' )
: __( 'Extended Post Status Disabled.', 'edit-flow' ) }
</h4>

{ status !== 'publish' ? (
<SelectControl label="" value={ status } options={ statuses } onChange={ onUpdate } />
) : null }

<small className="edit-flow-extended-post-status-note">
{ status !== 'publish'
? __( 'Note: this will override all status settings above.', 'edit-flow' )
: __( 'To select a custom status, please unpublish the content first.', 'edit-flow' ) }
</small>
</PluginPostStatusInfo>
);

const mapSelectToProps = select => {
return {
status: select( 'core/editor' ).getEditedPostAttribute( 'status' ),
/**
* Custom status component
* @param object props
*/
const EditFlowCustomPostStati = ({ onUpdate, status }) => (
<PluginPostStatusInfo
className={`edit-flow-extended-post-status edit-flow-extended-post-status-${status}`}
>
<h4>
{status !== 'publish'
? __('Extended Post Status', 'edit-flow')
: __('Extended Post Status Disabled.', 'edit-flow')}
</h4>

{status !== 'publish' ? (
<SelectControl label="" value={status} options={statuses} onChange={onUpdate} />
) : null}

<small className="edit-flow-extended-post-status-note">
{status !== 'publish'
? __('Note: this will override all status settings above.', 'edit-flow')
: __('To select a custom status, please unpublish the content first.', 'edit-flow')}
</small>
</PluginPostStatusInfo>
);

const mapSelectToProps = select => {
return {
status: select('core/editor').getEditedPostAttribute('status'),
};
};
};

const mapDispatchToProps = dispatch => {
return {
onUpdate( status ) {
dispatch( 'core/editor' ).editPost( { status } );
},
const mapDispatchToProps = dispatch => {
return {
onUpdate(status) {
dispatch('core/editor').editPost({ status });
},
};
};
};

const plugin = compose(
withSelect( mapSelectToProps ),
withDispatch( mapDispatchToProps )
)( EditFlowCustomPostStati );

/**
* Kick it off
*/
registerPlugin( 'edit-flow-custom-status', {
icon: 'edit-flow',
render: plugin,
} );

const plugin = compose(
withSelect(mapSelectToProps),
withDispatch(mapDispatchToProps)
)(EditFlowCustomPostStati);

/**
* Kick it off
*/
registerPlugin('edit-flow-custom-status', {
icon: 'edit-flow',
render: plugin,
});
}

0 comments on commit 75690d7

Please sign in to comment.