fix(deps): update dependency @edx/paragon to v20.45.5

package-lock.json

@@ -9,7 +9,7 @@
       "version": "1.0.0-semantically-released",
       "license": "AGPL-3.0",
       "dependencies": {
-        "@edx/paragon": "20.45.0",
+        "@edx/paragon": "20.45.5",
         "@fortawesome/fontawesome-svg-core": "6.4.0",
         "@fortawesome/free-brands-svg-icons": "6.4.0",
         "@fortawesome/free-regular-svg-icons": "6.4.0",
@@ -3220,9 +3220,9 @@
       }
     },
     "node_modules/@edx/paragon": {
-      "version": "20.45.0",
-      "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-20.45.0.tgz",
-      "integrity": "sha512-9lHcnSJ36sQ+bsYFhydf/Pvp3Bo5N3go8R3ORPTNtvYnwiKSfjlv11QpURC/xHobXsT2eYHiwl2gNmq1yP09BA==",
+      "version": "20.45.5",
+      "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-20.45.5.tgz",
+      "integrity": "sha512-7GsGPKyxtjFo3Xnj+uQ4vx/Khz7S6srHe8MqcsYCMx2mJ8fulPN2JFm84m+0o1CSwHaL469wBPONI4KCa+vfrA==",
       "dependencies": {
         "@fortawesome/fontawesome-svg-core": "^6.1.1",
         "@fortawesome/react-fontawesome": "^0.1.18",

package.json

@@ -56,7 +56,7 @@
     "redux-saga": "1.2.3"
   },
   "dependencies": {
-    "@edx/paragon": "20.45.0",
+    "@edx/paragon": "20.45.5",
     "@fortawesome/fontawesome-svg-core": "6.4.0",
     "@fortawesome/free-brands-svg-icons": "6.4.0",
     "@fortawesome/free-regular-svg-icons": "6.4.0",

src/Notifications/index.jsx

@@ -44,13 +44,6 @@ const Notifications = () => {
     };
   }, []);
 
-  const viewPortHeight = window.innerHeight;
-  const headerHeight = document.getElementsByClassName('learning-header');
-  let notificationBarHeight = 0;
-  if (headerHeight.length > 0) {
-    notificationBarHeight = viewPortHeight - headerHeight[0].clientHeight;
-  }
-
   return (
     <OverlayTrigger
       trigger="click"
@@ -61,7 +54,6 @@ const Notifications = () => {
       overlay={(
         <Popover
           id="notificationTray"
-          style={{ height: `${notificationBarHeight}px` }}
           data-testid="notification-tray"
           className={classNames('overflow-auto rounded-0 border-0', {
             'w-100': !isOnMediumScreen && !isOnLargeScreen,

src/index.scss

@@ -190,6 +190,8 @@ $white: #fff;
 }
 
 .popover {
+  max-height: calc(100% - 68px);
+  min-height: 1220px;
   filter: none;
   box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), 0px 2px 8px rgba(0, 0, 0, 0.15);