Trigger a note action on button click.

This commit is contained in:
Jeff Stieler 2019-05-24 16:22:46 -04:00
parent 698f947c16
commit 5a49991cb1
4 changed files with 47 additions and 15 deletions

View File

@ -49,18 +49,23 @@ class InboxPanel extends Component {
} }
renderNotes() { renderNotes() {
const { lastRead, notes } = this.props; const { lastRead, notes, triggerNoteAction } = this.props;
if ( 0 === Object.keys( notes ).length ) { if ( 0 === Object.keys( notes ).length ) {
return this.renderEmptyCard(); return this.renderEmptyCard();
} }
const getButtonsFromActions = actions => { const getButtonsFromActions = note => {
if ( ! actions ) { if ( ! note.actions ) {
return []; return [];
} }
return actions.map( action => ( return note.actions.map( action => (
<Button isDefault href={ action.url || undefined }> <Button
isDefault
isPrimary={ action.primary }
href={ action.url || undefined }
onClick={ () => triggerNoteAction( note.id, action.id ) }
>
{ action.label } { action.label }
</Button> </Button>
) ); ) );
@ -80,7 +85,7 @@ class InboxPanel extends Component {
! note.date_created_gmt || ! note.date_created_gmt ||
new Date( note.date_created_gmt + 'Z' ).getTime() > lastRead new Date( note.date_created_gmt + 'Z' ).getTime() > lastRead
} }
actions={ getButtonsFromActions( note.actions ) } actions={ getButtonsFromActions( note ) }
> >
<span dangerouslySetInnerHTML={ sanitizeHTML( note.content ) } /> <span dangerouslySetInnerHTML={ sanitizeHTML( note.content ) } />
</ActivityCard> </ActivityCard>
@ -154,10 +159,11 @@ export default compose(
return { notes, isError, isRequesting, lastRead: userData.activity_panel_inbox_last_read }; return { notes, isError, isRequesting, lastRead: userData.activity_panel_inbox_last_read };
} ), } ),
withDispatch( dispatch => { withDispatch( dispatch => {
const { updateCurrentUserData } = dispatch( 'wc-api' ); const { updateCurrentUserData, triggerNoteAction } = dispatch( 'wc-api' );
return { return {
updateCurrentUserData, updateCurrentUserData,
triggerNoteAction,
}; };
} ) } )
)( InboxPanel ); )( InboxPanel );

View File

@ -8,7 +8,6 @@ import { IconButton, Button, Dashicon, Dropdown, NavigableMenu } from '@wordpres
import classnames from 'classnames'; import classnames from 'classnames';
import interpolateComponents from 'interpolate-components'; import interpolateComponents from 'interpolate-components';
import { compose } from '@wordpress/compose'; import { compose } from '@wordpress/compose';
import { noop } from 'lodash';
import { withDispatch } from '@wordpress/data'; import { withDispatch } from '@wordpress/data';
import moment from 'moment'; import moment from 'moment';
@ -64,18 +63,15 @@ class StoreAlerts extends Component {
} }
renderActions( alert ) { renderActions( alert ) {
const { updateNote } = this.props; const { triggerNoteAction, updateNote } = this.props;
const actions = alert.actions.map( action => { const actions = alert.actions.map( action => {
const markStatus = () => {
updateNote( alert.id, { status: action.status } );
};
return ( return (
<Button <Button
key={ action.name } key={ action.name }
isDefault isDefault
isPrimary={ action.primary } isPrimary={ action.primary }
href={ action.url || undefined } href={ action.url || undefined }
onClick={ '' === action.status ? noop : markStatus } onClick={ () => triggerNoteAction( alert.id, action.id ) }
> >
{ action.label } { action.label }
</Button> </Button>
@ -257,8 +253,10 @@ export default compose(
}; };
} ), } ),
withDispatch( dispatch => { withDispatch( dispatch => {
const { updateNote } = dispatch( 'wc-api' ); const { triggerNoteAction, updateNote } = dispatch( 'wc-api' );
return { return {
triggerNoteAction,
updateNote, updateNote,
}; };
} ) } )

View File

@ -5,6 +5,12 @@ const updateNote = operations => ( noteId, noteFields ) => {
operations.update( [ resourceKey ], { [ resourceKey ]: { noteId, ...noteFields } } ); operations.update( [ resourceKey ], { [ resourceKey ]: { noteId, ...noteFields } } );
}; };
const triggerNoteAction = operations => ( noteId, actionId ) => {
const resourceKey = 'note-action';
operations.update( [ resourceKey ], { [ resourceKey ]: { noteId, actionId } } );
};
export default { export default {
updateNote, updateNote,
triggerNoteAction,
}; };

View File

@ -20,7 +20,10 @@ function read( resourceNames, fetch = apiFetch ) {
} }
function update( resourceNames, data, fetch = apiFetch ) { function update( resourceNames, data, fetch = apiFetch ) {
return [ ...updateNote( resourceNames, data, fetch ) ]; return [
...updateNote( resourceNames, data, fetch ),
...triggerAction( resourceNames, data, fetch ),
];
} }
function readNoteQueries( resourceNames, fetch ) { function readNoteQueries( resourceNames, fetch ) {
@ -93,7 +96,26 @@ function updateNote( resourceNames, data, fetch ) {
return []; return [];
} }
function triggerAction( resourceNames, data, fetch ) {
const resourceName = 'note-action';
if ( resourceNames.includes( resourceName ) ) {
const { noteId, actionId } = data[ resourceName ];
const url = `${ NAMESPACE }/admin/notes/${ noteId }/action/${ actionId }`;
return [
fetch( { path: url, method: 'POST' } )
.then( note => {
return { [ 'note:' + noteId ]: { data: note } };
} )
.catch( error => {
return { [ 'note:' + noteId ]: { error } };
} ),
];
}
return [];
}
export default { export default {
read, read,
update, update,
triggerAction,
}; };