Compare commits

..

1 Commits

Author SHA1 Message Date
Uzair Rasheed
ea3a5683a9 Revert "add skipnav link in header" 2021-03-19 21:03:21 +05:00
11 changed files with 3958 additions and 4298 deletions

View File

@@ -6,7 +6,7 @@ ECOMMERCE_BASE_URL=http://localhost:18130
LANGUAGE_PREFERENCE_COOKIE_NAME=openedx-language-preference
LMS_BASE_URL=http://localhost:18000
LOGIN_URL=http://localhost:18000/login
LOGOUT_URL=http://localhost:18000/logout
LOGOUT_URL=http://localhost:18000/login
MARKETING_SITE_BASE_URL=http://localhost:18000
ORDER_HISTORY_URL=localhost:1996/orders
REFRESH_ACCESS_TOKEN_ENDPOINT=http://localhost:18000/login_refresh

1
.github/CODEOWNERS vendored
View File

@@ -1 +0,0 @@
* @edx/community-engineering

View File

@@ -1,75 +1,11 @@
#########################
frontend-component-header
#########################
=========================
|Build Status| |Codecov| |npm_version| |npm_downloads| |license| |semantic-release|
********
Overview
********
A generic header for Open edX micro-frontend applications.
************
Requirements
************
This component uses ``@edx/frontend-platform`` services such as i18n, analytics, configuration, and the ``AppContext`` React component, and expects that it has been loaded into a micro-frontend that has been properly initialized via ``@edx/frontend-platform``'s ``initialize`` function. `Please visit the frontend template application to see an example. <https://github.com/edx/frontend-template-application/blob/master/src/index.jsx>`_
Environment Variables
=====================
* ``LMS_BASE_URL`` - The URL of the LMS of your Open edX instance.
* ``LOGOUT_URL`` - The URL of the API endpoint which performs a user logout.
* ``LOGIN_URL`` - The URL of the login page where a user can sign into their account.
* ``SITE_NAME`` - The user-facing name of the site, used as `alt` text on the logo in the header.
Defaults to "localhost" in development.
* ``LOGO_URL`` - The URL of the site's logo. This logo is displayed in the header.
* ``AUTHN_MINIMAL_HEADER`` - A boolean flag which hides the main menu, user menu, and logged-out
menu items when truthy. This is intended to be used in micro-frontends like
frontend-app-authentication in which these menus are considered distractions from the user's task.
************
Installation
************
To install this header into your Open edX micro-frontend, run the following command in your MFE:
``npm i --save @edx/frontend-component-header``
This will make the component available to be imported into your application.
*****
Usage
*****
This library has the following exports:
* ``(default)``: The header as a React component.
* ``messages``: Internationalization messages suitable for use with `@edx/frontend-platform/i18n <https://edx.github.io/frontend-platform/module-Internationalization.html>`_
* ``dist/index.scss``: A SASS file which contains style information for the component. It should be imported into the micro-frontend's own SCSS file.
Examples
========
* `An example of component and messages usage. <https://github.com/edx/frontend-template-application/blob/3355bb3a96232390e9056f35b06ffa8f105ed7ca/src/index.jsx#L21>`_
* `An example of SCSS file usage. <https://github.com/edx/frontend-template-application/blob/3cd5485bf387b8c479baf6b02bf59e3061dc3465/src/index.scss#L8>`_
***********
Development
***********
Install dependencies::
npm i
Start the development server::
npm start
Build a production distribution::
npm run build
This is the standard Open edX header for use in React applications. It has two exports:
- **default**: The Header Component
- **messages**: for i18n in the form of ``{ locale: { key: translatedString } }``
.. |Build Status| image:: https://api.travis-ci.com/edx/frontend-component-header.svg?branch=master
:target: https://travis-ci.com/edx/frontend-component-header

8089
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -34,32 +34,32 @@
},
"homepage": "https://github.com/edx/frontend-component-header#readme",
"devDependencies": {
"@commitlint/cli": "8.3.5",
"@commitlint/config-angular": "8.3.4",
"@commitlint/prompt": "8.3.5",
"@commitlint/prompt-cli": "8.3.5",
"@commitlint/cli": "8.2.0",
"@commitlint/config-angular": "8.2.0",
"@commitlint/prompt": "8.2.0",
"@commitlint/prompt-cli": "8.2.0",
"@edx/brand": "npm:@edx/brand-openedx@1.1.0",
"@edx/frontend-build": "5.6.14",
"@edx/frontend-platform": "1.11.0",
"@edx/paragon": "12.8.0",
"codecov": "3.8.2",
"enzyme": "3.11.0",
"enzyme-adapter-react-16": "1.15.6",
"husky": "3.1.0",
"@edx/frontend-build": "5.4.0",
"@edx/frontend-platform": "1.8.4",
"@edx/paragon": "12.0.5",
"codecov": "3.7.2",
"enzyme": "3.10.0",
"enzyme-adapter-react-16": "1.14.0",
"husky": "3.0.9",
"prop-types": "15.7.2",
"react": "16.14.0",
"react-dom": "16.14.0",
"react-redux": "7.2.4",
"react-router-dom": "5.2.0",
"react-test-renderer": "16.14.0",
"react": "16.9.0",
"react-dom": "16.9.0",
"react-redux": "7.1.3",
"react-router-dom": "5.1.2",
"react-test-renderer": "16.9.0",
"reactifex": "1.1.1",
"redux": "4.1.0",
"redux": "4.0.5",
"redux-saga": "1.1.3"
},
"dependencies": {
"babel-polyfill": "6.26.0",
"react-responsive": "8.2.0",
"react-transition-group": "4.4.2"
"react-responsive": "8.0.3",
"react-transition-group": "4.3.0"
},
"peerDependencies": {
"@edx/frontend-platform": "^1.8.0",

View File

@@ -1,21 +1,9 @@
{
"extends": [
"config:base",
"schedule:weekly",
":automergeMinor",
":enableVulnerabilityAlerts",
":rebaseStalePrs",
":semanticCommits",
":updateNotScheduled"
"config:base"
],
"packageRules": [
{
"matchDepTypes": [
"devDependencies",
"lockFileMaintenance"
],
"automerge": true
}
],
"timezone": "America/New_York"
"patch": {
"automerge": true
},
"rebaseStalePrs": true
}

View File

@@ -108,7 +108,6 @@ class DesktopHeader extends React.Component {
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} />}

View File

@@ -79,6 +79,7 @@ function Header({ intl }) {
const props = {
logo: config.LOGO_URL,
logoAltText: config.SITE_NAME,
siteName: config.SITE_NAME,
logoDestination: `${config.LMS_BASE_URL}/dashboard`,
loggedIn: authenticatedUser !== null,
username: authenticatedUser !== null ? authenticatedUser.username : null,

View File

@@ -91,11 +91,6 @@ const messages = defineMessages({
defaultMessage: 'Secondary',
description: 'The aria label for the seconary nav',
},
'header.label.skip.nav': {
id: 'header.label.skip.nav',
defaultMessage: 'Skip to main content',
description: 'A link used by screen readers to allow users to skip to the main content of the page.',
},
});
export default messages;

View File

@@ -104,7 +104,6 @@ class MobileHeader extends React.Component {
aria-label={intl.formatMessage(messages['header.label.main.header'])}
className={`site-header-mobile d-flex justify-content-between align-items-center shadow ${stickyClassName}`}
>
<a className="nav-skip sr-only sr-only-focusable" href="#main">{intl.formatMessage(messages['header.label.skip.nav'])}</a>
{mainMenu.length > 0 ? (
<div className="w-100 d-flex justify-content-start">

View File

@@ -4,12 +4,6 @@ exports[`<Header /> renders correctly for anonymous desktop 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"
>
@@ -64,12 +58,6 @@ exports[`<Header /> renders correctly for anonymous mobile 1`] = `
aria-label="Main"
className="site-header-mobile d-flex justify-content-between align-items-center shadow sticky-top"
>
<a
className="nav-skip sr-only sr-only-focusable"
href="#main"
>
Skip to main content
</a>
<div
className="w-100 d-flex justify-content-start"
>
@@ -200,12 +188,6 @@ exports[`<Header /> renders correctly for authenticated desktop 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"
>
@@ -310,12 +292,6 @@ exports[`<Header /> renders correctly for authenticated mobile 1`] = `
aria-label="Main"
className="site-header-mobile d-flex justify-content-between align-items-center shadow sticky-top"
>
<a
className="nav-skip sr-only sr-only-focusable"
href="#main"
>
Skip to main content
</a>
<div
className="w-100 d-flex justify-content-start"
>