+
+ {fields.buttonText}
+
+ ) : null
+ }
+
+ );
+}
+
+ChallengesBlock.propTypes = {
+ baseUrl: PT.string.isRequired,
+ challenges: PT.arrayOf(PT.object).isRequired,
+ fields: PT.shape().isRequired,
+};
diff --git a/src/shared/components/ChallengesBlock/style.scss b/src/shared/components/Contentful/ChallengesBlock/style.scss
similarity index 65%
rename from src/shared/components/ChallengesBlock/style.scss
rename to src/shared/components/Contentful/ChallengesBlock/style.scss
index 7d4bd4af93..614c11e3be 100644
--- a/src/shared/components/ChallengesBlock/style.scss
+++ b/src/shared/components/Contentful/ChallengesBlock/style.scss
@@ -10,7 +10,6 @@
display: flex;
flex-wrap: wrap;
justify-content: space-between;
- margin-bottom: 40px;
@include xs-to-sm {
flex-direction: column;
@@ -22,3 +21,16 @@
margin-bottom: 40px;
}
+
+.control {
+ border: 0;
+ background: rgba(0, 0, 0, 0.4);
+ color: white;
+ padding: 10px;
+ cursor: pointer;
+ display: flex;
+}
+
+.multiContent {
+ width: 100%;
+}
diff --git a/src/shared/components/Contentful/Menu/index.jsx b/src/shared/components/Contentful/Menu/index.jsx
index 620c668314..18f40112ff 100644
--- a/src/shared/components/Contentful/Menu/index.jsx
+++ b/src/shared/components/Contentful/Menu/index.jsx
@@ -4,6 +4,7 @@
/* global window */
import _ from 'lodash';
import ContentfulLoader from 'containers/ContentfulLoader';
+import ContentfulMenuLoader from 'containers/Contentful/MenuLoader';
import LoadingIndicator from 'components/LoadingIndicator';
import PT from 'prop-types';
import React from 'react';
@@ -168,9 +169,24 @@ export default function ContentfulMenu(props) {
preview={preview}
spaceName={spaceName}
environment={environment}
- render={(data) => {
- const { fields } = Object.values(data.entries.items)[0];
+ render={(menuData) => {
+ const { fields } = Object.values(menuData.entries.items)[0];
if (!fields) return null;
+ if (fields.theme === 'General') {
+ // New navi style menu
+ // we deligate to special custom component and lib
+ return (
+ {fields.title}
+
+ {
+ challengesToRender.length > 2 ? (
+ (
+
+
+ ) : (
+ challengesToRender.map(challenge => (
+
+ {
+ fields.buttonText && fields.buttonUrl ? (
+
+
+ );
+ }
+ // no SSR for navi component yet
+ // TODO when ready
+ return null;
+ }
+}
+
+MenuLoaderContainer.defaultProps = {
+ preview: false,
+ spaceName: null,
+ environment: null,
+ menu: [],
+};
+
+MenuLoaderContainer.propTypes = {
+ id: PT.string.isRequired,
+ preview: PT.bool,
+ spaceName: PT.string,
+ environment: PT.string,
+ fields: PT.shape().isRequired,
+ auth: PT.shape().isRequired,
+ loadMenuData: PT.func.isRequired,
+ menu: PT.arrayOf(PT.shape()),
+ loading: PT.bool.isRequired,
+ menuLogo: PT.shape().isRequired,
+};
+
+function mapStateToProps(state, ownProps) {
+ return {
+ auth: state.auth || {},
+ menu: state.menuNavigation[ownProps.id] ? state.menuNavigation[ownProps.id].menu : [],
+ loading: state.menuNavigation[ownProps.id] ? state.menuNavigation[ownProps.id].loading : true,
+ menuLogo: state.menuNavigation[ownProps.id] ? state.menuNavigation[ownProps.id].menuLogo : {},
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ const a = actions.contentful;
+ return {
+ loadMenuData: (ownProps) => {
+ dispatch(a.getMenuInit(ownProps));
+ dispatch(a.getMenuDone(ownProps));
+ },
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(MenuLoaderContainer);
diff --git a/src/shared/reducers/contentful/challengesBlock.js b/src/shared/reducers/contentful/challengesBlock.js
new file mode 100644
index 0000000000..f86eb39138
--- /dev/null
+++ b/src/shared/reducers/contentful/challengesBlock.js
@@ -0,0 +1,54 @@
+/**
+ * Reducer for state.challengesBlock
+ */
+
+import actions from 'actions/contentful';
+import { handleActions } from 'redux-actions';
+
+/**
+ * Handles challengesBlock.getChallengesBlockInit action.
+ * @param {Object} state Previous state.
+ * @param {Object} action The action.
+ */
+function onGetChallengesBlockInit(state, action) {
+ return {
+ ...state,
+ [action.payload.id]: {
+ loading: true,
+ challenges: [],
+ fields: {},
+ },
+ };
+}
+
+/**
+ * Handles challengesBlock.getChallengesBlockDone action.
+ * @param {Object} state Previous state.
+ * @param {Object} action The action.
+ */
+function onGetChallengesBlockDone(state, action) {
+ return {
+ ...state,
+ [action.payload.id]: {
+ loading: false,
+ challenges: action.payload.challenges,
+ fields: action.payload.fields,
+ },
+ };
+}
+
+/**
+ * Creates challengesBlock reducer with the specified initial state.
+ * @param {Object} state Optional. If not given, the default one is
+ * generated automatically.
+ * @return {Function} Reducer.
+ */
+function create(state = {}) {
+ return handleActions({
+ [actions.contentful.getChallengesBlockInit]: onGetChallengesBlockInit,
+ [actions.contentful.getChallengesBlockDone]: onGetChallengesBlockDone,
+ }, state);
+}
+
+/* Reducer with the default initial state. */
+export default create();
diff --git a/src/shared/reducers/contentful/menuNavigation.js b/src/shared/reducers/contentful/menuNavigation.js
new file mode 100644
index 0000000000..0cefd4af88
--- /dev/null
+++ b/src/shared/reducers/contentful/menuNavigation.js
@@ -0,0 +1,54 @@
+/**
+ * Reducer for state.menuNavigation
+ */
+
+import actions from 'actions/contentful';
+import { handleActions } from 'redux-actions';
+
+/**
+ * Handles menuNavigation.getMenuInit action.
+ * @param {Object} state Previous state.
+ * @param {Object} action The action.
+ */
+function onGetMenuInit(state, action) {
+ return {
+ ...state,
+ [action.payload.id]: {
+ loading: true,
+ menu: [],
+ menuLogo: {},
+ },
+ };
+}
+
+/**
+ * Handles menuNavigation.getMenuDone action.
+ * @param {Object} state Previous state.
+ * @param {Object} action The action.
+ */
+function onGetMenuDone(state, action) {
+ return {
+ ...state,
+ [action.payload.id]: {
+ loading: false,
+ menu: action.payload.menu,
+ menuLogo: action.payload.menuLogo || {},
+ },
+ };
+}
+
+/**
+ * Creates challengesBlock reducer with the specified initial state.
+ * @param {Object} state Optional. If not given, the default one is
+ * generated automatically.
+ * @return {Function} Reducer.
+ */
+function create(state = {}) {
+ return handleActions({
+ [actions.contentful.getMenuInit]: onGetMenuInit,
+ [actions.contentful.getMenuDone]: onGetMenuDone,
+ }, state);
+}
+
+/* Reducer with the default initial state. */
+export default create();
diff --git a/src/shared/reducers/index.js b/src/shared/reducers/index.js
index 071be6b883..6b759c0c7c 100644
--- a/src/shared/reducers/index.js
+++ b/src/shared/reducers/index.js
@@ -25,6 +25,8 @@ import contentful from './contentful';
import topcoderHeader from './topcoder_header';
import rss from './rss';
import newsletterArchive from './newsletterArchive';
+import menuNavigation from './contentful/menuNavigation';
+import challengesBlock from './contentful/challengesBlock';
import { factory as challengeListingFactory } from './challenge-listing';
import { factory as examplesFactory } from './examples';
import { factory as pageFactory } from './page';
@@ -132,6 +134,8 @@ export function factory(req) {
rss,
toastr: toastrReducer,
newsletterArchive,
+ menuNavigation,
+ challengesBlock,
}));
}
diff --git a/src/shared/utils/contentful.js b/src/shared/utils/contentful.js
index afa8a2a7fd..93ce7cf368 100644
--- a/src/shared/utils/contentful.js
+++ b/src/shared/utils/contentful.js
@@ -83,4 +83,25 @@ export function linkText(item) {
|| item.fields.linkText /* NavigationMenuItem-only */ || item.fields.name;
}
+/**
+ * Builds navi menu items
+ * @param {String} baseUrl
+ * @param {Object} item
+ */
+export function menuItemBuilder(baseUrl, item) {
+ switch (item.sys.contentType.sys.id) {
+ case 'route':
+ return {
+ title: item.fields.naviMenuLinkText || item.fields.name,
+ href: target(baseUrl, item),
+ };
+ case 'navigationMenuItem':
+ return {
+ title: item.fields.linkText || item.fields.name,
+ href: target(baseUrl, item),
+ };
+ default: return {};
+ }
+}
+
export default undefined;