Video Preview goes here
{/* */}
-
+
Settings
-
-
-
-
-
-
+
+
+
+
+
+
);
-VideoSettingsModal.defaultProps = {
- error: {
- duration: {},
- handout: {},
- license: {},
- thumbnail: {},
- transcripts: {},
- videoSource: {},
- },
-};
-VideoSettingsModal.propTypes = {
- error: PropTypes.node,
-};
-
export default VideoSettingsModal;
diff --git a/src/editors/containers/VideoEditor/hooks.js b/src/editors/containers/VideoEditor/hooks.js
index 011b020b8..1e3ca1bfd 100644
--- a/src/editors/containers/VideoEditor/hooks.js
+++ b/src/editors/containers/VideoEditor/hooks.js
@@ -1,8 +1,10 @@
-import { useState } from 'react';
+import { useState, createContext } from 'react';
import { StrictDict } from '../../utils';
import * as module from './hooks';
+export const ErrorContext = createContext();
+
export const state = StrictDict({
durationErrors: (val) => useState(val),
handoutErrors: (val) => useState(val),
@@ -22,59 +24,21 @@ export const errorsHook = () => {
return {
error: {
- duration: durationErrors,
- handout: handoutErrors,
- license: licenseErrors,
- thumbnail: thumbnailErrors,
- transcripts: transcriptsErrors,
- videoSource: videoSourceErrors,
+ duration: [durationErrors, setDurationErrors],
+ handout: [handoutErrors, setHandoutErrors],
+ license: [licenseErrors, setLicenseErrors],
+ thumbnail: [thumbnailErrors, setThumbnailErrors],
+ transcripts: [transcriptsErrors, setTranscriptsErrors],
+ videoSource: [videoSourceErrors, setVideoSourceErrors],
},
validateEntry: () => {
- let validated = true;
- if (!module.validateDuration({ setDurationErrors })) { validated = false; }
- if (!module.validateHandout({ setHandoutErrors })) { validated = false; }
- if (!module.validateLicense({ setLicenseErrors })) { validated = false; }
- if (!module.validateThumbnail({ setThumbnailErrors })) { validated = false; }
- if (!module.validateTranscripts({ setTranscriptsErrors })) { validated = false; }
- if (!module.validateVideoSource({ setVideoSourceErrors })) { validated = false; }
- return validated;
+ if (Object.keys(durationErrors).length > 0) { return false; }
+ if (Object.keys(handoutErrors).length > 0) { return false; }
+ if (Object.keys(licenseErrors).length > 0) { return false; }
+ if (Object.keys(thumbnailErrors).length > 0) { return false; }
+ if (Object.keys(transcriptsErrors).length > 0) { return false; }
+ if (Object.keys(videoSourceErrors).length > 0) { return false; }
+ return true;
},
};
};
-
-export const validateDuration = ({ setDurationErrors }) => {
- setDurationErrors({
- fieldName: 'sample error message',
- });
- return false;
-};
-export const validateHandout = ({ setHandoutErrors }) => {
- setHandoutErrors({
- fieldName: 'sample error message',
- });
- return false;
-};
-export const validateLicense = ({ setLicenseErrors }) => {
- setLicenseErrors({
- fieldName: 'sample error message',
- });
- return false;
-};
-export const validateThumbnail = ({ setThumbnailErrors }) => {
- setThumbnailErrors({
- fieldName: 'sample error message',
- });
- return false;
-};
-export const validateTranscripts = ({ setTranscriptsErrors }) => {
- setTranscriptsErrors({
- fieldName: 'sample error message',
- });
- return false;
-};
-export const validateVideoSource = ({ setVideoSourceErrors }) => {
- setVideoSourceErrors({
- fieldName: 'sample error message',
- });
- return false;
-};
diff --git a/src/editors/containers/VideoEditor/hooks.test.js b/src/editors/containers/VideoEditor/hooks.test.js
index e12a09c6e..f29438cb4 100644
--- a/src/editors/containers/VideoEditor/hooks.test.js
+++ b/src/editors/containers/VideoEditor/hooks.test.js
@@ -1,6 +1,5 @@
import { MockUseState } from '../../../testUtils';
-import { keyStore } from '../../utils';
import * as module from './hooks';
jest.mock('react', () => ({
@@ -8,7 +7,6 @@ jest.mock('react', () => ({
}));
const state = new MockUseState(module);
-const moduleKeys = keyStore(module);
let hook;
@@ -33,38 +31,44 @@ describe('VideoEditorHooks', () => {
state.restore();
});
- const mockTrue = () => true;
- const mockFalse = () => false;
+ const fakeDurationError = {
+ field1: 'field1msg',
+ field2: 'field2msg',
+ };
test('error: state values', () => {
- expect(module.errorsHook().error).toEqual({
- duration: state.stateVals[state.keys.durationErrors],
- handout: state.stateVals[state.keys.handoutErrors],
- license: state.stateVals[state.keys.licenseErrors],
- thumbnail: state.stateVals[state.keys.thumbnailErrors],
- transcripts: state.stateVals[state.keys.transcriptsErrors],
- videoSource: state.stateVals[state.keys.videoSourceErrors],
- });
+ expect(module.errorsHook().error.duration).toEqual([
+ state.stateVals[state.keys.durationErrors],
+ state.setState[state.keys.durationErrors],
+ ]);
+ expect(module.errorsHook().error.handout).toEqual([
+ state.stateVals[state.keys.handoutErrors],
+ state.setState[state.keys.handoutErrors],
+ ]);
+ expect(module.errorsHook().error.license).toEqual([
+ state.stateVals[state.keys.licenseErrors],
+ state.setState[state.keys.licenseErrors],
+ ]);
+ expect(module.errorsHook().error.thumbnail).toEqual([
+ state.stateVals[state.keys.thumbnailErrors],
+ state.setState[state.keys.thumbnailErrors],
+ ]);
+ expect(module.errorsHook().error.transcripts).toEqual([
+ state.stateVals[state.keys.transcriptsErrors],
+ state.setState[state.keys.transcriptsErrors],
+ ]);
+ expect(module.errorsHook().error.videoSource).toEqual([
+ state.stateVals[state.keys.videoSourceErrors],
+ state.setState[state.keys.videoSourceErrors],
+ ]);
});
describe('validateEntry', () => {
- beforeEach(() => {
- hook = module.errorsHook();
- });
test('validateEntry: returns true if all validation calls are true', () => {
- jest.spyOn(module, moduleKeys.validateDuration).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateHandout).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateLicense).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateThumbnail).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateTranscripts).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateVideoSource).mockImplementationOnce(mockTrue);
+ hook = module.errorsHook();
expect(hook.validateEntry()).toEqual(true);
});
test('validateEntry: returns false if any validation calls are false', () => {
- jest.spyOn(module, moduleKeys.validateDuration).mockImplementationOnce(mockFalse);
- jest.spyOn(module, moduleKeys.validateHandout).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateLicense).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateThumbnail).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateTranscripts).mockImplementationOnce(mockTrue);
- jest.spyOn(module, moduleKeys.validateVideoSource).mockImplementationOnce(mockTrue);
+ state.mockVal(state.keys.durationErrors, fakeDurationError);
+ hook = module.errorsHook();
expect(hook.validateEntry()).toEqual(false);
});
});
diff --git a/src/editors/containers/VideoEditor/index.jsx b/src/editors/containers/VideoEditor/index.jsx
index ef1c8e99b..8e22805c8 100644
--- a/src/editors/containers/VideoEditor/index.jsx
+++ b/src/editors/containers/VideoEditor/index.jsx
@@ -6,7 +6,7 @@ import { selectors } from '../../data/redux';
import EditorContainer from '../EditorContainer';
import VideoEditorModal from './components/VideoEditorModal';
-import { errorsHook } from './hooks';
+import { ErrorContext, errorsHook } from './hooks';
export const VideoEditor = ({
onClose,
@@ -19,15 +19,17 @@ export const VideoEditor = ({
} = errorsHook();
return (
-