Skip to content

Media: Update request media item to data-layer #18017

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

Merged
merged 8 commits into from
Sep 15, 2017
Merged

Media: Update request media item to data-layer #18017

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
5db275d
Add data-layer request to requestMediaItem
sirreal Sep 13, 2017
11adb74
Add requestMediaItem success handler
sirreal Sep 13, 2017
4d050fb
Add requestMediaItem error handler
sirreal Sep 13, 2017
e17a0a2
Remove old receiveMediaItem handler
sirreal Sep 13, 2017
2c3dec4
Export data-layer handlers for testing
sirreal Sep 13, 2017
5228bfb
Remove unnecessary isRequesting check
sirreal Sep 13, 2017
94bf3e5
Update tests for data-layer middleware
sirreal Sep 13, 2017
e52af95
Remove bad @return from docblock
sirreal Sep 15, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
51 changes: 29 additions & 22 deletions client/state/data-layer/wpcom/sites/media/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
/**
* Internal dependencies
*/
import debug from 'debug';
import { dispatchRequest } from 'state/data-layer/wpcom-http/utils';
import { http } from 'state/data-layer/wpcom-http/actions';
import { MEDIA_REQUEST, MEDIA_ITEM_REQUEST } from 'state/action-types';
import { isRequestingMediaItem } from 'state/selectors';
import {
failMediaRequest,
failMediaItemRequest,
Expand All @@ -12,11 +14,6 @@ import {
successMediaRequest,
successMediaItemRequest
} from 'state/media/actions';
import wpcom from 'lib/wp';
import debug from 'debug';

import { dispatchRequest } from 'state/data-layer/wpcom-http/utils';
import { http } from 'state/data-layer/wpcom-http/actions';

/**
* Module variables
Expand All @@ -28,7 +25,6 @@ const log = debug( 'calypso:middleware-media' );
*
* @param {Object} store Redux store
* @param {Object} action Action object
* @return {Promise} Promise
*/
export function requestMedia( { dispatch, getState }, action ) {
dispatch( requestingMedia( action.siteId, action.query ) );
Expand Down Expand Up @@ -56,27 +52,38 @@ export function requestMediaError( { dispatch }, { siteId, query } ) {
dispatch( failMediaRequest( siteId, query ) );
}

export function requestMediaItem( { dispatch, getState }, { siteId, mediaId } ) {
if ( isRequestingMediaItem( getState(), siteId, mediaId ) ) {
return;
}
export function handleMediaItemRequest( { dispatch }, action ) {
const { mediaId, query, siteId } = action;

dispatch( requestingMediaItem( siteId, mediaId ) );
dispatch( requestingMediaItem( siteId, query ) );

log( 'Request media item %d for site %d', mediaId, siteId );

return wpcom
.site( siteId )
.media( mediaId )
.get()
.then( ( media ) => {
dispatch( receiveMedia( siteId, media ) );
dispatch( successMediaItemRequest( siteId, mediaId ) );
} )
.catch( () => dispatch( failMediaItemRequest( siteId, mediaId ) ) );
dispatch(
http(
{
apiVersion: '1.2',
method: 'GET',
path: `/sites/${ siteId }/media/${ mediaId }`,
query,
},
action
)
);
}

export function receiveMediaItem( { dispatch }, { mediaId, siteId }, media ) {
dispatch( receiveMedia( siteId, media ) );
dispatch( successMediaItemRequest( siteId, mediaId ) );
}

export function receiveMediaItemError( { dispatch }, { mediaId, siteId } ) {
dispatch( failMediaItemRequest( siteId, mediaId ) );
}

export default {
[ MEDIA_REQUEST ]: [ dispatchRequest( requestMedia, requestMediaSuccess, requestMediaError ) ],
[ MEDIA_ITEM_REQUEST ]: [ requestMediaItem ],
[ MEDIA_ITEM_REQUEST ]: [
dispatchRequest( handleMediaItemRequest, receiveMediaItem, receiveMediaItemError ),
],
};
213 changes: 119 additions & 94 deletions client/state/data-layer/wpcom/sites/media/test/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,119 +6,144 @@ import { expect } from 'chai';
/**
* Internal dependencies
*/
import useNock from 'test/helpers/use-nock';
import { handleMediaItemRequest, receiveMediaItem, receiveMediaItemError } from '../';
import { http } from 'state/data-layer/wpcom-http/actions';
import { MEDIA_ITEM_REQUEST } from 'state/action-types';
import { useSandbox } from 'test/helpers/use-sinon';
import {
failMediaItemRequest,
failMediaRequest,
receiveMedia,
requestingMedia,
requestingMediaItem,
successMediaRequest,
successMediaItemRequest,
failMediaRequest,
failMediaItemRequest,
receiveMedia
successMediaRequest,
} from 'state/media/actions';
import {
requestMediaItem,
requestMediaSuccess,
requestMediaError,
requestMedia
} from '../';
import { http } from 'state/data-layer/wpcom-http/actions';

describe( 'wpcom-api', () => {
describe( 'media request', () => {
let dispatch;

useSandbox( sandbox => ( dispatch = sandbox.spy() ) );

describe( 'media request', () => {
const getState = () => ( {
media: {
queryRequests: {
2916284: {
'[]': true
}
const getState = () => ( {
media: {
queryRequests: {
2916284: {
'[]': true
}
}
} );

it( 'should dispatch REQUESTING action when request triggers', () => {
requestMedia( { dispatch, getState }, { siteId: 2916284, query: 'a=b' } );
expect( dispatch ).to.have.been.calledWith( requestingMedia( 2916284, 'a=b' ) );
} );

it( 'should dispatch SUCCESS action when request completes', () => {
requestMediaSuccess( { dispatch }, { siteId: 2916284, query: 'a=b' },
{ media: { ID: 10, title: 'media title' }, found: true } );
expect( dispatch ).to.have.been.calledWith( successMediaRequest( 2916284, 'a=b' ) );
expect( dispatch ).to.have.been.calledWith( receiveMedia( 2916284, { ID: 10, title: 'media title' }, true, 'a=b' ) );
} );

it( 'should dispatch FAILURE action when request fails', () => {
requestMediaError( { dispatch }, { siteId: 2916284, query: 'a=b' } );
expect( dispatch ).to.have.been.calledWith( failMediaRequest( 2916284, 'a=b' ) );
} );

it( 'should dispatch http request', () => {
requestMedia( { dispatch, getState }, { siteId: 2916284, query: 'a=b' } );
expect( dispatch ).to.have.been.calledWith(
http(
{
method: 'GET',
path: '/sites/2916284/media',
apiVersion: '1.1',
},
{ siteId: 2916284, query: 'a=b' }
)
);
} );
}
} );

describe( 'media item request', () => {
const getState = () => ( {
media: {
mediaItemRequests: {
2916284: {
15: true
}
}
}
} );

useNock( nock => (
nock( 'https://public-api.wordpress.com:443' )
.persist()
.get( '/rest/v1.2/sites/2916284/media/10' )
.reply( 200, {
ID: 10,
title: 'media title'
} )
.get( '/rest/v1.2/sites/2916284/media/20' )
.reply( 400, {} )
) );

it( 'should not dispatch anything if the request is in flight', () => {
requestMediaItem( { dispatch, getState }, { siteId: 2916284, mediaId: 15 } );
expect( dispatch ).to.not.have.been.called;
} );

it( 'should dispatch REQUESTING action when request triggers', () => {
requestMediaItem( { dispatch, getState }, { siteId: 2916284, mediaId: 10 } );
expect( dispatch ).to.have.been.calledWith( requestingMediaItem( 2916284, 10 ) );
} );

it( 'should dispatch SUCCESS action when request completes', () => {
return requestMediaItem( { dispatch, getState }, { siteId: 2916284, mediaId: 10 } )
.then( () => {
expect( dispatch ).to.have.been.calledWith( successMediaItemRequest( 2916284, 10 ) );
expect( dispatch ).to.have.been.calledWith( receiveMedia( 2916284, { ID: 10, title: 'media title' } ) );
} );
} );

it( 'should dispatch FAILURE action when request fails', () => {
return requestMediaItem( { dispatch, getState }, { siteId: 2916284, mediaId: 20 } )
.catch( () => {
expect( dispatch ).to.have.been.calledWith( failMediaItemRequest( 2916284, 20 ) );
} );
} );
it( 'should dispatch REQUESTING action when request triggers', () => {
requestMedia( { dispatch, getState }, { siteId: 2916284, query: 'a=b' } );
expect( dispatch ).to.have.been.calledWith( requestingMedia( 2916284, 'a=b' ) );
} );

it( 'should dispatch SUCCESS action when request completes', () => {
requestMediaSuccess( { dispatch }, { siteId: 2916284, query: 'a=b' },
{ media: { ID: 10, title: 'media title' }, found: true } );
expect( dispatch ).to.have.been.calledWith( successMediaRequest( 2916284, 'a=b' ) );
expect( dispatch ).to.have.been.calledWith( receiveMedia( 2916284, { ID: 10, title: 'media title' }, true, 'a=b' ) );
} );

it( 'should dispatch FAILURE action when request fails', () => {
requestMediaError( { dispatch }, { siteId: 2916284, query: 'a=b' } );
expect( dispatch ).to.have.been.calledWith( failMediaRequest( 2916284, 'a=b' ) );
} );

it( 'should dispatch http request', () => {
requestMedia( { dispatch, getState }, { siteId: 2916284, query: 'a=b' } );
expect( dispatch ).to.have.been.calledWith(
http(
{
method: 'GET',
path: '/sites/2916284/media',
apiVersion: '1.1',
},
{ siteId: 2916284, query: 'a=b' }
)
);
} );
} );

describe( 'handleMediaItemRequest', () => {
let dispatch;

useSandbox( sandbox => ( dispatch = sandbox.spy() ) );

it( 'should dispatch an http action', () => {
const siteId = 12345;
const mediaId = 67890;
const action = {
type: MEDIA_ITEM_REQUEST,
mediaId,
siteId,
};
handleMediaItemRequest( { dispatch }, action );
expect( dispatch ).to.have.been.calledTwice;
expect( dispatch ).to.have.been.calledWith(
requestingMediaItem( siteId )
);
expect( dispatch ).to.have.been.calledWith(
http(
{
apiVersion: '1.2',
method: 'GET',
path: `/sites/${ siteId }/media/${ mediaId }`,
},
action
)
);
} );
} );

describe( 'receiveMediaItem', () => {
let dispatch;

useSandbox( sandbox => ( dispatch = sandbox.spy() ) );

it( 'should dispatch media recieve actions', () => {
const siteId = 12345;
const mediaId = 67890;
const action = {
type: MEDIA_ITEM_REQUEST,
mediaId,
siteId,
};
const media = { ID: 91827364 };
receiveMediaItem( { dispatch }, action, media );
expect( dispatch ).to.have.been.calledTwice,
expect( dispatch ).to.have.been.calledWith(
receiveMedia( siteId, media )
);
expect( dispatch ).to.have.been.calledWith(
successMediaItemRequest( siteId, mediaId )
);
} );
} );

describe( 'receiveMediaItemError', () => {
let dispatch;

useSandbox( sandbox => ( dispatch = sandbox.spy() ) );

it( 'should dispatch failure', () => {
const siteId = 12345;
const mediaId = 67890;
const action = {
type: MEDIA_ITEM_REQUEST,
mediaId,
siteId,
};
receiveMediaItemError( { dispatch }, action );
expect( dispatch ).to.have.been.calledWith(
failMediaItemRequest( siteId, mediaId )
);
} );
} );