feat: add social share widget (#323)

This commit is contained in:
Kristin Aoki
2023-05-03 09:55:31 -04:00
committed by GitHub
parent d68bdf9dc6
commit 6aaedfc500
13 changed files with 540 additions and 100 deletions

View File

@@ -8,8 +8,9 @@ import { parseYoutubeId } from '../../services/cms/api';
export const loadVideoData = () => (dispatch, getState) => {
const state = getState();
const rawVideoData = state.app.blockValue.data.metadata ? state.app.blockValue.data.metadata : {};
const courseLicenseData = state.app.courseDetails.data ? state.app.courseDetails.data : {};
const blockValueData = state.app.blockValue.data;
const rawVideoData = blockValueData.metadata ? blockValueData.metadata : {};
const courseData = state.app.courseDetails.data ? state.app.courseDetails.data : {};
const studioView = state.app.studioView?.data?.html;
const {
videoId,
@@ -23,16 +24,21 @@ export const loadVideoData = () => (dispatch, getState) => {
const [licenseType, licenseOptions] = module.parseLicense({ licenseData: studioView, level: 'block' });
const transcripts = module.parseTranscripts({ transcriptsData: studioView });
const [courseLicenseType, courseLicenseDetails] = module.parseLicense({
licenseData: courseLicenseData.license,
licenseData: courseData.license,
level: 'course',
});
const allowVideoSharing = module.parseVideoSharingSetting({
courseSetting: blockValueData?.video_sharing_options,
blockSetting: rawVideoData.public_access,
});
dispatch(actions.video.load({
videoSource: videoUrl || '',
videoId,
fallbackVideos,
allowVideoDownloads: rawVideoData.download_video,
allowVideoSharing: rawVideoData.public_access,
allowVideoSharing,
videoSharingLearnMoreLink: blockValueData?.video_sharing_doc_url,
videoSharingEnabledForCourse: blockValueData?.video_sharing_enabled,
transcripts,
allowTranscriptDownloads: rawVideoData.download_track,
showTranscriptByDefault: rawVideoData.show_captions,
@@ -61,7 +67,6 @@ export const loadVideoData = () => (dispatch, getState) => {
dispatch(requests.fetchVideoFeatures({
onSuccess: (response) => dispatch(actions.video.updateField({
allowThumbnailUpload: response.data.allowThumbnailUpload,
videoSharingEnabledForCourse: response.data.videoSharingEnabled,
})),
}));
const youTubeId = parseYoutubeId(videoUrl);
@@ -100,6 +105,19 @@ export const determineVideoSources = ({
};
};
export const parseVideoSharingSetting = ({ courseSetting, blockSetting }) => {
switch (courseSetting) {
case 'all-on':
return { level: 'course', value: true };
case 'all-off':
return { level: 'course', value: false };
case 'per-video':
return { level: 'block', value: blockSetting };
default:
return { level: 'block', value: blockSetting };
}
};
export const parseTranscripts = ({ transcriptsData }) => {
if (!transcriptsData) {
return [];

View File

@@ -53,7 +53,6 @@ const mockAllowTranscriptImport = { data: { command: 'import' } };
const mockVideoFeatures = {
data: {
allowThumbnailUpload: 'soMEbOolEAn',
videoSharingEnabled: 'someBOoOoOlean',
},
};
@@ -70,6 +69,10 @@ const testMetadata = {
transcripts: ['do', 're', 'mi'],
thumbnail: 'thuMBNaIl',
};
const videoSharingData = {
video_sharing_doc_url: 'SomEUrL.Com',
video_sharing_options: 'OpTIOns',
};
const testState = {
transcripts: ['la'],
thumbnail: 'sOMefILE',
@@ -92,7 +95,7 @@ describe('video thunkActions', () => {
getState = jest.fn(() => ({
app: {
blockId: 'soMEBloCk',
blockValue: { data: { metadata: { ...testMetadata } } },
blockValue: { data: { metadata: { ...testMetadata }, ...videoSharingData } },
studioEndpointUrl: 'soMEeNDPoiNT',
courseDetails: { data: { license: null } },
studioView: { data: { html: 'sOMeHTml' } },
@@ -110,6 +113,10 @@ describe('video thunkActions', () => {
videoId: 'videOiD',
fallbackVideos: 'fALLbACKvIDeos',
});
jest.spyOn(thunkActions, thunkActionsKeys.parseVideoSharingSetting).mockReturnValue({
level: 'course',
value: true,
});
jest.spyOn(thunkActions, thunkActionsKeys.parseLicense).mockReturnValue([
'liCENSEtyPe',
{
@@ -146,6 +153,12 @@ describe('video thunkActions', () => {
videoId: 'videOiD',
fallbackVideos: 'fALLbACKvIDeos',
allowVideoDownloads: testMetadata.download_video,
allowVideoSharing: {
level: 'course',
value: true,
},
videoSharingLearnMoreLink: videoSharingData.video_sharing_doc_url,
videoSharingEnableForCourse: videoSharingData.video_sharing_enabled,
transcripts: testMetadata.transcripts,
allowTranscriptDownloads: testMetadata.download_track,
showTranscriptByDefault: testMetadata.show_captions,
@@ -177,10 +190,8 @@ describe('video thunkActions', () => {
dispatchedAction1.fetchVideoFeatures.onSuccess(mockVideoFeatures);
expect(dispatch).toHaveBeenCalledWith(actions.video.updateField({
allowThumbnailUpload: mockVideoFeatures.data.allowThumbnailUpload,
videoSharingEnabledForCourse: mockVideoFeatures.data.videoSharingEnabled,
}));
dispatch.mockClear();
dispatchedAction2.checkTranscriptsForImport.onSuccess(mockAllowTranscriptImport);
expect(dispatch).toHaveBeenCalledWith(actions.video.updateField({
allowTranscriptImport: true,
@@ -349,6 +360,55 @@ describe('video thunkActions', () => {
]);
});
});
describe('parseVideoShareSetting', () => {
describe('has no course setting or block setting for video sharing', () => {
it('should return an object with level equal to block and value equal to null', () => {
const videoSharingSetting = thunkActions.parseVideoSharingSetting({
courseSetting: null,
blockSetting: null,
});
expect(videoSharingSetting).toEqual({ level: 'block', value: null });
});
});
describe('has no course setting and block setting defined for video sharing', () => {
it('should return an object with level equal to block and value equal to true', () => {
const videoSharingSetting = thunkActions.parseVideoSharingSetting({
courseSetting: null,
blockSetting: true,
});
expect(videoSharingSetting).toEqual({ level: 'block', value: true });
});
});
describe('has course setting defined for video sharing', () => {
describe('course setting equals all-on', () => {
it('should return an object with level equal to course and value equal to true', () => {
const videoSharingSetting = thunkActions.parseVideoSharingSetting({
courseSetting: 'all-on',
blockSetting: true,
});
expect(videoSharingSetting).toEqual({ level: 'course', value: true });
});
});
describe('course setting equals all-off', () => {
it('should return an object with level equal to course and value equal to false', () => {
const videoSharingSetting = thunkActions.parseVideoSharingSetting({
courseSetting: 'all-off',
blockSetting: true,
});
expect(videoSharingSetting).toEqual({ level: 'course', value: false });
});
});
describe('course setting equals per-video', () => {
it('should return an object with level equal to block and value equal to block setting', () => {
const videoSharingSetting = thunkActions.parseVideoSharingSetting({
courseSetting: 'per-video',
blockSetting: false,
});
expect(videoSharingSetting).toEqual({ level: 'block', value: false });
});
});
});
});
describe('uploadHandout', () => {
beforeEach(() => {
thunkActions.uploadHandout({ file: mockFilename })(dispatch);

View File

@@ -10,8 +10,12 @@ const initialState = {
'',
],
allowVideoDownloads: false,
allowVideoSharing: false,
allowVideoSharing: {
level: 'block',
value: false,
},
videoSharingEnabledForCourse: false,
videoSharingLearnMoreLink: '',
thumbnail: null,
transcripts: [],
allowTranscriptDownloads: false,

View File

@@ -18,6 +18,7 @@ export const simpleSelectors = [
stateKeys.fallbackVideos,
stateKeys.allowVideoDownloads,
stateKeys.videoSharingEnabledForCourse,
stateKeys.videoSharingLearnMoreLink,
stateKeys.allowVideoSharing,
stateKeys.thumbnail,
stateKeys.transcripts,

View File

@@ -166,7 +166,7 @@ export const apiMethods = {
metadata: {
display_name: title,
download_video: content.allowVideoDownloads,
public_access: content.allowVideoSharing,
public_access: content.allowVideoSharing.value,
edx_video_id: edxVideoId,
html5_sources: html5Sources,
youtube_id_1_0: youtubeId,

View File

@@ -125,7 +125,10 @@ describe('cms api', () => {
videoSource: 'viDeOSouRCE',
fallbackVideos: 'FalLBacKVidEOs',
allowVideoDownloads: 'alLOwViDeodownLOads',
allowVideoSharing: 'alloWviDeOshArinG',
allowVideoSharing: {
level: 'sOMeStRInG',
value: 'alloWviDeOshArinG',
},
thumbnail: 'THUmbNaIL',
transcripts: 'traNScRiPts',
allowTranscriptDownloads: 'aLloWTRaNScriPtdoWnlOADS',
@@ -162,7 +165,7 @@ describe('cms api', () => {
metadata: {
display_name: title,
download_video: content.allowVideoDownloads,
public_access: content.allowVideoSharing,
public_access: content.allowVideoSharing.value,
edx_video_id: edxVideoId,
html5_sources: html5Sources,
youtube_id_1_0: youtubeId,