Merge pull request #97 from edx/van-379/add-skipnav-link

fix: add skipnav link in header
2021-03-19 21:12:14 +05:00 · 2021-03-19 21:05:18 +05:00 · 2021-03-19 18:23:28 +05:00 · 2021-03-19 14:57:42 +05:00 · 2021-02-11 15:34:50 +00:00 · 2021-02-11 10:36:34 +00:00
13 changed files with 238 additions and 107 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -0,0 +1,26 @@
+name: Default CI
+on: [push, pull_request]
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+    - name: Checkout
+      uses: actions/checkout@v2
+      with:
+        fetch-depth: 0
+    - name: Setup Nodejs
+      uses: actions/setup-node@v1
+      with:
+        node-version: 12
+    - name: Install dependencies
+      run: npm ci
+    - name: Validate package-lock.json changes
+      run: make validate-no-uncommitted-package-lock-changes
+    - name: Lint
+      run: npm run lint
+    - name: Test
+      run: npm run test
+    - name: i18n_extract
+      run: npm run i18n_extract
+    - name: Coverage
+      uses: codecov/codecov-action@v1
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -0,0 +1,37 @@
+name: Release CI
+on:
+  push:
+    branches:
+      - master
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Setup Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12
+      - name: Install dependencies
+        run: npm ci
+      - name: Validate package-lock.json changes
+        run: make validate-no-uncommitted-package-lock-changes
+      - name: Lint
+        run: npm run lint
+      - name: Test
+        run: npm run test
+      - name: i18n_extract
+        run: npm run i18n_extract
+      - name: Coverage
+        uses: codecov/codecov-action@v1
+      - name: Build
+        run: npm run build
+      - name: Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.SEMANTIC_RELEASE_GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.SEMANTIC_RELEASE_NPM_TOKEN }}
+        run: npx semantic-release
--- a/.gitignore
+++ b/.gitignore
@@ -6,3 +6,4 @@ node_modules
 temp
 src/i18n/transifex_input.json
 module.config.js
+.idea/
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,17 +0,0 @@
-language: node_js
-node_js: 12
-install:
- npm install
-script:
- npm run lint
- npm run test
- npm run build
-after_success:
- npx semantic-release
- codecov
-env:
-  global:
-  # GH_TOKEN
-  - secure: CFN/uOByWC+7S+AAXECLQ0mNgoiyCDl1ZB5AT5+/qP+xEVs0ysFKDWrD9W8KeQqHqCMPUKNt23nrgxwvFCkSx+n1MAnxZmOdVJWbzGbUB9TsqrwVUALkqof1MrRB8UFVEzIRaO60iRN/L3zVXML+4GsycYX6rHyptbAypxplpljDyKrY8tc/mM7AGZ9eVFGSq+7CXXmdvkhP9kLkH1tIYvR7wjTKvZHbHf6YRjIVCiyzxM4S/E9l8JRnbERp02XosRD62PUJXXk6EJVn6Qoub6CaPnpew5crW0iRF1UJs54U29zWd/S+LuW66WkLfJu7rDq6AFJNMtMNusJxwVkOv4X+p0oJDWZEhojW+/Wm10UAu8/g5oAqeePZEGiSbT3Hp1VqOc4FY/kmOLiM+L6oq/AA2XX6iiE8lA64IH5R8ApQamF4GTUYTvKHeLPgXnGJH7A95Xy9/+jmX9I9wJREMrHrkyPjoX/NTRdG+RrebB1+An9Bt9vAbG862gbOZfgTcuWHDOlG5gcA964Fr7RqR5a62yr45Gw+Q0lTrLj5mGAjjSpMRIAQzi9e7oXmoMZnvenu/WJAe5M+u+/gv82HeXcMwLvNNGSvz+0i1xNUOoX1zHG046oGKiX0Zu+l0JfNwihJTO7vJlaITmjhfOyufwpk74xEyrhf8nLF9e5Frec=
-  # NPM_TOKEN
-  - secure: fuV04Ctf0mgbw6nTJhsTzGZ6dyafZtGVj30ZkvSWsB9hUU8KDtl7wWVW9EayCQsSyyFgPY9RVav5olgC/zljAjDGg0nfF7n8uKIABA0TXdP683WZd06bVOmDXfL26B3yM83aW2xgHZN6VCCvCE8bLP1V6eV8nsr38gDgxVbHa0YasDMmvtYrog+IjxwjcJx7fD0RbYyi7iJC++pdw9kcFqOad28Us7L/jCn+rC3CmUT4kOwPjP5g1v5sB2FA7ouN5s1hUUTKuttV32VJgRP7wbZzoHeHX5BRGSqijdXNSaK5UwzqRnM1sGZkuNDZhJbSB3q90SQrPRgV+fRizwN8zs8Htb+Kk8+wGY6zNhmi9C+lUIv7UpDYbstMWYIf39+P/24Oj+vJBjMY30M9NWB8gt1OQ0dJUoK53v1+BMVmDB0doL6I53xwzUjQetvqOF0Wm3E3OrqJP00OJdzIcAeh2DzcIRW1SrBhI4HAsl7QJZNpRw11QzJ3K2iQSiWNd8qIuX+XJjzQdn1v09gCstvbP33Vn8tP1x0XTSi8wIhTDqE0bII/Sc80Jh76nu0ItQ8pmX4lGsER4C0N3Dp7Zz51yW7E70AWWLsUrMNdF0oHoP437ZRGPhYs5OI6x5AM2jlU8fJ5aUroEsYFCwkH0OO37THohpAQpApe9zL10miTEbw=
--- a/package-lock.json
+++ b/package-lock.json
@@ -1660,13 +1660,13 @@
      }
    },
    "@edx/frontend-platform": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-1.8.0.tgz",
-      "integrity": "sha512-R4LGBKaSBWC9xxG3eTN78zw5CkBes4xQgazt78ApgenxzIoun+y0tdWyc/8PpjbKmyj0nACpsfARyeQy4rnGKA==",
+      "version": "1.8.4",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-1.8.4.tgz",
+      "integrity": "sha512-Xjl5VYFK+OrOY8TaMMGfDK45+dkxr0ai/6SsNDt3KCLTqIqsNLY19mPGsHHpZD8B3H5unQuWTn6VoRZ7q+Ovxg==",
      "dev": true,
      "requires": {
        "@cospired/i18n-iso-languages": "2.1.2",
-        "axios": "0.18.1",
+        "axios": "0.21.1",
        "axios-cache-adapter": "^2.5.0",
        "form-urlencoded": "4.1.4",
        "glob": "7.1.6",
@@ -2734,50 +2734,50 @@
      "dev": true
    },
    "@redux-saga/core": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@redux-saga/core/-/core-1.1.1.tgz",
-      "integrity": "sha512-WKXfj2cYkP0eh74dE1ueMjVDoGJIkppXiMFgx0buVRkXENeZmRxIjM4lh9LEWWFqay7I/Qkw7+cMossa7xXoAQ==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@redux-saga/core/-/core-1.1.3.tgz",
+      "integrity": "sha512-8tInBftak8TPzE6X13ABmEtRJGjtK17w7VUs7qV17S8hCO5S3+aUTWZ/DBsBJPdE8Z5jOPwYALyvofgq1Ws+kg==",
      "dev": true,
      "requires": {
-        "@babel/runtime": "^7.6.0",
-        "@redux-saga/deferred": "^1.1.0",
-        "@redux-saga/delay-p": "^1.1.0",
-        "@redux-saga/is": "^1.1.0",
-        "@redux-saga/symbols": "^1.1.0",
+        "@babel/runtime": "^7.6.3",
+        "@redux-saga/deferred": "^1.1.2",
+        "@redux-saga/delay-p": "^1.1.2",
+        "@redux-saga/is": "^1.1.2",
+        "@redux-saga/symbols": "^1.1.2",
        "@redux-saga/types": "^1.1.0",
        "redux": "^4.0.4",
        "typescript-tuple": "^2.2.1"
      }
    },
    "@redux-saga/deferred": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@redux-saga/deferred/-/deferred-1.1.0.tgz",
-      "integrity": "sha512-wOCJCby3hx14bvrEeFLJ1JJTjJdXDJyC+B3JQ6eiqgzNghylbf969lIYmS2Arf2QuALfUtRBNPXBIMDKG9km4g==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@redux-saga/deferred/-/deferred-1.1.2.tgz",
+      "integrity": "sha512-908rDLHFN2UUzt2jb4uOzj6afpjgJe3MjICaUNO3bvkV/kN/cNeI9PMr8BsFXB/MR8WTAZQq/PlTq8Kww3TBSQ==",
      "dev": true
    },
    "@redux-saga/delay-p": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@redux-saga/delay-p/-/delay-p-1.1.0.tgz",
-      "integrity": "sha512-BcRwXs20kKjgiYEwZARkpVoRIe/hHftW3iwPhdeW4/jPyR9gLv/vG8VsJMF5NDEch+/w/mJtdgSubq+wtOS47g==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@redux-saga/delay-p/-/delay-p-1.1.2.tgz",
+      "integrity": "sha512-ojc+1IoC6OP65Ts5+ZHbEYdrohmIw1j9P7HS9MOJezqMYtCDgpkoqB5enAAZrNtnbSL6gVCWPHaoaTY5KeO0/g==",
      "dev": true,
      "requires": {
-        "@redux-saga/symbols": "^1.1.0"
+        "@redux-saga/symbols": "^1.1.2"
      }
    },
    "@redux-saga/is": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@redux-saga/is/-/is-1.1.0.tgz",
-      "integrity": "sha512-0uFXWGSvDCfNBdROHwEVixNhFbI3S+UGBQfcPXQiYL+CjIjyR3DTg2Z+NFH9xzP+H4Oh/yGtTHDhC0GxYp7HQQ==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@redux-saga/is/-/is-1.1.2.tgz",
+      "integrity": "sha512-OLbunKVsCVNTKEf2cH4TYyNbbPgvmZ52iaxBD4I1fTif4+MTXMa4/Z07L83zW/hTCXwpSZvXogqMqLfex2Tg6w==",
      "dev": true,
      "requires": {
-        "@redux-saga/symbols": "^1.1.0",
+        "@redux-saga/symbols": "^1.1.2",
        "@redux-saga/types": "^1.1.0"
      }
    },
    "@redux-saga/symbols": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@redux-saga/symbols/-/symbols-1.1.0.tgz",
-      "integrity": "sha512-Fzw1wV3j4hbac3MYmgNE18Z53URmQZeilTHZLF7Lm4SQ1jG4fcU47v2kElsEbQXUSaFqj+uJqdRzmDGNb6pRwQ==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@redux-saga/symbols/-/symbols-1.1.2.tgz",
+      "integrity": "sha512-EfdGnF423glv3uMwLsGAtE6bg+R9MdqlHEzExnfagXPrIiuxwr3bdiAwz3gi+PsrQ3yBlaBpfGLtDG8rf3LgQQ==",
      "dev": true
    },
    "@redux-saga/types": {
@@ -4294,23 +4294,30 @@
      "dev": true
    },
    "axios": {
-      "version": "0.18.1",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.18.1.tgz",
-      "integrity": "sha512-0BfJq4NSfQXd+SkFdrvFbG7addhYSBA2mQwISr46pD6E5iqkWg02RAs8vyTT/j0RTnoYmeXauBuSv1qKwR179g==",
+      "version": "0.21.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
+      "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
      "dev": true,
      "requires": {
-        "follow-redirects": "1.5.10",
-        "is-buffer": "^2.0.2"
+        "follow-redirects": "^1.10.0"
+      },
+      "dependencies": {
+        "follow-redirects": {
+          "version": "1.13.2",
+          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.2.tgz",
+          "integrity": "sha512-6mPTgLxYm3r6Bkkg0vNM0HTjfGrOEtsfbhagQvbxDEsEkpNhw582upBaoRZylzen6krEmxXJgt9Ju6HiI4O7BA==",
+          "dev": true
+        }
      }
    },
    "axios-cache-adapter": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/axios-cache-adapter/-/axios-cache-adapter-2.5.0.tgz",
-      "integrity": "sha512-YcMPdMoqmSLoZx7A5YD/PdYGuX6/Y9M2tHBhaIXvXrPeGgNnbW7nb3+uArWlT53WGHLfclnu2voMmS7jGXVg6A==",
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/axios-cache-adapter/-/axios-cache-adapter-2.7.0.tgz",
+      "integrity": "sha512-itggIo9i8tnsBFnniNh8+7RxXfdCKZT+cEvyjzBdU8IIyudpj4WyrY7288KE8MICs6+u7YFRVlLZi3vvXufz8w==",
      "dev": true,
      "requires": {
        "cache-control-esm": "1.0.0",
-        "lodash": "^4.17.11"
+        "md5": "^2.2.1"
      }
    },
    "axobject-query": {
@@ -5686,6 +5693,12 @@
      "integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==",
      "dev": true
    },
+    "charenc": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
+      "integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc=",
+      "dev": true
+    },
    "check-types": {
      "version": "8.0.3",
      "resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
@@ -6472,6 +6485,12 @@
        }
      }
    },
+    "crypt": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
+      "integrity": "sha1-iNf/fsDfuG9xPch7u0LQRNPmxBs=",
+      "dev": true
+    },
    "crypto-browserify": {
      "version": "3.12.0",
      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
@@ -11688,9 +11707,9 @@
      "dev": true
    },
    "is-buffer": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.5.tgz",
-      "integrity": "sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==",
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+      "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==",
      "dev": true
    },
    "is-callable": {
@@ -14743,6 +14762,17 @@
        "css-mediaquery": "^0.1.2"
      }
    },
+    "md5": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/md5/-/md5-2.3.0.tgz",
+      "integrity": "sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==",
+      "dev": true,
+      "requires": {
+        "charenc": "0.0.2",
+        "crypt": "0.0.2",
+        "is-buffer": "~1.1.6"
+      }
+    },
    "md5.js": {
      "version": "1.3.5",
      "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -17907,9 +17937,9 @@
      "dev": true
    },
    "react-redux": {
-      "version": "7.1.1",
-      "resolved": false,
-      "integrity": "sha512-QsW0vcmVVdNQzEkrgzh2W3Ksvr8cqpAv5FhEk7tNEft+5pp7rXxAudTz3VOPawRkLIepItpkEIyLcN/VVXzjTg==",
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.1.3.tgz",
+      "integrity": "sha512-uI1wca+ECG9RoVkWQFF4jDMqmaw0/qnvaSvOoL/GA4dNxf6LoV8sUAcNDvE5NWKs4hFpn0t6wswNQnY3f7HT3w==",
      "dev": true,
      "requires": {
        "@babel/runtime": "^7.5.5",
@@ -18146,9 +18176,9 @@
      }
    },
    "redux": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/redux/-/redux-4.0.4.tgz",
-      "integrity": "sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q==",
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-4.0.5.tgz",
+      "integrity": "sha512-VSz1uMAH24DM6MF72vcojpYPtrTUu3ByVWfPL1nPfVRb5mZVTve5GnNCUV53QM/BZ66xfWrm0CTWoM+Xlz8V1w==",
      "dev": true,
      "requires": {
        "loose-envify": "^1.4.0",
@@ -18156,12 +18186,12 @@
      }
    },
    "redux-saga": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/redux-saga/-/redux-saga-1.1.1.tgz",
-      "integrity": "sha512-guSnGJ/uEF8yL8Mn4aNa7HxRGCpVUALCkec9iTTD0fOhQqkF6bRQkBLeS+7/cAH3nFnr299bi/DOurTi1apcCA==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/redux-saga/-/redux-saga-1.1.3.tgz",
+      "integrity": "sha512-RkSn/z0mwaSa5/xH/hQLo8gNf4tlvT18qXDNvedihLcfzh+jMchDgaariQoehCpgRltEm4zHKJyINEz6aqswTw==",
      "dev": true,
      "requires": {
-        "@redux-saga/core": "^1.1.1"
+        "@redux-saga/core": "^1.1.3"
      }
    },
    "reflect.ownkeys": {
--- a/package.json
+++ b/package.json
@@ -40,7 +40,7 @@
    "@commitlint/prompt-cli": "8.2.0",
    "@edx/brand": "npm:@edx/brand-openedx@1.1.0",
    "@edx/frontend-build": "5.4.0",
-    "@edx/frontend-platform": "1.8.0",
+    "@edx/frontend-platform": "1.8.4",
    "@edx/paragon": "12.0.5",
    "codecov": "3.7.2",
    "enzyme": "3.10.0",
@@ -49,12 +49,12 @@
    "prop-types": "15.7.2",
    "react": "16.9.0",
    "react-dom": "16.9.0",
-    "react-redux": "7.1.1",
+    "react-redux": "7.1.3",
    "react-router-dom": "5.1.2",
    "react-test-renderer": "16.9.0",
    "reactifex": "1.1.1",
-    "redux": "4.0.4",
-    "redux-saga": "1.1.1"
+    "redux": "4.0.5",
+    "redux-saga": "1.1.3"
  },
  "dependencies": {
    "babel-polyfill": "6.26.0",
--- a/src/DesktopHeader.jsx
+++ b/src/DesktopHeader.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { getConfig } from '@edx/frontend-platform';

 // Local Components
 import { Menu, MenuTrigger, MenuContent } from './Menu';
@@ -103,10 +104,12 @@ class DesktopHeader extends React.Component {
      intl,
    } = 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">
-        <div className="container-fluid">
+        <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} />}
            <nav
--- a/src/Header.jsx
+++ b/src/Header.jsx
@@ -2,7 +2,13 @@ import React, { useContext } from 'react';
 import Responsive from 'react-responsive';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import { AppContext } from '@edx/frontend-platform/react';
-import { ensureConfig } from '@edx/frontend-platform/config';
+import {
+  APP_CONFIG_INITIALIZED,
+  ensureConfig,
+  mergeConfig,
+  getConfig,
+  subscribe,
+} from '@edx/frontend-platform';

 import DesktopHeader from './DesktopHeader';
 import MobileHeader from './MobileHeader';
@@ -14,9 +20,15 @@ ensureConfig([
  'LOGOUT_URL',
  'LOGIN_URL',
  'SITE_NAME',
-  'LOGO_TRADEMARK_URL',
+  'LOGO_URL',
 ], 'Header component');

+subscribe(APP_CONFIG_INITIALIZED, () => {
+  mergeConfig({
+    AUTHN_MINIMAL_HEADER: !!process.env.AUTHN_MINIMAL_HEADER,
+  }, 'Header additional config');
+});
+
 function Header({ intl }) {
  const { authenticatedUser, config } = useContext(AppContext);

@@ -65,16 +77,16 @@ function Header({ intl }) {
  ];

  const props = {
-    logo: config.LOGO_TRADEMARK_URL,
+    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,
    avatar: authenticatedUser !== null ? authenticatedUser.avatar : null,
-    mainMenu,
-    userMenu,
-    loggedOutItems,
+    mainMenu: getConfig().AUTHN_MINIMAL_HEADER ? [] : mainMenu,
+    userMenu: getConfig().AUTHN_MINIMAL_HEADER ? [] : userMenu,
+    loggedOutItems: getConfig().AUTHN_MINIMAL_HEADER ? [] : loggedOutItems,
  };

  return (
--- a/src/Header.messages.jsx
+++ b/src/Header.messages.jsx
@@ -67,7 +67,7 @@ const messages = defineMessages({
    description: 'The aria label for the account menu trigger',
  },
  'header.label.account.menu.for': {
-    id: 'header.label.account.menu',
+    id: 'header.label.account.menu.for',
    defaultMessage: 'Account menu for {username}',
    description: 'The aria label for the account menu trigger when the username is displayed in it',
  },
@@ -91,6 +91,11 @@ 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;
--- a/src/Header.test.jsx
+++ b/src/Header.test.jsx
@@ -19,7 +19,7 @@ describe('<Header />', () => {
                SITE_NAME: process.env.SITE_NAME,
                LOGIN_URL: process.env.LOGIN_URL,
                LOGOUT_URL: process.env.LOGOUT_URL,
-                LOGO_TRADEMARK_URL: process.env.LOGO_TRADEMARK_URL,
+                LOGO_URL: process.env.LOGO_URL,
              },
            }}
          >
@@ -51,7 +51,7 @@ describe('<Header />', () => {
                SITE_NAME: process.env.SITE_NAME,
                LOGIN_URL: process.env.LOGIN_URL,
                LOGOUT_URL: process.env.LOGOUT_URL,
-                LOGO_TRADEMARK_URL: process.env.LOGO_TRADEMARK_URL,
+                LOGO_URL: process.env.LOGO_URL,
              },
            }}
          >
@@ -78,7 +78,7 @@ describe('<Header />', () => {
                SITE_NAME: process.env.SITE_NAME,
                LOGIN_URL: process.env.LOGIN_URL,
                LOGOUT_URL: process.env.LOGOUT_URL,
-                LOGO_TRADEMARK_URL: process.env.LOGO_TRADEMARK_URL,
+                LOGO_URL: process.env.LOGO_URL,
              },
            }}
          >
@@ -110,7 +110,7 @@ describe('<Header />', () => {
                SITE_NAME: process.env.SITE_NAME,
                LOGIN_URL: process.env.LOGIN_URL,
                LOGOUT_URL: process.env.LOGOUT_URL,
-                LOGO_TRADEMARK_URL: process.env.LOGO_TRADEMARK_URL,
+                LOGO_URL: process.env.LOGO_URL,
              },
            }}
          >
--- a/src/MobileHeader.jsx
+++ b/src/MobileHeader.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { getConfig } from '@edx/frontend-platform';

 // Local Components
 import { Menu, MenuTrigger, MenuContent } from './Menu';
@@ -91,17 +92,22 @@ class MobileHeader extends React.Component {
      stickyOnMobile,
      intl,
      mainMenu,
+      userMenu,
+      loggedOutItems,
    } = this.props;
    const logoProps = { src: logo, alt: logoAltText, href: logoDestination };
    const stickyClassName = stickyOnMobile ? 'sticky-top' : '';
+    const logoClasses = getConfig().AUTHN_MINIMAL_HEADER ? 'justify-content-left pl-3' : 'justify-content-center';

    return (
      <header
        aria-label={intl.formatMessage(messages['header.label.main.header'])}
        className={`site-header-mobile d-flex justify-content-between align-items-center shadow ${stickyClassName}`}
      >
-        <div className="w-100 d-flex justify-content-start">
-          {mainMenu.length > 0 ? (
+        <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">
+
            <Menu className="position-static">
              <MenuTrigger
                tag="button"
@@ -119,26 +125,28 @@ class MobileHeader extends React.Component {
                {this.renderMainMenu()}
              </MenuContent>
            </Menu>
-          ) : null}
-        </div>
-        <div className="w-100 d-flex justify-content-center">
+          </div>
+        ) : null}
+        <div className={`w-100 d-flex ${logoClasses}`}>
          { logoDestination === null ? <Logo className="logo" src={logo} alt={logoAltText} /> : <LinkedLogo className="logo" {...logoProps} itemType="http://schema.org/Organization" />}
        </div>
-        <div className="w-100 d-flex justify-content-end align-items-center">
-          <Menu tag="nav" aria-label={intl.formatMessage(messages['header.label.secondary.nav'])} className="position-static">
-            <MenuTrigger
-              tag="button"
-              className="icon-button"
-              aria-label={intl.formatMessage(messages['header.label.account.menu'])}
-              title={intl.formatMessage(messages['header.label.account.menu'])}
-            >
-              <Avatar size="1.5rem" src={avatar} alt={username} />
-            </MenuTrigger>
-            <MenuContent tag="ul" className="nav flex-column pin-left pin-right border-top shadow py-2">
-              {loggedIn ? this.renderUserMenuItems() : this.renderLoggedOutItems()}
-            </MenuContent>
-          </Menu>
-        </div>
+        {userMenu.length > 0 || loggedOutItems.length > 0 ? (
+          <div className="w-100 d-flex justify-content-end align-items-center">
+            <Menu tag="nav" aria-label={intl.formatMessage(messages['header.label.secondary.nav'])} className="position-static">
+              <MenuTrigger
+                tag="button"
+                className="icon-button"
+                aria-label={intl.formatMessage(messages['header.label.account.menu'])}
+                title={intl.formatMessage(messages['header.label.account.menu'])}
+              >
+                <Avatar size="1.5rem" src={avatar} alt={username} />
+              </MenuTrigger>
+              <MenuContent tag="ul" className="nav flex-column pin-left pin-right border-top shadow py-2">
+                {loggedIn ? this.renderUserMenuItems() : this.renderLoggedOutItems()}
+              </MenuContent>
+            </Menu>
+          </div>
+        ) : null}
      </header>
    );
  }
--- a/src/snapshots/Header.test.jsx.snap
+++ b/src/snapshots/Header.test.jsx.snap
@@ -4,8 +4,14 @@ 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"
+    className="container-fluid null"
  >
    <div
      className="nav-container position-relative d-flex align-items-center"
@@ -17,7 +23,7 @@ exports[`<Header /> renders correctly for anonymous desktop 1`] = `
        <img
          alt="edX"
          className="d-block"
-          src="https://edx-cdn.org/v3/default/logo-trademark.svg"
+          src="https://edx-cdn.org/v3/default/logo.svg"
        />
      </a>
      <nav
@@ -58,6 +64,12 @@ 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"
  >
@@ -126,7 +138,7 @@ exports[`<Header /> renders correctly for anonymous mobile 1`] = `
      <img
        alt="edX"
        className="d-block"
-        src="https://edx-cdn.org/v3/default/logo-trademark.svg"
+        src="https://edx-cdn.org/v3/default/logo.svg"
      />
    </a>
  </div>
@@ -188,8 +200,14 @@ 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"
+    className="container-fluid null"
  >
    <div
      className="nav-container position-relative d-flex align-items-center"
@@ -201,7 +219,7 @@ exports[`<Header /> renders correctly for authenticated desktop 1`] = `
        <img
          alt="edX"
          className="d-block"
-          src="https://edx-cdn.org/v3/default/logo-trademark.svg"
+          src="https://edx-cdn.org/v3/default/logo.svg"
        />
      </a>
      <nav
@@ -292,6 +310,12 @@ 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"
  >
@@ -360,7 +384,7 @@ exports[`<Header /> renders correctly for authenticated mobile 1`] = `
      <img
        alt="edX"
        className="d-block"
-        src="https://edx-cdn.org/v3/default/logo-trademark.svg"
+        src="https://edx-cdn.org/v3/default/logo.svg"
      />
    </a>
  </div>
--- a/src/index.scss
+++ b/src/index.scss
@@ -32,6 +32,8 @@ $white: #fff;
 }

 .site-header-mobile {
+  height: 3rem;
+
  .nav-link {
    text-decoration: none;
    cursor: pointer;
Author	SHA1	Message	Date
Uzair Rasheed	b00e018105	Merge pull request #97 from edx/van-379/add-skipnav-link fix: add skipnav link in header	2021-03-19 21:12:14 +05:00
uzairr	02464f9c09	fix: add skipnav link in header	2021-03-19 21:05:18 +05:00
Uzair Rasheed	67c1fb2cda	Merge pull request #95 from edx/van-379/add-skipnav-link add skipnav link in header	2021-03-19 18:23:28 +05:00
uzairr	e84843d83a	add skipnav link in header	2021-03-19 14:57:42 +05:00
Renovate Bot	20606c2880	chore(deps): update dependency redux-saga to v1.1.3	2021-02-11 15:34:50 +00:00
Renovate Bot	3ba52a586e	chore(deps): update dependency redux to v4.0.5	2021-02-11 10:36:34 +00:00
Renovate Bot	9eafcc9ca0	chore(deps): update dependency @edx/frontend-platform to v1.8.4	2021-02-11 01:55:14 +00:00
Uzair Rasheed	61ecf93785	Merge pull request #92 from edx/align-logo-to-left fix: align logo to left	2021-02-08 14:57:53 +05:00
uzairr	917e748fc5	fix: align logo to left on authn mfe	2021-02-08 13:18:42 +05:00
Adeel Ehsan	0d64b19ac4	Merge pull request #89 from edx/aehsan/logistration-renmaed-to-authn fix: logistration renamed to authn	2021-01-28 14:06:36 +05:00
adeelehsan	9415709b81	fix: logistration renamed to authn	2021-01-28 13:08:25 +05:00
Adeel Ehsan	003d8ee1a7	Merge pull request #88 from edx/revert-87-aehsan/logistration_renmaed_to_authn Revert "logistration renamed to auth n"	2021-01-28 12:58:14 +05:00
Adeel Ehsan	18dd01d3d2	Revert "logistration renamed to auth n"	2021-01-28 12:52:31 +05:00
Adeel Ehsan	bdb1e03e4e	Merge pull request #87 from edx/aehsan/logistration_renmaed_to_authn logistration renamed to auth n	2021-01-28 12:34:54 +05:00
adeelehsan	5662e5daa3	logistration renamed to auth n	2021-01-28 12:27:17 +05:00
Renovate Bot	9306ce0783	chore(deps): update dependency react-redux to v7.1.3	2021-01-24 19:58:38 +00:00
Renovate Bot	f58ef0ace6	chore(deps): update dependency @edx/frontend-platform to v1.8.1	2021-01-10 13:50:47 +00:00
Waheed Ahmed	7de6ba4381	fix: logistration hide user menu icon on mobile screens (#84 ) VAN-227	2020-12-22 13:02:55 +05:00
Adam Stankiewicz	14fe2d9bc6	fix: use LOGO_URL and move to GH actions (#81 ) * fix: use LOGO_URL and move to GH actions * fix: duplicate i18n message id	2020-12-01 09:48:38 -05:00
Waheed Ahmed	78573e30f1	feat: add LOGISTRATION_MINIMAL_HEADER env variable (#75 ) The LOGISTRATION_MINIMAL_HEADER environment variable removes the main menu links from the header. It also removes login/register links from the menu if user is unauthenticated.	2020-11-23 15:04:20 +05:00