diff --git a/.env b/.env
index bc72c92..b544657 100644
--- a/.env
+++ b/.env
@@ -27,3 +27,4 @@ LEARNER_RECORD_MFE_BASE_URL=''
COLLECT_YEAR_OF_BIRTH=true
APP_ID=''
MFE_CONFIG_API_URL=''
+ENABLE_SKILLS_BUILDER=''
diff --git a/.env.development b/.env.development
index 4d6fd37..22f1dbd 100644
--- a/.env.development
+++ b/.env.development
@@ -28,3 +28,4 @@ LEARNER_RECORD_MFE_BASE_URL='http://localhost:1990'
COLLECT_YEAR_OF_BIRTH=true
APP_ID=''
MFE_CONFIG_API_URL=''
+ENABLE_SKILLS_BUILDER='true'
diff --git a/src/index.jsx b/src/index.jsx
index 0a1f9b5..3a2ffd2 100755
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -4,6 +4,7 @@ import 'regenerator-runtime/runtime';
import {
APP_INIT_ERROR,
APP_READY,
+ getConfig,
initialize,
mergeConfig,
subscribe,
@@ -22,6 +23,7 @@ import Footer, { messages as footerMessages } from '@edx/frontend-component-foot
import appMessages from './i18n';
import { ProfilePage, NotFoundPage } from './profile';
+import { SkillsBuilder } from './skills';
import configureStore from './data/configureStore';
import './index.scss';
@@ -34,6 +36,9 @@ subscribe(APP_READY, () => {
+ {getConfig().ENABLE_SKILLS_BUILDER && (
+
+ )}
@@ -63,6 +68,7 @@ initialize({
ENABLE_LEARNER_RECORD_MFE: (process.env.ENABLE_LEARNER_RECORD_MFE || false),
LEARNER_RECORD_MFE_BASE_URL: process.env.LEARNER_RECORD_MFE_BASE_URL,
COLLECT_YEAR_OF_BIRTH: process.env.COLLECT_YEAR_OF_BIRTH,
+ ENABLE_SKILLS_BUILDER: process.env.ENABLE_SKILLS_BUILDER,
}, 'App loadConfig override handler');
},
},
diff --git a/src/skills/SkillsBuilder.jsx b/src/skills/SkillsBuilder.jsx
new file mode 100644
index 0000000..b544bf7
--- /dev/null
+++ b/src/skills/SkillsBuilder.jsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import {
+ ActionRow,
+ Button,
+ Container,
+ FullscreenModal,
+} from '@edx/paragon';
+import { FormattedMessage } from '@edx/frontend-platform/i18n';
+import messages from './messages';
+
+const SkillsBuilder = () => {
+ const onCloseHandle = () => {
+ window.history.back();
+ };
+
+ return (
+
+
+
+
+
+ )}
+ >
+
+ Skills Builder content will go here
+
+
+ );
+};
+
+export default SkillsBuilder;
diff --git a/src/skills/index.js b/src/skills/index.js
new file mode 100644
index 0000000..f6dd83e
--- /dev/null
+++ b/src/skills/index.js
@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/prefer-default-export
+export { default as SkillsBuilder } from './SkillsBuilder';
diff --git a/src/skills/messages.js b/src/skills/messages.js
new file mode 100644
index 0000000..a4f053e
--- /dev/null
+++ b/src/skills/messages.js
@@ -0,0 +1,17 @@
+import { defineMessages } from '@edx/frontend-platform/i18n';
+
+const messages = defineMessages({
+ /* Modal Action Row Buttons */
+ goBackButton: {
+ id: 'go.back.button',
+ defaultMessage: 'Go Back',
+ description: 'Button that sends the user to the previous step in the skills builder.',
+ },
+ nextStepButton: {
+ id: 'next.step.button',
+ defaultMessage: 'Next Step',
+ description: 'Button that sends the user to the next step in the skills builder.',
+ },
+});
+
+export default messages;
diff --git a/src/skills/test/SkillsBuilder.test.jsx b/src/skills/test/SkillsBuilder.test.jsx
new file mode 100644
index 0000000..1d3c754
--- /dev/null
+++ b/src/skills/test/SkillsBuilder.test.jsx
@@ -0,0 +1,19 @@
+import { IntlProvider } from '@edx/frontend-platform/i18n';
+import { mount } from 'enzyme';
+import React from 'react';
+import SkillsBuilder from '../SkillsBuilder';
+
+const SkillsBuilderWrapper = () => (
+
+
+
+);
+
+describe('skills-builder', () => {
+ it('should render a Skills Builder modal', () => {
+ const component = ;
+ const wrapper = mount(component);
+ const modal = wrapper.find(SkillsBuilder);
+ expect(modal.find('h2').text()).toBe('Skills Builder');
+ });
+});