Compare commits
13 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
90351083aa | ||
|
|
6f75684ad9 | ||
|
|
a54f099d68 | ||
|
|
02d081dd26 | ||
|
|
468acc80f0 | ||
|
|
90fdd13fbc | ||
|
|
faf1b8522a | ||
|
|
e8a28b09bc | ||
|
|
c611df3f69 | ||
|
|
ab371f1c3a | ||
|
|
fb2002a004 | ||
|
|
f955ec4434 | ||
|
|
de9eb63b07 |
2
.gitignore
vendored
2
.gitignore
vendored
@@ -7,3 +7,5 @@ temp
|
||||
src/i18n/transifex_input.json
|
||||
module.config.js
|
||||
.idea/
|
||||
|
||||
.vscode
|
||||
|
||||
4
Makefile
4
Makefile
@@ -1,5 +1,5 @@
|
||||
transifex_resource = frontend-component-header
|
||||
transifex_langs = "ar,fr,fr_CA,es_419,zh_CN"
|
||||
transifex_langs = "ar,fr,es_419,zh_CN,pt,it,de,uk,ru,hi,fr_CA"
|
||||
|
||||
transifex_utils = ./node_modules/.bin/transifex-utils.js
|
||||
i18n = ./src/i18n
|
||||
@@ -50,7 +50,7 @@ push_translations:
|
||||
|
||||
# Pulls translations from Transifex.
|
||||
pull_translations:
|
||||
tx pull -f --mode reviewed --languages=$(transifex_langs)
|
||||
tx pull -t -f --mode reviewed --languages=$(transifex_langs)
|
||||
|
||||
# This target is used by Travis.
|
||||
validate-no-uncommitted-package-lock-changes:
|
||||
|
||||
98
package-lock.json
generated
98
package-lock.json
generated
@@ -23,7 +23,7 @@
|
||||
"@edx/frontend-build": "11.0.2",
|
||||
"@edx/frontend-platform": "2.6.2",
|
||||
"@edx/paragon": "19.25.3",
|
||||
"@testing-library/dom": "8.17.1",
|
||||
"@testing-library/dom": "8.18.1",
|
||||
"@testing-library/jest-dom": "5.16.5",
|
||||
"@testing-library/react": "10.4.9",
|
||||
"codecov": "3.8.3",
|
||||
@@ -31,12 +31,12 @@
|
||||
"enzyme-adapter-react-16": "1.15.6",
|
||||
"husky": "7.0.4",
|
||||
"jest": "28.1.3",
|
||||
"jest-chain": "1.1.5",
|
||||
"jest-chain": "1.1.6",
|
||||
"prop-types": "15.8.1",
|
||||
"react": "16.14.0",
|
||||
"react-dom": "16.14.0",
|
||||
"react-redux": "7.2.8",
|
||||
"react-router-dom": "5.3.3",
|
||||
"react-redux": "7.2.9",
|
||||
"react-router-dom": "5.3.4",
|
||||
"react-test-renderer": "16.14.0",
|
||||
"reactifex": "1.1.1",
|
||||
"redux": "4.2.0",
|
||||
@@ -5826,9 +5826,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@testing-library/dom": {
|
||||
"version": "8.17.1",
|
||||
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.17.1.tgz",
|
||||
"integrity": "sha512-KnH2MnJUzmFNPW6RIKfd+zf2Wue8mEKX0M3cpX6aKl5ZXrJM1/c/Pc8c2xDNYQCnJO48Sm5ITbMXgqTr3h4jxQ==",
|
||||
"version": "8.18.1",
|
||||
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.18.1.tgz",
|
||||
"integrity": "sha512-oEvsm2B/WtcHKE+IcEeeCqNU/ltFGaVyGbpcm4g/2ytuT49jrlH9x5qRKL/H3A6yfM4YAbSbC0ceT5+9CEXnLg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.10.4",
|
||||
@@ -15571,9 +15571,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/jest-chain": {
|
||||
"version": "1.1.5",
|
||||
"resolved": "https://registry.npmjs.org/jest-chain/-/jest-chain-1.1.5.tgz",
|
||||
"integrity": "sha512-bTx51vQP/6/XVDrMtz0WmT3wZoXvj5QAAnw1to+o6pvtjcwTIVuB6uR5URRXH/9rHf1WuM1UgsfVTWhTC/QAzw==",
|
||||
"version": "1.1.6",
|
||||
"resolved": "https://registry.npmjs.org/jest-chain/-/jest-chain-1.1.6.tgz",
|
||||
"integrity": "sha512-eIkGzVBGQ1VuEErDceMYAET53pcwYVVTXtJEbY+x60Dwi+2M2uOt4rhKAej+wfVOAlE4G0plI9mstmv6GBtJjw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/jest-changed-files": {
|
||||
@@ -19935,20 +19935,6 @@
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/mini-create-react-context": {
|
||||
"version": "0.4.1",
|
||||
"resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz",
|
||||
"integrity": "sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.1",
|
||||
"tiny-warning": "^1.0.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"prop-types": "^15.0.0",
|
||||
"react": "^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/mini-css-extract-plugin": {
|
||||
"version": "1.6.2",
|
||||
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.6.2.tgz",
|
||||
@@ -22844,9 +22830,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/react-redux": {
|
||||
"version": "7.2.8",
|
||||
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.8.tgz",
|
||||
"integrity": "sha512-6+uDjhs3PSIclqoCk0kd6iX74gzrGc3W5zcAjbrFgEdIjRSQObdIwfx80unTkVUYvbQ95Y8Av3OvFHq1w5EOUw==",
|
||||
"version": "7.2.9",
|
||||
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.9.tgz",
|
||||
"integrity": "sha512-Gx4L3uM182jEEayZfRbI/G11ZpYdNAnBs70lFVMNdHJI76XYtR+7m0MN+eAs7UHBPhWXcnFPaS+9owSCJQHNpQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.15.4",
|
||||
@@ -22960,16 +22946,15 @@
|
||||
}
|
||||
},
|
||||
"node_modules/react-router": {
|
||||
"version": "5.3.3",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.3.tgz",
|
||||
"integrity": "sha512-mzQGUvS3bM84TnbtMYR8ZjKnuPJ71IjSzR+DE6UkUqvN4czWIqEs17yLL8xkAycv4ev0AiN+IGrWu88vJs/p2w==",
|
||||
"version": "5.3.4",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz",
|
||||
"integrity": "sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.13",
|
||||
"history": "^4.9.0",
|
||||
"hoist-non-react-statics": "^3.1.0",
|
||||
"loose-envify": "^1.3.1",
|
||||
"mini-create-react-context": "^0.4.0",
|
||||
"path-to-regexp": "^1.7.0",
|
||||
"prop-types": "^15.6.2",
|
||||
"react-is": "^16.6.0",
|
||||
@@ -22981,16 +22966,16 @@
|
||||
}
|
||||
},
|
||||
"node_modules/react-router-dom": {
|
||||
"version": "5.3.3",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.3.tgz",
|
||||
"integrity": "sha512-Ov0tGPMBgqmbu5CDmN++tv2HQ9HlWDuWIIqn4b88gjlAN5IHI+4ZUZRcpz9Hl0azFIwihbLDYw1OiHGRo7ZIng==",
|
||||
"version": "5.3.4",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.4.tgz",
|
||||
"integrity": "sha512-m4EqFMHv/Ih4kpcBCONHbkT68KoAeHN4p3lAGoNryfHi0dMy0kCzEZakiKRsvg5wHZ/JLrLW8o8KomWiz/qbYQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.13",
|
||||
"history": "^4.9.0",
|
||||
"loose-envify": "^1.3.1",
|
||||
"prop-types": "^15.6.2",
|
||||
"react-router": "5.3.3",
|
||||
"react-router": "5.3.4",
|
||||
"tiny-invariant": "^1.0.2",
|
||||
"tiny-warning": "^1.0.0"
|
||||
},
|
||||
@@ -31806,9 +31791,9 @@
|
||||
}
|
||||
},
|
||||
"@testing-library/dom": {
|
||||
"version": "8.17.1",
|
||||
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.17.1.tgz",
|
||||
"integrity": "sha512-KnH2MnJUzmFNPW6RIKfd+zf2Wue8mEKX0M3cpX6aKl5ZXrJM1/c/Pc8c2xDNYQCnJO48Sm5ITbMXgqTr3h4jxQ==",
|
||||
"version": "8.18.1",
|
||||
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.18.1.tgz",
|
||||
"integrity": "sha512-oEvsm2B/WtcHKE+IcEeeCqNU/ltFGaVyGbpcm4g/2ytuT49jrlH9x5qRKL/H3A6yfM4YAbSbC0ceT5+9CEXnLg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/code-frame": "^7.10.4",
|
||||
@@ -39498,9 +39483,9 @@
|
||||
}
|
||||
},
|
||||
"jest-chain": {
|
||||
"version": "1.1.5",
|
||||
"resolved": "https://registry.npmjs.org/jest-chain/-/jest-chain-1.1.5.tgz",
|
||||
"integrity": "sha512-bTx51vQP/6/XVDrMtz0WmT3wZoXvj5QAAnw1to+o6pvtjcwTIVuB6uR5URRXH/9rHf1WuM1UgsfVTWhTC/QAzw==",
|
||||
"version": "1.1.6",
|
||||
"resolved": "https://registry.npmjs.org/jest-chain/-/jest-chain-1.1.6.tgz",
|
||||
"integrity": "sha512-eIkGzVBGQ1VuEErDceMYAET53pcwYVVTXtJEbY+x60Dwi+2M2uOt4rhKAej+wfVOAlE4G0plI9mstmv6GBtJjw==",
|
||||
"dev": true
|
||||
},
|
||||
"jest-changed-files": {
|
||||
@@ -42800,16 +42785,6 @@
|
||||
"integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
|
||||
"dev": true
|
||||
},
|
||||
"mini-create-react-context": {
|
||||
"version": "0.4.1",
|
||||
"resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz",
|
||||
"integrity": "sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.12.1",
|
||||
"tiny-warning": "^1.0.3"
|
||||
}
|
||||
},
|
||||
"mini-css-extract-plugin": {
|
||||
"version": "1.6.2",
|
||||
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.6.2.tgz",
|
||||
@@ -44928,9 +44903,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"react-redux": {
|
||||
"version": "7.2.8",
|
||||
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.8.tgz",
|
||||
"integrity": "sha512-6+uDjhs3PSIclqoCk0kd6iX74gzrGc3W5zcAjbrFgEdIjRSQObdIwfx80unTkVUYvbQ95Y8Av3OvFHq1w5EOUw==",
|
||||
"version": "7.2.9",
|
||||
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.9.tgz",
|
||||
"integrity": "sha512-Gx4L3uM182jEEayZfRbI/G11ZpYdNAnBs70lFVMNdHJI76XYtR+7m0MN+eAs7UHBPhWXcnFPaS+9owSCJQHNpQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.15.4",
|
||||
@@ -45006,16 +44981,15 @@
|
||||
}
|
||||
},
|
||||
"react-router": {
|
||||
"version": "5.3.3",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.3.tgz",
|
||||
"integrity": "sha512-mzQGUvS3bM84TnbtMYR8ZjKnuPJ71IjSzR+DE6UkUqvN4czWIqEs17yLL8xkAycv4ev0AiN+IGrWu88vJs/p2w==",
|
||||
"version": "5.3.4",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz",
|
||||
"integrity": "sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.12.13",
|
||||
"history": "^4.9.0",
|
||||
"hoist-non-react-statics": "^3.1.0",
|
||||
"loose-envify": "^1.3.1",
|
||||
"mini-create-react-context": "^0.4.0",
|
||||
"path-to-regexp": "^1.7.0",
|
||||
"prop-types": "^15.6.2",
|
||||
"react-is": "^16.6.0",
|
||||
@@ -45024,16 +44998,16 @@
|
||||
}
|
||||
},
|
||||
"react-router-dom": {
|
||||
"version": "5.3.3",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.3.tgz",
|
||||
"integrity": "sha512-Ov0tGPMBgqmbu5CDmN++tv2HQ9HlWDuWIIqn4b88gjlAN5IHI+4ZUZRcpz9Hl0azFIwihbLDYw1OiHGRo7ZIng==",
|
||||
"version": "5.3.4",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.4.tgz",
|
||||
"integrity": "sha512-m4EqFMHv/Ih4kpcBCONHbkT68KoAeHN4p3lAGoNryfHi0dMy0kCzEZakiKRsvg5wHZ/JLrLW8o8KomWiz/qbYQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.12.13",
|
||||
"history": "^4.9.0",
|
||||
"loose-envify": "^1.3.1",
|
||||
"prop-types": "^15.6.2",
|
||||
"react-router": "5.3.3",
|
||||
"react-router": "5.3.4",
|
||||
"tiny-invariant": "^1.0.2",
|
||||
"tiny-warning": "^1.0.0"
|
||||
}
|
||||
|
||||
@@ -44,16 +44,16 @@
|
||||
"prop-types": "15.8.1",
|
||||
"react": "16.14.0",
|
||||
"react-dom": "16.14.0",
|
||||
"react-redux": "7.2.8",
|
||||
"react-router-dom": "5.3.3",
|
||||
"react-redux": "7.2.9",
|
||||
"react-router-dom": "5.3.4",
|
||||
"react-test-renderer": "16.14.0",
|
||||
"reactifex": "1.1.1",
|
||||
"redux": "4.2.0",
|
||||
"redux-saga": "1.1.3",
|
||||
"@testing-library/dom": "8.17.1",
|
||||
"@testing-library/dom": "8.18.1",
|
||||
"@testing-library/jest-dom": "5.16.5",
|
||||
"jest": "28.1.3",
|
||||
"jest-chain": "1.1.5",
|
||||
"jest-chain": "1.1.6",
|
||||
"@testing-library/react": "10.4.9"
|
||||
},
|
||||
"dependencies": {
|
||||
|
||||
@@ -5,11 +5,17 @@ import { AppContext } from '@edx/frontend-platform/react';
|
||||
import {
|
||||
APP_CONFIG_INITIALIZED,
|
||||
ensureConfig,
|
||||
getConfig,
|
||||
mergeConfig,
|
||||
subscribe,
|
||||
} from '@edx/frontend-platform';
|
||||
import { ActionRow } from '@edx/paragon';
|
||||
|
||||
import DesktopHeader from './DesktopHeader';
|
||||
import { Menu, MenuTrigger, MenuContent } from './Menu';
|
||||
import Avatar from './Avatar';
|
||||
import { LinkedLogo, Logo } from './Logo';
|
||||
|
||||
import { CaretIcon } from './Icons';
|
||||
|
||||
import messages from './Header.messages';
|
||||
|
||||
@@ -28,7 +34,124 @@ subscribe(APP_CONFIG_INITIALIZED, () => {
|
||||
}, 'StudioHeader additional config');
|
||||
});
|
||||
|
||||
function StudioHeader({ intl, mainMenu, appMenu }) {
|
||||
class StudioDesktopHeaderBase extends React.Component {
|
||||
constructor(props) { // eslint-disable-line no-useless-constructor
|
||||
super(props);
|
||||
}
|
||||
|
||||
renderUserMenu() {
|
||||
const {
|
||||
userMenu,
|
||||
avatar,
|
||||
username,
|
||||
intl,
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<Menu transitionClassName="menu-dropdown" transitionTimeout={250}>
|
||||
<MenuTrigger
|
||||
tag="button"
|
||||
aria-label={intl.formatMessage(messages['header.label.account.menu.for'], { username })}
|
||||
className="btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
|
||||
>
|
||||
<Avatar size="1.5em" src={avatar} alt="" className="mr-2" />
|
||||
{username} <CaretIcon role="img" aria-hidden focusable="false" />
|
||||
</MenuTrigger>
|
||||
<MenuContent className="mb-0 dropdown-menu show dropdown-menu-right pin-right shadow py-2">
|
||||
{userMenu.map(({ type, href, content }) => (
|
||||
<a className={`dropdown-${type}`} key={`${type}-${content}`} href={href}>{content}</a>
|
||||
))}
|
||||
</MenuContent>
|
||||
</Menu>
|
||||
);
|
||||
}
|
||||
|
||||
renderLoggedOutItems() {
|
||||
const { loggedOutItems } = this.props;
|
||||
|
||||
return loggedOutItems.map((item, i, arr) => (
|
||||
<a
|
||||
key={`${item.type}-${item.content}`}
|
||||
className={i < arr.length - 1 ? 'btn mr-2 btn-link' : 'btn mr-2 btn-outline-primary'}
|
||||
href={item.href}
|
||||
>
|
||||
{item.content}
|
||||
</a>
|
||||
));
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
logo,
|
||||
logoAltText,
|
||||
logoDestination,
|
||||
loggedIn,
|
||||
intl,
|
||||
actionRowContent,
|
||||
} = this.props;
|
||||
const logoProps = { src: logo, alt: logoAltText, href: logoDestination };
|
||||
const logoClasses = getConfig().AUTHN_MINIMAL_HEADER ? 'mw-100' : null;
|
||||
|
||||
return (
|
||||
<header className="site-header-desktop">
|
||||
<a className="nav-skip sr-only sr-only-focusable" href="#main">{intl.formatMessage(messages['header.label.skip.nav'])}</a>
|
||||
<div className={`container-fluid ${logoClasses}`}>
|
||||
<div className="nav-container position-relative d-flex align-items-center">
|
||||
{logoDestination === null ? <Logo className="logo" src={logo} alt={logoAltText} /> : <LinkedLogo className="logo" {...logoProps} />}
|
||||
<ActionRow>
|
||||
{actionRowContent}
|
||||
<nav
|
||||
aria-label={intl.formatMessage(messages['header.label.secondary.nav'])}
|
||||
className="nav secondary-menu-container align-items-center ml-auto"
|
||||
>
|
||||
{loggedIn ? this.renderUserMenu() : this.renderLoggedOutItems()}
|
||||
</nav>
|
||||
</ActionRow>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
StudioDesktopHeaderBase.propTypes = {
|
||||
userMenu: PropTypes.arrayOf(PropTypes.shape({
|
||||
type: PropTypes.oneOf(['item', 'menu']),
|
||||
href: PropTypes.string,
|
||||
content: PropTypes.string,
|
||||
})),
|
||||
loggedOutItems: PropTypes.arrayOf(PropTypes.shape({
|
||||
type: PropTypes.oneOf(['item', 'menu']),
|
||||
href: PropTypes.string,
|
||||
content: PropTypes.string,
|
||||
})),
|
||||
logo: PropTypes.string,
|
||||
logoAltText: PropTypes.string,
|
||||
logoDestination: PropTypes.string,
|
||||
avatar: PropTypes.string,
|
||||
username: PropTypes.string,
|
||||
loggedIn: PropTypes.bool,
|
||||
actionRowContent: PropTypes.element,
|
||||
|
||||
// i18n
|
||||
intl: intlShape.isRequired,
|
||||
};
|
||||
|
||||
StudioDesktopHeaderBase.defaultProps = {
|
||||
userMenu: [],
|
||||
loggedOutItems: [],
|
||||
logo: null,
|
||||
logoAltText: null,
|
||||
logoDestination: null,
|
||||
avatar: null,
|
||||
username: null,
|
||||
loggedIn: false,
|
||||
actionRowContent: null,
|
||||
};
|
||||
|
||||
const StudioDesktopHeader = injectIntl(StudioDesktopHeaderBase);
|
||||
|
||||
function StudioHeader({ intl, actionRowContent }) {
|
||||
const { authenticatedUser, config } = useContext(AppContext);
|
||||
|
||||
const userMenu = authenticatedUser === null ? [] : [
|
||||
@@ -56,44 +179,21 @@ function StudioHeader({ intl, mainMenu, appMenu }) {
|
||||
loggedIn: authenticatedUser !== null,
|
||||
username: authenticatedUser !== null ? authenticatedUser.username : null,
|
||||
avatar: authenticatedUser !== null ? authenticatedUser.avatar : null,
|
||||
mainMenu,
|
||||
actionRowContent,
|
||||
userMenu,
|
||||
appMenu,
|
||||
loggedOutItems: [],
|
||||
};
|
||||
|
||||
return <DesktopHeader {...props} />;
|
||||
return <StudioDesktopHeader {...props} />;
|
||||
}
|
||||
|
||||
StudioHeader.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
appMenu: PropTypes.shape(
|
||||
{
|
||||
content: PropTypes.string,
|
||||
href: PropTypes.string,
|
||||
menuItems: PropTypes.arrayOf(
|
||||
PropTypes.shape({
|
||||
type: PropTypes.string,
|
||||
href: PropTypes.string,
|
||||
content: PropTypes.string,
|
||||
}),
|
||||
),
|
||||
},
|
||||
),
|
||||
mainMenu: PropTypes.arrayOf(
|
||||
PropTypes.shape(
|
||||
{
|
||||
type: PropTypes.string,
|
||||
href: PropTypes.string,
|
||||
content: PropTypes.string,
|
||||
},
|
||||
),
|
||||
),
|
||||
actionRowContent: PropTypes.element,
|
||||
};
|
||||
|
||||
StudioHeader.defaultProps = {
|
||||
appMenu: null,
|
||||
mainMenu: [],
|
||||
actionRowContent: <></>,
|
||||
};
|
||||
|
||||
export default injectIntl(StudioHeader);
|
||||
|
||||
@@ -1,7 +1,13 @@
|
||||
import React from 'react';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import TestRenderer from 'react-test-renderer';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { AppContext } from '@edx/frontend-platform/react';
|
||||
import {
|
||||
ActionRow,
|
||||
Button,
|
||||
Dropdown,
|
||||
} from '@edx/paragon';
|
||||
|
||||
import { StudioHeader } from './index';
|
||||
|
||||
@@ -36,74 +42,31 @@ describe('<StudioHeader />', () => {
|
||||
expect(wrapper.toJSON()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders correctly with the optional app menu', () => {
|
||||
const appMenu = {
|
||||
content: 'App Menu',
|
||||
menuItems: [
|
||||
{
|
||||
type: 'dropdown',
|
||||
href: 'https://menu-href-url.org',
|
||||
content: 'Content 1',
|
||||
},
|
||||
{
|
||||
type: 'dropdown',
|
||||
href: 'https://menu-href-url.org',
|
||||
content: 'Content 2',
|
||||
},
|
||||
{
|
||||
type: 'dropdown',
|
||||
href: 'https://menu-href-url.org',
|
||||
content: 'Content 3',
|
||||
},
|
||||
],
|
||||
};
|
||||
const component = (
|
||||
<IntlProvider locale="en" messages={{}}>
|
||||
<AppContext.Provider
|
||||
value={{
|
||||
authenticatedUser: {
|
||||
userId: 'abc123',
|
||||
username: 'edX',
|
||||
roles: [],
|
||||
administrator: false,
|
||||
},
|
||||
config: {
|
||||
STUDIO_BASE_URL: process.env.STUDIO_BASE_URL,
|
||||
SITE_NAME: process.env.SITE_NAME,
|
||||
LOGIN_URL: process.env.LOGIN_URL,
|
||||
LOGOUT_URL: process.env.LOGOUT_URL,
|
||||
LOGO_URL: process.env.LOGO_URL,
|
||||
},
|
||||
}}
|
||||
>
|
||||
<StudioHeader appMenu={appMenu} />
|
||||
</AppContext.Provider>
|
||||
</IntlProvider>
|
||||
it('renders correctly with optional action row content', () => {
|
||||
const actionRowContent = (
|
||||
<>
|
||||
<Dropdown>
|
||||
<Dropdown.Toggle variant="outline-primary" id="library-header-menu-dropdown">
|
||||
Settings
|
||||
</Dropdown.Toggle>
|
||||
<Dropdown.Menu>
|
||||
<Dropdown.Item as={Link} to="#">Dropdown Item 1</Dropdown.Item>
|
||||
<Dropdown.Item as={Link} to="#">Dropdown Item 2</Dropdown.Item>
|
||||
<Dropdown.Item as={Link} to="#">Dropdown Item 3</Dropdown.Item>
|
||||
</Dropdown.Menu>
|
||||
</Dropdown>
|
||||
<ActionRow.Spacer />
|
||||
<Button
|
||||
variant="tertiary"
|
||||
href="#"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
title="Help Button"
|
||||
>Help
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
|
||||
const wrapper = TestRenderer.create(component);
|
||||
|
||||
expect(wrapper.toJSON()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders correctly with the optional main menu', () => {
|
||||
const mainMenu = [
|
||||
{
|
||||
type: 'dropdown',
|
||||
href: 'https://menu-href-url.org',
|
||||
content: 'Content 1',
|
||||
},
|
||||
{
|
||||
type: 'dropdown',
|
||||
href: 'https://menu-href-url.org',
|
||||
content: 'Content 2',
|
||||
},
|
||||
{
|
||||
type: 'dropdown',
|
||||
href: 'https://menu-href-url.org',
|
||||
content: 'Content 3',
|
||||
},
|
||||
];
|
||||
const component = (
|
||||
<IntlProvider locale="en" messages={{}}>
|
||||
<AppContext.Provider
|
||||
@@ -123,7 +86,7 @@ describe('<StudioHeader />', () => {
|
||||
},
|
||||
}}
|
||||
>
|
||||
<StudioHeader mainMenu={mainMenu} />
|
||||
<StudioHeader actionRowContent={actionRowContent} />
|
||||
</AppContext.Provider>
|
||||
</IntlProvider>
|
||||
);
|
||||
|
||||
@@ -21,83 +21,83 @@ exports[`<StudioHeader /> renders correctly 1`] = `
|
||||
className="logo"
|
||||
src="https://edx-cdn.org/v3/default/logo.svg"
|
||||
/>
|
||||
<nav
|
||||
aria-label="Main"
|
||||
className="nav main-nav"
|
||||
/>
|
||||
<nav
|
||||
aria-label="Secondary"
|
||||
className="nav secondary-menu-container align-items-center ml-auto"
|
||||
<div
|
||||
className="pgn__action-row"
|
||||
>
|
||||
<div
|
||||
className="menu null"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
<nav
|
||||
aria-label="Secondary"
|
||||
className="nav secondary-menu-container align-items-center ml-auto"
|
||||
>
|
||||
<button
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
aria-label="Account menu for edX"
|
||||
className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
|
||||
onClick={[Function]}
|
||||
<div
|
||||
className="menu null"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<span
|
||||
className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
<button
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
aria-label="Account menu for edX"
|
||||
className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="24px"
|
||||
role="img"
|
||||
<span
|
||||
className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="24px"
|
||||
role="img"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
version="1.1"
|
||||
viewBox="0 0 24 24"
|
||||
width="24px"
|
||||
>
|
||||
<path
|
||||
d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
edX
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 24 24"
|
||||
width="24px"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
edX
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
`;
|
||||
|
||||
exports[`<StudioHeader /> renders correctly with the optional app menu 1`] = `
|
||||
exports[`<StudioHeader /> renders correctly with optional action row content 1`] = `
|
||||
<header
|
||||
className="site-header-desktop"
|
||||
>
|
||||
@@ -118,307 +118,108 @@ exports[`<StudioHeader /> renders correctly with the optional app menu 1`] = `
|
||||
className="logo"
|
||||
src="https://edx-cdn.org/v3/default/logo.svg"
|
||||
/>
|
||||
<nav
|
||||
aria-label="Main"
|
||||
className="nav main-nav"
|
||||
/>
|
||||
<nav
|
||||
aria-label="App"
|
||||
className="nav app-nav"
|
||||
<div
|
||||
className="pgn__action-row"
|
||||
>
|
||||
<div
|
||||
className="menu null"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<a
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
className="menu-trigger nav-link d-inline-flex align-items-center"
|
||||
onClick={[Function]}
|
||||
>
|
||||
App Menu
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
<nav
|
||||
aria-label="Secondary"
|
||||
className="nav secondary-menu-container align-items-center ml-auto"
|
||||
>
|
||||
<div
|
||||
className="menu null"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
className="dropdown"
|
||||
data-testid="dropdown"
|
||||
>
|
||||
<button
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
aria-label="Account menu for edX"
|
||||
className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
|
||||
aria-haspopup={true}
|
||||
className="dropdown-toggle btn btn-outline-primary"
|
||||
disabled={false}
|
||||
id="library-header-menu-dropdown"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
Settings
|
||||
</button>
|
||||
</div>
|
||||
<span
|
||||
className="pgn__action-row-spacer"
|
||||
/>
|
||||
<a
|
||||
className="btn btn-tertiary"
|
||||
href="#"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
rel="noopener noreferrer"
|
||||
role="button"
|
||||
target="_blank"
|
||||
title="Help Button"
|
||||
>
|
||||
Help
|
||||
</a>
|
||||
<nav
|
||||
aria-label="Secondary"
|
||||
className="nav secondary-menu-container align-items-center ml-auto"
|
||||
>
|
||||
<div
|
||||
className="menu null"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<button
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
aria-label="Account menu for edX"
|
||||
className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="24px"
|
||||
role="img"
|
||||
<span
|
||||
className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
version="1.1"
|
||||
viewBox="0 0 24 24"
|
||||
width="24px"
|
||||
>
|
||||
<path
|
||||
d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
edX
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
`;
|
||||
|
||||
exports[`<StudioHeader /> renders correctly with the optional main menu 1`] = `
|
||||
<header
|
||||
className="site-header-desktop"
|
||||
>
|
||||
<a
|
||||
className="nav-skip sr-only sr-only-focusable"
|
||||
href="#main"
|
||||
>
|
||||
Skip to main content
|
||||
</a>
|
||||
<div
|
||||
className="container-fluid null"
|
||||
>
|
||||
<div
|
||||
className="nav-container position-relative d-flex align-items-center"
|
||||
>
|
||||
<img
|
||||
alt="edX"
|
||||
className="logo"
|
||||
src="https://edx-cdn.org/v3/default/logo.svg"
|
||||
/>
|
||||
<nav
|
||||
aria-label="Main"
|
||||
className="nav main-nav"
|
||||
>
|
||||
<div
|
||||
className="menu nav-item"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<a
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
className="menu-trigger nav-link d-inline-flex align-items-center"
|
||||
href="https://menu-href-url.org"
|
||||
onClick={[Function]}
|
||||
>
|
||||
Content 1
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
className="menu nav-item"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<a
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
className="menu-trigger nav-link d-inline-flex align-items-center"
|
||||
href="https://menu-href-url.org"
|
||||
onClick={[Function]}
|
||||
>
|
||||
Content 2
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
className="menu nav-item"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<a
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
className="menu-trigger nav-link d-inline-flex align-items-center"
|
||||
href="https://menu-href-url.org"
|
||||
onClick={[Function]}
|
||||
>
|
||||
Content 3
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
<nav
|
||||
aria-label="Secondary"
|
||||
className="nav secondary-menu-container align-items-center ml-auto"
|
||||
>
|
||||
<div
|
||||
className="menu null"
|
||||
onKeyDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
>
|
||||
<button
|
||||
aria-expanded={false}
|
||||
aria-haspopup="menu"
|
||||
aria-label="Account menu for edX"
|
||||
className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<span
|
||||
className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="24px"
|
||||
role="img"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
version="1.1"
|
||||
viewBox="0 0 24 24"
|
||||
width="24px"
|
||||
>
|
||||
<path
|
||||
d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
edX
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="24px"
|
||||
height="16px"
|
||||
role="img"
|
||||
style={
|
||||
Object {
|
||||
"height": "1.5em",
|
||||
"width": "1.5em",
|
||||
}
|
||||
}
|
||||
version="1.1"
|
||||
viewBox="0 0 24 24"
|
||||
width="24px"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
edX
|
||||
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
focusable="false"
|
||||
height="16px"
|
||||
role="img"
|
||||
version="1.1"
|
||||
viewBox="0 0 16 16"
|
||||
width="16px"
|
||||
>
|
||||
<path
|
||||
d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
|
||||
fill="currentColor"
|
||||
transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
@@ -1,34 +1,28 @@
|
||||
import arMessages from './messages/ar.json';
|
||||
|
||||
import caMessages from './messages/ca.json';
|
||||
import heMessages from './messages/he.json';
|
||||
import idMessages from './messages/id.json';
|
||||
import plMessages from './messages/pl.json';
|
||||
import ruMessages from './messages/ru.json';
|
||||
import thMessages from './messages/th.json';
|
||||
import ukMessages from './messages/uk.json';
|
||||
|
||||
// no need to import en messages-- they are in the defaultMessage field
|
||||
import es419Messages from './messages/es_419.json';
|
||||
import frMessages from './messages/fr.json';
|
||||
import kokrMessages from './messages/ko_KR.json';
|
||||
import ptbrMessages from './messages/pt_BR.json';
|
||||
import es419Messages from './messages/es_419.json';
|
||||
import zhcnMessages from './messages/zh_CN.json';
|
||||
import ptMessages from './messages/pt.json';
|
||||
import itMessages from './messages/it.json';
|
||||
import ukMessages from './messages/uk.json';
|
||||
import deMessages from './messages/de.json';
|
||||
import ruMessages from './messages/ru.json';
|
||||
import hiMessages from './messages/hi.json';
|
||||
import frCAMessages from './messages/fr_CA.json';
|
||||
// no need to import en messages-- they are in the defaultMessage field
|
||||
|
||||
const messages = {
|
||||
ar: arMessages,
|
||||
ca: caMessages,
|
||||
he: heMessages,
|
||||
id: idMessages,
|
||||
pl: plMessages,
|
||||
ru: ruMessages,
|
||||
th: thMessages,
|
||||
uk: ukMessages,
|
||||
'es-419': es419Messages,
|
||||
fr: frMessages,
|
||||
'zh-cn': zhcnMessages,
|
||||
'ko-kr': kokrMessages,
|
||||
'pt-br': ptbrMessages,
|
||||
pt: ptMessages,
|
||||
it: itMessages,
|
||||
de: deMessages,
|
||||
hi: hiMessages,
|
||||
'fr-ca': frCAMessages,
|
||||
ru: ruMessages,
|
||||
uk: ukMessages,
|
||||
};
|
||||
|
||||
export default messages;
|
||||
|
||||
@@ -1,33 +1,33 @@
|
||||
{
|
||||
"general.register.sentenceCase": "التسجيل",
|
||||
"general.signIn.sentenceCase": "تسجيل الدخول",
|
||||
"header.links.courses": "مساقات",
|
||||
"header.links.programs": "برامج",
|
||||
"header.links.content.search": "استكشف الجديد",
|
||||
"header.links.schools": "المدارس والشركاء",
|
||||
"header.links.courses": "المساقات",
|
||||
"header.links.programs": "البرامج",
|
||||
"header.links.content.search": "اكتشف الجديد",
|
||||
"header.links.schools": "المدارس و الشركاء",
|
||||
"header.user.menu.dashboard": "لوحة المعلومات",
|
||||
"header.user.menu.profile": "الملف الشخصي",
|
||||
"header.user.menu.account.settings": "حساب",
|
||||
"header.user.menu.order.history": "سجل الطلبات",
|
||||
"header.user.menu.account.settings": "الحساب",
|
||||
"header.user.menu.order.history": "سجل الطلبيات",
|
||||
"header.user.menu.logout": "تسجيل الخروج",
|
||||
"header.user.menu.login": "تسجيل الدخول",
|
||||
"header.user.menu.register": "تسجيل ",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "حساب",
|
||||
"header.user.menu.register": "التسجيل",
|
||||
"header.user.menu.studio.home": "صفحة الاستوديو الرئيسية",
|
||||
"header.user.menu.studio.maintenance": "الصيانة",
|
||||
"header.label.account.nav": "الحساب",
|
||||
"header.label.account.menu": "قائمة الحساب",
|
||||
"header.label.account.menu.for": "قائمة الحساب للمستخدم {username}",
|
||||
"header.label.main.nav": "الرئيسية",
|
||||
"header.label.account.menu.for": "قائمة حساب المستخدم {username}",
|
||||
"header.label.main.nav": "القا|مة الرئيسية",
|
||||
"header.label.main.menu": "القائمة الرئيسية",
|
||||
"header.label.main.header": "الرئيسية",
|
||||
"header.label.secondary.nav": "فرعي",
|
||||
"header.label.secondary.nav": "القائمة الثانوية",
|
||||
"header.label.skip.nav": "التخطي إلى المحتوى الرئيسي",
|
||||
"header.label.app.nav": "App",
|
||||
"header.label.app.nav": "تطبيق",
|
||||
"header.menu.dashboard.label": "لوحة المعلومات",
|
||||
"header.help.label": "مساعدة",
|
||||
"header.help.label": "المساعدة",
|
||||
"header.menu.profile.label": "الملف الشخصي",
|
||||
"header.menu.account.label": "حساب",
|
||||
"header.menu.orderHistory.label": "سجل الطلبات",
|
||||
"header.menu.account.label": "الحساب",
|
||||
"header.menu.orderHistory.label": "سجل الطلبيات",
|
||||
"header.navigation.skipNavLink": "التخطي إلى المحتوى الرئيسي",
|
||||
"header.menu.signOut.label": "تسجيل الخروج"
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
{}
|
||||
33
src/i18n/messages/de.json
Normal file
33
src/i18n/messages/de.json
Normal file
@@ -0,0 +1,33 @@
|
||||
{
|
||||
"general.register.sentenceCase": "Register",
|
||||
"general.signIn.sentenceCase": "Sign in",
|
||||
"header.links.courses": "Courses",
|
||||
"header.links.programs": "Programs",
|
||||
"header.links.content.search": "Discover New",
|
||||
"header.links.schools": "Schools & Partners",
|
||||
"header.user.menu.dashboard": "Dashboard",
|
||||
"header.user.menu.profile": "Profile",
|
||||
"header.user.menu.account.settings": "Account",
|
||||
"header.user.menu.order.history": "Order History",
|
||||
"header.user.menu.logout": "Logout",
|
||||
"header.user.menu.login": "Login",
|
||||
"header.user.menu.register": "Sign Up",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "Account",
|
||||
"header.label.account.menu": "Account Menu",
|
||||
"header.label.account.menu.for": "Account menu for {username}",
|
||||
"header.label.main.nav": "Main",
|
||||
"header.label.main.menu": "Main Menu",
|
||||
"header.label.main.header": "Main",
|
||||
"header.label.secondary.nav": "Secondary",
|
||||
"header.label.skip.nav": "Skip to main content",
|
||||
"header.label.app.nav": "App",
|
||||
"header.menu.dashboard.label": "Dashboard",
|
||||
"header.help.label": "Help",
|
||||
"header.menu.profile.label": "Profile",
|
||||
"header.menu.account.label": "Account",
|
||||
"header.menu.orderHistory.label": "Order History",
|
||||
"header.navigation.skipNavLink": "Skip to main content.",
|
||||
"header.menu.signOut.label": "Sign Out"
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
{}
|
||||
33
src/i18n/messages/hi.json
Normal file
33
src/i18n/messages/hi.json
Normal file
@@ -0,0 +1,33 @@
|
||||
{
|
||||
"general.register.sentenceCase": "Register",
|
||||
"general.signIn.sentenceCase": "Sign in",
|
||||
"header.links.courses": "Courses",
|
||||
"header.links.programs": "Programs",
|
||||
"header.links.content.search": "Discover New",
|
||||
"header.links.schools": "Schools & Partners",
|
||||
"header.user.menu.dashboard": "Dashboard",
|
||||
"header.user.menu.profile": "Profile",
|
||||
"header.user.menu.account.settings": "Account",
|
||||
"header.user.menu.order.history": "Order History",
|
||||
"header.user.menu.logout": "Logout",
|
||||
"header.user.menu.login": "Login",
|
||||
"header.user.menu.register": "Sign Up",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "Account",
|
||||
"header.label.account.menu": "Account Menu",
|
||||
"header.label.account.menu.for": "Account menu for {username}",
|
||||
"header.label.main.nav": "Main",
|
||||
"header.label.main.menu": "Main Menu",
|
||||
"header.label.main.header": "Main",
|
||||
"header.label.secondary.nav": "Secondary",
|
||||
"header.label.skip.nav": "Skip to main content",
|
||||
"header.label.app.nav": "App",
|
||||
"header.menu.dashboard.label": "Dashboard",
|
||||
"header.help.label": "Help",
|
||||
"header.menu.profile.label": "Profile",
|
||||
"header.menu.account.label": "Account",
|
||||
"header.menu.orderHistory.label": "Order History",
|
||||
"header.navigation.skipNavLink": "Skip to main content.",
|
||||
"header.menu.signOut.label": "Sign Out"
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
{}
|
||||
33
src/i18n/messages/it.json
Normal file
33
src/i18n/messages/it.json
Normal file
@@ -0,0 +1,33 @@
|
||||
{
|
||||
"general.register.sentenceCase": "Register",
|
||||
"general.signIn.sentenceCase": "Sign in",
|
||||
"header.links.courses": "Courses",
|
||||
"header.links.programs": "Programs",
|
||||
"header.links.content.search": "Discover New",
|
||||
"header.links.schools": "Schools & Partners",
|
||||
"header.user.menu.dashboard": "Dashboard",
|
||||
"header.user.menu.profile": "Profile",
|
||||
"header.user.menu.account.settings": "Account",
|
||||
"header.user.menu.order.history": "Order History",
|
||||
"header.user.menu.logout": "Logout",
|
||||
"header.user.menu.login": "Login",
|
||||
"header.user.menu.register": "Sign Up",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "Account",
|
||||
"header.label.account.menu": "Account Menu",
|
||||
"header.label.account.menu.for": "Account menu for {username}",
|
||||
"header.label.main.nav": "Main",
|
||||
"header.label.main.menu": "Main Menu",
|
||||
"header.label.main.header": "Main",
|
||||
"header.label.secondary.nav": "Secondary",
|
||||
"header.label.skip.nav": "Skip to main content",
|
||||
"header.label.app.nav": "App",
|
||||
"header.menu.dashboard.label": "Dashboard",
|
||||
"header.help.label": "Help",
|
||||
"header.menu.profile.label": "Profile",
|
||||
"header.menu.account.label": "Account",
|
||||
"header.menu.orderHistory.label": "Order History",
|
||||
"header.navigation.skipNavLink": "Skip to main content.",
|
||||
"header.menu.signOut.label": "Sign Out"
|
||||
}
|
||||
@@ -1,2 +0,0 @@
|
||||
{
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
{}
|
||||
33
src/i18n/messages/pt.json
Normal file
33
src/i18n/messages/pt.json
Normal file
@@ -0,0 +1,33 @@
|
||||
{
|
||||
"general.register.sentenceCase": "Register",
|
||||
"general.signIn.sentenceCase": "Sign in",
|
||||
"header.links.courses": "Courses",
|
||||
"header.links.programs": "Programs",
|
||||
"header.links.content.search": "Discover New",
|
||||
"header.links.schools": "Schools & Partners",
|
||||
"header.user.menu.dashboard": "Dashboard",
|
||||
"header.user.menu.profile": "Profile",
|
||||
"header.user.menu.account.settings": "Account",
|
||||
"header.user.menu.order.history": "Order History",
|
||||
"header.user.menu.logout": "Logout",
|
||||
"header.user.menu.login": "Login",
|
||||
"header.user.menu.register": "Sign Up",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "Account",
|
||||
"header.label.account.menu": "Account Menu",
|
||||
"header.label.account.menu.for": "Account menu for {username}",
|
||||
"header.label.main.nav": "Main",
|
||||
"header.label.main.menu": "Main Menu",
|
||||
"header.label.main.header": "Main",
|
||||
"header.label.secondary.nav": "Secondary",
|
||||
"header.label.skip.nav": "Skip to main content",
|
||||
"header.label.app.nav": "App",
|
||||
"header.menu.dashboard.label": "Dashboard",
|
||||
"header.help.label": "Help",
|
||||
"header.menu.profile.label": "Profile",
|
||||
"header.menu.account.label": "Account",
|
||||
"header.menu.orderHistory.label": "Order History",
|
||||
"header.navigation.skipNavLink": "Skip to main content.",
|
||||
"header.menu.signOut.label": "Sign Out"
|
||||
}
|
||||
@@ -1,2 +0,0 @@
|
||||
{
|
||||
}
|
||||
@@ -1 +1,33 @@
|
||||
{}
|
||||
{
|
||||
"general.register.sentenceCase": "Register",
|
||||
"general.signIn.sentenceCase": "Sign in",
|
||||
"header.links.courses": "Courses",
|
||||
"header.links.programs": "Programs",
|
||||
"header.links.content.search": "Discover New",
|
||||
"header.links.schools": "Schools & Partners",
|
||||
"header.user.menu.dashboard": "Dashboard",
|
||||
"header.user.menu.profile": "Profile",
|
||||
"header.user.menu.account.settings": "Account",
|
||||
"header.user.menu.order.history": "Order History",
|
||||
"header.user.menu.logout": "Logout",
|
||||
"header.user.menu.login": "Login",
|
||||
"header.user.menu.register": "Sign Up",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "Account",
|
||||
"header.label.account.menu": "Account Menu",
|
||||
"header.label.account.menu.for": "Account menu for {username}",
|
||||
"header.label.main.nav": "Main",
|
||||
"header.label.main.menu": "Main Menu",
|
||||
"header.label.main.header": "Main",
|
||||
"header.label.secondary.nav": "Secondary",
|
||||
"header.label.skip.nav": "Skip to main content",
|
||||
"header.label.app.nav": "App",
|
||||
"header.menu.dashboard.label": "Dashboard",
|
||||
"header.help.label": "Help",
|
||||
"header.menu.profile.label": "Profile",
|
||||
"header.menu.account.label": "Account",
|
||||
"header.menu.orderHistory.label": "Order History",
|
||||
"header.navigation.skipNavLink": "Skip to main content.",
|
||||
"header.menu.signOut.label": "Sign Out"
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
{}
|
||||
@@ -1 +1,33 @@
|
||||
{}
|
||||
{
|
||||
"general.register.sentenceCase": "Register",
|
||||
"general.signIn.sentenceCase": "Sign in",
|
||||
"header.links.courses": "Courses",
|
||||
"header.links.programs": "Programs",
|
||||
"header.links.content.search": "Discover New",
|
||||
"header.links.schools": "Schools & Partners",
|
||||
"header.user.menu.dashboard": "Dashboard",
|
||||
"header.user.menu.profile": "Profile",
|
||||
"header.user.menu.account.settings": "Account",
|
||||
"header.user.menu.order.history": "Order History",
|
||||
"header.user.menu.logout": "Logout",
|
||||
"header.user.menu.login": "Login",
|
||||
"header.user.menu.register": "Sign Up",
|
||||
"header.user.menu.studio.home": "Studio Home",
|
||||
"header.user.menu.studio.maintenance": "Maintenance",
|
||||
"header.label.account.nav": "Account",
|
||||
"header.label.account.menu": "Account Menu",
|
||||
"header.label.account.menu.for": "Account menu for {username}",
|
||||
"header.label.main.nav": "Main",
|
||||
"header.label.main.menu": "Main Menu",
|
||||
"header.label.main.header": "Main",
|
||||
"header.label.secondary.nav": "Secondary",
|
||||
"header.label.skip.nav": "Skip to main content",
|
||||
"header.label.app.nav": "App",
|
||||
"header.menu.dashboard.label": "Dashboard",
|
||||
"header.help.label": "Help",
|
||||
"header.menu.profile.label": "Profile",
|
||||
"header.menu.account.label": "Account",
|
||||
"header.menu.orderHistory.label": "Order History",
|
||||
"header.navigation.skipNavLink": "Skip to main content.",
|
||||
"header.menu.signOut.label": "Sign Out"
|
||||
}
|
||||
Reference in New Issue
Block a user