qpp-style 9.34.2-beta.0 → 9.34.2

package/coverage/lcov-report/react/components/SanitizedContent/index.jsx.html

@@ -23,30 +23,30 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">100% </span>
+                <span class="strong">76.92% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>9/9</span>
+                <span class='fraction'>10/13</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">66.66% </span>
+                <span class="strong">40% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>4/6</span>
+                <span class='fraction'>4/10</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">100% </span>
+                <span class="strong">66.66% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>2/2</span>
+                <span class='fraction'>2/3</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">100% </span>
+                <span class="strong">76.92% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>9/9</span>
+                <span class='fraction'>10/13</span>
             </div>
         
             
@@ -61,7 +61,7 @@
             </div>
         </template>
     </div>
-    <div class='status-line high'></div>
+    <div class='status-line medium'></div>
     <pre><table class="coverage">
 <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
 <a name='L2'></a><a href='#L2'>2</a>
@@ -274,12 +274,24 @@
 <a name='L209'></a><a href='#L209'>209</a>
 <a name='L210'></a><a href='#L210'>210</a>
 <a name='L211'></a><a href='#L211'>211</a>
-<a name='L212'></a><a href='#L212'>212</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L212'></a><a href='#L212'>212</a>
+<a name='L213'></a><a href='#L213'>213</a>
+<a name='L214'></a><a href='#L214'>214</a>
+<a name='L215'></a><a href='#L215'>215</a>
+<a name='L216'></a><a href='#L216'>216</a>
+<a name='L217'></a><a href='#L217'>217</a>
+<a name='L218'></a><a href='#L218'>218</a>
+<a name='L219'></a><a href='#L219'>219</a>
+<a name='L220'></a><a href='#L220'>220</a>
+<a name='L221'></a><a href='#L221'>221</a>
+<a name='L222'></a><a href='#L222'>222</a>
+<a name='L223'></a><a href='#L223'>223</a>
+<a name='L224'></a><a href='#L224'>224</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -368,7 +380,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -458,7 +470,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -468,7 +480,19 @@
 <span class="cline-any cline-yes">85x</span>
 <span class="cline-any cline-yes">85x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -477,7 +501,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -679,7 +703,19 @@ const SanitizedContent = ({
     map[tag] = allowedAttributes['*'];
     return map;
   }, {});
-  const sanitizedHTML = xss(html, { whiteList });
+&nbsp;
+  const xssOptions = {
+    whiteList,
+    onIgnoreTagAttr: <span class="fstat-no" title="function not covered" >(t</span>ag, name, value, isWhiteAttr) =&gt; {
+      const isDataOrAriaAttr = <span class="cstat-no" title="statement not covered" >name.includes('data-') || name.includes('aria-');</span>
+<span class="cstat-no" title="statement not covered" >      if (isDataOrAriaAttr) {</span>
+<span class="cstat-no" title="statement not covered" >        return `${name}="${xss.escapeAttrValue(value)}"`;</span>
+      }
+    },
+  };
+&nbsp;
+  const sanitizedHTML = xss(html, xssOptions);
+&nbsp;
   return (
     &lt;div
       {...(customClassName &amp;&amp; <span class="branch-1 cbranch-no" title="branch not covered" >{ className: customClassName })</span>}
@@ -703,7 +739,7 @@ export default SanitizedContent;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-05-08T18:31:29.023Z
+                at 2023-09-08T00:45:02.387Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/{components/SideNav/Links/NavLinkInline.jsx.html → react/components/Session/Session.jsx.html}

@@ -3,7 +3,7 @@
 <html lang="en">
 
 <head>
-    <title>Code coverage report for components/SideNav/Links/NavLinkInline.jsx</title>
+    <title>Code coverage report for react/components/Session/Session.jsx</title>
     <meta charset="utf-8" />
     <link rel="stylesheet" href="../../../prettify.css" />
     <link rel="stylesheet" href="../../../base.css" />
@@ -19,34 +19,34 @@
 <body>
 <div class='wrapper'>
     <div class='pad1'>
-        <h1><a href="../../../index.html">All files</a> / <a href="index.html">components/SideNav/Links</a> NavLinkInline.jsx</h1>
+        <h1><a href="../../../index.html">All files</a> / <a href="index.html">react/components/Session</a> Session.jsx</h1>
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">6.66% </span>
+                <span class="strong">17.94% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>2/30</span>
+                <span class='fraction'>7/39</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>0/39</span>
+                <span class='fraction'>0/11</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>0/5</span>
+                <span class='fraction'>0/12</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">6.66% </span>
+                <span class="strong">19.44% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>2/30</span>
+                <span class='fraction'>7/36</span>
             </div>
         
             
@@ -162,77 +162,47 @@
 <a name='L97'></a><a href='#L97'>97</a>
 <a name='L98'></a><a href='#L98'>98</a>
 <a name='L99'></a><a href='#L99'>99</a>
-<a name='L100'></a><a href='#L100'>100</a>
-<a name='L101'></a><a href='#L101'>101</a>
-<a name='L102'></a><a href='#L102'>102</a>
-<a name='L103'></a><a href='#L103'>103</a>
-<a name='L104'></a><a href='#L104'>104</a>
-<a name='L105'></a><a href='#L105'>105</a>
-<a name='L106'></a><a href='#L106'>106</a>
-<a name='L107'></a><a href='#L107'>107</a>
-<a name='L108'></a><a href='#L108'>108</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L100'></a><a href='#L100'>100</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -243,147 +213,153 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React, { useState } from 'react';
-import { handleNavigation } from '../helpers';
-import AnimationGroup from '../AnimationGroup/AnimationGroup';
-import PropTypes from 'prop-types';
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React, { useEffect, useState } from 'react';
+import cookie from 'cookie';
+import Modal from '../Modal';
+import { fetchTtl } from '../../session';
+import refreshSession from '../../session/refresh';
+import logoutSession from '../../session/logout';
 &nbsp;
-const NavLinkInline = <span class="fstat-no" title="function not covered" >({</span>
-  url,
-  urlExpressionToMatch,
-  className,
-  icon,
-  label,
-  isActive,
-  showLabel,
-  linkCallback,
-  disabled,
-  useTooltips,
-  target,
-}) =&gt; {
-  const localUrl = <span class="cstat-no" title="statement not covered" >urlExpressionToMatch || url;</span>
-  const urlRegExp = <span class="cstat-no" title="statement not covered" >new RegExp(`${localUrl}/?$`);</span>
-  const path = <span class="cstat-no" title="statement not covered" >window.location.href &amp;&amp; window.location.href.split('?')[0];</span>
-  const currentPage = <span class="cstat-no" title="statement not covered" >path &amp;&amp; path.match(urlRegExp);</span>
-  const svgRef = <span class="cstat-no" title="statement not covered" >React.useRef();</span>
-  const [showTooltip, setShowTooltip] = <span class="cstat-no" title="statement not covered" >useState(false);</span>
-  const tooltipRef = <span class="cstat-no" title="statement not covered" >React.useRef();</span>
+// calculate TWO_MINUTES for interval
+const SECOND = 1000;
+const MINUTE = 60 * SECOND;
+const TWO_MINUTES = 2 * MINUTE;
+const DEFAULT_SESSION_CHECK_INTERVAL = TWO_MINUTES;
 &nbsp;
-<span class="cstat-no" title="statement not covered" >  React.useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
-<span class="cstat-no" title="statement not covered" >    if (!showLabel &amp;&amp; useTooltips &amp;&amp; svgRef.current) {</span>
-      const existingMouseenter = <span class="cstat-no" title="statement not covered" >svgRef.current.onmouseover;</span>
-      const existingMouseout = <span class="cstat-no" title="statement not covered" >svgRef.current.onmouseout;</span>
+// This Dialog shows up 2 minutes before the user session ends
+// giving the user an opportunity to refresh the token
+// or to sign out
+const InactiveDialog = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
+  const [isOpen, setIsOpen] = <span class="cstat-no" title="statement not covered" >useState(true);</span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >      svgRef.current.onmouseover = <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
-<span class="cstat-no" title="statement not covered" >        if (tooltipRef.current &amp;&amp; useTooltips) {</span>
-          const svgOffset = <span class="cstat-no" title="statement not covered" >svgRef.current.getBoundingClientRect();</span>
-<span class="cstat-no" title="statement not covered" >          tooltipRef.current.style.top = `${svgOffset.top - 5}px`;</span>
-<span class="cstat-no" title="statement not covered" >          tooltipRef.current.style.display = 'block';</span>
-        }
-<span class="cstat-no" title="statement not covered" >        if (typeof existingMouseenter === 'function') {</span>
-<span class="cstat-no" title="statement not covered" >          existingMouseenter();</span>
-        }
-      };
+<span class="cstat-no" title="statement not covered" >  useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
+    const timeout = <span class="cstat-no" title="statement not covered" >setTimeout(<span class="fstat-no" title="function not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >logoutSession(window),</span> TWO_MINUTES);</span>
+<span class="cstat-no" title="statement not covered" >    return <span class="fstat-no" title="function not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >clearInterval(timeout);</span></span>
+  }, []);
 &nbsp;
-<span class="cstat-no" title="statement not covered" >      svgRef.current.onmouseout = <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
-<span class="cstat-no" title="statement not covered" >        if (tooltipRef.current) {</span>
-<span class="cstat-no" title="statement not covered" >          tooltipRef.current.style.display = 'none';</span>
+<span class="cstat-no" title="statement not covered" >  return (</span>
+    &lt;Modal
+      useDesignSystem
+      title="You will be signed out within two minutes"
+      isOpen={isOpen}
+      primary={{
+        title: 'Keep me signed in',
+        onClick: <span class="fstat-no" title="function not covered" >()</span> =&gt; {
+<span class="cstat-no" title="statement not covered" >          refreshSession();</span>
+<span class="cstat-no" title="statement not covered" >          setIsOpen(false);</span>
+        },
+      }}
+      secondary={{
+        title: 'Sign me out now',
+        onClick: <span class="fstat-no" title="function not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >logoutSession(window),</span>
+      }}
+      onRequestClose={<span class="fstat-no" title="function not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >setIsOpen(false)}</span>
+    &gt;
+      &lt;p&gt;
+        You have been inactive for thirty minutes. For your security, we will
+        sign you out automatically.
+      &lt;/p&gt;
+    &lt;/Modal&gt;
+  );
+};
+&nbsp;
+// 120 seconds is 2 minutes
+const DEFAULT_WARNING_TIMEOUT_SECONDS = 120;
+function <span class="fstat-no" title="function not covered" >shouldShowInactiveDialog(</span>
+  timeRemainingSeconds,
+  warningTimeoutSeconds = <span class="branch-0 cbranch-no" title="branch not covered" >DEFAULT_WARNING_TIMEOUT_SECONDS,</span>
+) {
+<span class="cstat-no" title="statement not covered" >  return timeRemainingSeconds &lt; warningTimeoutSeconds;</span>
+}
+&nbsp;
+const Session = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
+  const [isInactiveDialogOpen, setIsInactiveDialogOpen] = <span class="cstat-no" title="statement not covered" >useState(false);</span>
+&nbsp;
+<span class="cstat-no" title="statement not covered" >  useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
+    let didCancel = <span class="cstat-no" title="statement not covered" >false;</span>
+    const cookies = <span class="cstat-no" title="statement not covered" >cookie.parse(document.cookie);</span>
+    const hasAuthToken = <span class="cstat-no" title="statement not covered" >!!cookies.qpp_auth_token;</span>
+    async function <span class="fstat-no" title="function not covered" >isSessionValid(</span>) {
+<span class="cstat-no" title="statement not covered" >      if (hasAuthToken) {</span>
+        const timeRemaining = <span class="cstat-no" title="statement not covered" >await fetchTtl(cookies.qpp_auth_token);</span>
+        // safeguard against unmounted component
+<span class="cstat-no" title="statement not covered" >        if (didCancel) <span class="cstat-no" title="statement not covered" >return;</span></span>
+&nbsp;
+        // token expired
+<span class="cstat-no" title="statement not covered" >        if (timeRemaining === 0) {</span>
+<span class="cstat-no" title="statement not covered" >          logoutSession(window);</span>
+<span class="cstat-no" title="statement not covered" >          return;</span>
         }
-<span class="cstat-no" title="statement not covered" >        if (typeof existingMouseout === 'function') {</span>
-<span class="cstat-no" title="statement not covered" >          existingMouseout();</span>
+        // token is about to expire
+<span class="cstat-no" title="statement not covered" >        if (shouldShowInactiveDialog(timeRemaining)) {</span>
+<span class="cstat-no" title="statement not covered" >          setIsInactiveDialogOpen(true);</span>
         }
-      };
-<span class="cstat-no" title="statement not covered" >      setShowTooltip(true);</span>
+      }
     }
-<span class="cstat-no" title="statement not covered" >    if (showLabel) {</span>
-<span class="cstat-no" title="statement not covered" >      setShowTooltip(false);</span>
-    }
-  }, [svgRef.current, showLabel]);
+<span class="cstat-no" title="statement not covered" >    isSessionValid();</span>
+    const interval = <span class="cstat-no" title="statement not covered" >setInterval(</span>
+      isSessionValid,
+      DEFAULT_SESSION_CHECK_INTERVAL,
+    );
 &nbsp;
-<span class="cstat-no" title="statement not covered" >  return (</span>
-    &lt;React.Fragment&gt;
-      &lt;a
-        href={disabled ? undefined : url}
-        onClick={<span class="fstat-no" title="function not covered" >(e</span>) =&gt; <span class="cstat-no" title="statement not covered" >handleNavigation(e, linkCallback, label)}</span>
-        className={`${className} ${currentPage || isActive ? 'active' : ''} ${
-          disabled ? 'disabled' : ''
-        }`}
-        data-track-category="SidebarNav"
-        data-track-action={`GoTo${label ? label.split(' ').join('') : ''}`}
-        data-track-label={label}
-        aria-label={label}
-        target={`${target ? target : '_self'}`}
-      &gt;
-        &lt;svg
-          className={`left-icon ${disabled ? 'disabled' : ''}`}
-          aria-hidden="true"
-          focusable="false"
-          ref={svgRef}
-        &gt;
-          {icon}
-        &lt;/svg&gt;
-        &lt;AnimationGroup display={showLabel}&gt;
-          &lt;span tabIndex="-1"&gt;{label}&lt;/span&gt;
-        &lt;/AnimationGroup&gt;
-      &lt;/a&gt;
-      {showTooltip &amp;&amp; (
-        &lt;div ref={tooltipRef} className="sidebar-tooltip"&gt;
-          &lt;span className="sidebar-tooltip-text"&gt;{label}&lt;/span&gt;
-        &lt;/div&gt;
-      )}
-    &lt;/React.Fragment&gt;
-  );
-};
+<span class="cstat-no" title="statement not covered" >    return <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
+<span class="cstat-no" title="statement not covered" >      clearInterval(interval);</span>
+<span class="cstat-no" title="statement not covered" >      didCancel = true;</span>
+    };
+  }, []);
 &nbsp;
-NavLinkInline.propTypes = {
-  urlExpressionToMatch: PropTypes.string,
-  url: PropTypes.string,
-  className: PropTypes.string,
-  icon: PropTypes.element,
-  label: PropTypes.string,
-  isActive: PropTypes.bool,
-  showLabel: PropTypes.bool,
-  linkCallback: PropTypes.func,
-  disabled: PropTypes.bool,
-  useTooltips: PropTypes.bool,
-  target: PropTypes.string,
+<span class="cstat-no" title="statement not covered" >  return &lt;&gt;{isInactiveDialogOpen &amp;&amp; &lt;InactiveDialog /&gt;}&lt;/&gt;;</span>
 };
 &nbsp;
-export default NavLinkInline;
+export default Session;
 &nbsp;</pre></td></tr></table></pre>
 
                 <div class='push'></div><!-- for sticky footer -->
@@ -391,7 +367,7 @@ export default NavLinkInline;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Fri Apr 29 2022 13:58:50 GMT-0400 (Eastern Daylight Time)
+                at 2023-09-08T00:45:02.387Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>