diff --git a/src/components/helpers/LocalizedTexts/LocalizedTexts.js b/src/components/helpers/LocalizedTexts/LocalizedTexts.js
index c0c066c88..153c4b060 100644
--- a/src/components/helpers/LocalizedTexts/LocalizedTexts.js
+++ b/src/components/helpers/LocalizedTexts/LocalizedTexts.js
@@ -7,10 +7,11 @@ import ExternalLinkPreview from '../ExternalLinkPreview';
import Icon from '../../icons';
import Markdown from '../../widgets/Markdown';
import { knownLocales } from '../../../helpers/localizedData';
+import { UrlContext } from '../../../helpers/contexts';
import './LocalizedTexts.css';
-const LocalizedTexts = ({ locales = [], noLocalesMessage = null }, { lang = 'en' }) => {
+const LocalizedTexts = ({ locales = [], noLocalesMessage = null }) => {
const localeTabs = knownLocales
.map(locale => locales.find(l => l.locale === locale))
.filter(tabData => tabData && (tabData.text || tabData.link || tabData.studentHint));
@@ -20,62 +21,62 @@ const LocalizedTexts = ({ locales = [], noLocalesMessage = null }, { lang = 'en'
}
return (
- locale === lang) || localeTabs.length === 0 ? lang : localeTabs[0].locale
- }
- className="nav-tabs-custom"
- id="localized-texts">
- {localeTabs.map(({ locale, text, link = '', studentHint = null }, i) => (
-
- {link && link !== '' && (
-
- )}
+
+ {({ lang = 'en' }) => (
+ locale === lang) || localeTabs.length === 0 ? lang : localeTabs[0].locale
+ }
+ className="nav-tabs-custom"
+ id="localized-texts">
+ {localeTabs.map(({ locale, text, link = '', studentHint = null }, i) => (
+
+ {link && link !== '' && (
+
+ )}
- {text.trim() !== '' && }
+ {text.trim() !== '' && }
- {!text.trim() && !link && (
-
-
-
- )}
+ {!text.trim() && !link && (
+
+
+
+ )}
- {studentHint && studentHint !== '' && (
-
-
-
-
-
-
-
- )}
-
- ))}
-
+ {studentHint && studentHint !== '' && (
+
+
+
+
+
+
+
+ )}
+
+ ))}
+
+ )}
+
);
};
-LocalizedTexts.contextTypes = {
- lang: PropTypes.string,
-};
-
LocalizedTexts.propTypes = {
locales: PropTypes.arrayOf(
PropTypes.shape({
diff --git a/src/components/layout/Sidebar/Sidebar.js b/src/components/layout/Sidebar/Sidebar.js
index aff04af17..8e69db795 100644
--- a/src/components/layout/Sidebar/Sidebar.js
+++ b/src/components/layout/Sidebar/Sidebar.js
@@ -16,6 +16,7 @@ import { isSupervisorRole, isEmpoweredSupervisorRole, isSuperadminRole } from '.
import withLinks from '../../../helpers/withLinks';
import { getExternalIdForCAS } from '../../../helpers/cas';
import { safeGet, EMPTY_OBJ } from '../../../helpers/common';
+import { UrlContext } from '../../../helpers/contexts';
import styles from './sidebar.less';
@@ -112,31 +113,44 @@ const Sidebar = (
))}
{studentOfItems && (
- }
- items={studentOfItems}
- notifications={EMPTY_OBJ}
- icon={'user-circle'}
- currentPath={currentUrl}
- createLink={createLink}
- forceOpen={false}
- isActive={studentOfItems.find(item => isActive(createLink(item))) !== undefined}
- />
+
+ {({ isActive }) => (
+
+ }
+ items={studentOfItems}
+ notifications={EMPTY_OBJ}
+ icon={'user-circle'}
+ currentPath={currentUrl}
+ createLink={createLink}
+ forceOpen={false}
+ isActive={studentOfItems.find(item => isActive(createLink(item))) !== undefined}
+ />
+ )}
+
)}
{isSupervisorRole(role) && supervisorOfItems && (
-
- }
- notifications={EMPTY_OBJ}
- items={supervisorOfItems}
- icon="graduation-cap"
- currentPath={currentUrl}
- createLink={createLink}
- forceOpen={false}
- isActive={supervisorOfItems.find(item => isActive(createLink(item))) !== undefined}
- />
+
+ {({ isActive }) => (
+
+ }
+ notifications={EMPTY_OBJ}
+ items={supervisorOfItems}
+ icon="graduation-cap"
+ currentPath={currentUrl}
+ createLink={createLink}
+ forceOpen={false}
+ isActive={supervisorOfItems.find(item => isActive(createLink(item))) !== undefined}
+ />
+ )}
+
)}
{isSupervisorRole(role) && (
@@ -200,8 +214,4 @@ Sidebar.propTypes = {
intl: intlShape,
};
-Sidebar.contextTypes = {
- isActive: PropTypes.func,
-};
-
export default withLinks(injectIntl(Sidebar));
diff --git a/src/components/widgets/Sidebar/MenuItem/MenuItem.js b/src/components/widgets/Sidebar/MenuItem/MenuItem.js
index e56f59c10..4da27b9fb 100644
--- a/src/components/widgets/Sidebar/MenuItem/MenuItem.js
+++ b/src/components/widgets/Sidebar/MenuItem/MenuItem.js
@@ -2,39 +2,42 @@ import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Link } from 'react-router';
+
import Icon from '../../../icons';
+import { UrlContext } from '../../../../helpers/contexts';
-const MenuItem = (
- {
- title,
- icon = 'circle',
- link,
- currentPath,
- notificationsCount = 0,
- inNewTab = false,
- small = false,
- onIsActive = isActive => isActive,
- },
- { isActive }
-) => (
-
-
-
-
- {title}
-
- {notificationsCount > 0 && {notificationsCount}}
-
-
+const MenuItem = ({
+ title,
+ icon = 'circle',
+ link,
+ currentPath,
+ notificationsCount = 0,
+ inNewTab = false,
+ small = false,
+ onIsActive = isActive => isActive,
+}) => (
+
+ {({ isActive }) => (
+
+
+
+
+ {title}
+
+ {notificationsCount > 0 && {notificationsCount}}
+
+
+ )}
+
);
MenuItem.propTypes = {
@@ -48,8 +51,4 @@ MenuItem.propTypes = {
onIsActive: PropTypes.func,
};
-MenuItem.contextTypes = {
- isActive: PropTypes.func,
-};
-
export default MenuItem;
diff --git a/src/containers/LayoutContainer/LayoutContainer.js b/src/containers/LayoutContainer/LayoutContainer.js
index 40cf63489..0c52a9bfb 100644
--- a/src/containers/LayoutContainer/LayoutContainer.js
+++ b/src/containers/LayoutContainer/LayoutContainer.js
@@ -12,7 +12,7 @@ import { isLoggedIn } from '../../redux/selectors/auth';
import { getLoggedInUserSettings } from '../../redux/selectors/users';
import { messages, localeData, defaultLanguage } from '../../locales';
import { linksFactory, isAbsolute } from '../../links';
-import { UserSettingsContext } from '../../helpers/contexts';
+import { UserSettingsContext, LinksContext, UrlContext } from '../../helpers/contexts';
import 'admin-lte/dist/css/AdminLTE.min.css';
import 'admin-lte/dist/css/skins/_all-skins.min.css';
@@ -80,16 +80,6 @@ class LayoutContainer extends Component {
this.forceUpdate();
};
- /**
- * Child components should be able to access current language settings
- * and up-to-date links (with respect to the given language).
- */
- getChildContext = () => ({
- links: this.state.links,
- lang: this.state.lang,
- isActive: link => !isAbsolute(link) && this.context.router.isActive(link, true),
- });
-
maybeHideSidebar = e => {
const { sidebarIsOpen, toggleVisibility } = this.props;
if (sidebarIsOpen) {
@@ -122,37 +112,47 @@ class LayoutContainer extends Component {
userSettings,
} = this.props;
- const { lang } = this.state;
+ const { lang, links } = this.state;
addLocaleData([...this.getLocaleData(lang)]);
moment.locale(lang);
return (
-
- {children}
-
+
+ !isAbsolute(link) && this.context.router.isActive(link, true),
+ }}>
+
+ {children}
+
+
+
);
}
}
+/*
LayoutContainer.childContextTypes = {
lang: PropTypes.string,
links: PropTypes.object,
isActive: PropTypes.func,
};
+*/
LayoutContainer.contextTypes = {
router: PropTypes.object,
diff --git a/src/helpers/contexts.js b/src/helpers/contexts.js
index 613d7cf4e..ce6b03d28 100644
--- a/src/helpers/contexts.js
+++ b/src/helpers/contexts.js
@@ -1,3 +1,5 @@
import React from 'react';
export const UserSettingsContext = React.createContext({});
+export const LinksContext = React.createContext({});
+export const UrlContext = React.createContext({});
diff --git a/src/helpers/withLinks.js b/src/helpers/withLinks.js
index 9fc6a10f6..7f500f7e4 100644
--- a/src/helpers/withLinks.js
+++ b/src/helpers/withLinks.js
@@ -1,13 +1,12 @@
// @flow
import React from 'react';
-import PropTypes from 'prop-types';
+import { LinksContext } from '../helpers/contexts';
const withLinks = (Inner: *) => {
- const ComponentWithLinks = (props: any, { links }: { links: any }) => ;
+ const ComponentWithLinks = (props: any) => (
+ {links => }
+ );
ComponentWithLinks.displayName = `withLinks(${Inner.displayName || Inner.name || 'Component'})`;
- ComponentWithLinks.contextTypes = {
- links: PropTypes.object,
- };
ComponentWithLinks.WrappedComponent = Inner; // use the same name as react-redux
return ComponentWithLinks;
};
diff --git a/src/pages/Exercise/Exercise.js b/src/pages/Exercise/Exercise.js
index 59d68742f..99ce94a5b 100644
--- a/src/pages/Exercise/Exercise.js
+++ b/src/pages/Exercise/Exercise.js
@@ -284,10 +284,6 @@ class Exercise extends Component {
}
}
-Exercise.contextTypes = {
- links: PropTypes.object,
-};
-
Exercise.propTypes = {
userId: PropTypes.string.isRequired,
instance: ImmutablePropTypes.map,
diff --git a/src/pages/ExerciseAssignments/ExerciseAssignments.js b/src/pages/ExerciseAssignments/ExerciseAssignments.js
index c37402d36..d30157bc7 100644
--- a/src/pages/ExerciseAssignments/ExerciseAssignments.js
+++ b/src/pages/ExerciseAssignments/ExerciseAssignments.js
@@ -247,10 +247,6 @@ class ExerciseAssignments extends Component {
}
}
-ExerciseAssignments.contextTypes = {
- links: PropTypes.object,
-};
-
ExerciseAssignments.propTypes = {
userId: PropTypes.string.isRequired,
params: PropTypes.shape({