@madie/madie-design-system 1.0.2 → 1.0.3

package/coverage/lcov-report/react/components/SideNav/UI/SideNavUI.jsx.html

@@ -396,7 +396,27 @@
 <a name='L331'></a><a href='#L331'>331</a>
 <a name='L332'></a><a href='#L332'>332</a>
 <a name='L333'></a><a href='#L333'>333</a>
-<a name='L334'></a><a href='#L334'>334</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L334'></a><a href='#L334'>334</a>
+<a name='L335'></a><a href='#L335'>335</a>
+<a name='L336'></a><a href='#L336'>336</a>
+<a name='L337'></a><a href='#L337'>337</a>
+<a name='L338'></a><a href='#L338'>338</a>
+<a name='L339'></a><a href='#L339'>339</a>
+<a name='L340'></a><a href='#L340'>340</a>
+<a name='L341'></a><a href='#L341'>341</a>
+<a name='L342'></a><a href='#L342'>342</a>
+<a name='L343'></a><a href='#L343'>343</a>
+<a name='L344'></a><a href='#L344'>344</a>
+<a name='L345'></a><a href='#L345'>345</a>
+<a name='L346'></a><a href='#L346'>346</a>
+<a name='L347'></a><a href='#L347'>347</a>
+<a name='L348'></a><a href='#L348'>348</a>
+<a name='L349'></a><a href='#L349'>349</a>
+<a name='L350'></a><a href='#L350'>350</a>
+<a name='L351'></a><a href='#L351'>351</a>
+<a name='L352'></a><a href='#L352'>352</a>
+<a name='L353'></a><a href='#L353'>353</a>
+<a name='L354'></a><a href='#L354'>354</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>
@@ -478,6 +498,10 @@
 <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-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>
@@ -493,6 +517,8 @@
 <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-neutral">&nbsp;</span>
@@ -623,6 +649,20 @@
 <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-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-neutral">&nbsp;</span>
@@ -729,338 +769,358 @@
 <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, useEffect, useRef } from 'react';
-import PropTypes from 'prop-types';
-import SVGInline from 'react-svg-inline';
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React, { useState, useEffect, useRef } from "react";
+import PropTypes from "prop-types";
+import SVGInline from "react-svg-inline";
 &nbsp;
-import { withGetConfig } from '../../hooks/useGetConfig';
-import { LevelOneContent, LevelTwoContent } from '../Content';
+import { withGetConfig } from "../../hooks/useGetConfig";
+import { LevelOneContent, LevelTwoContent } from "../Content";
 import {
-  NavLinkContainer,
-  NavLinkInline,
-  NavLinkDrawer,
-  NavLinkToggle,
-} from '../Links';
-import AnimationGroup from '../AnimationGroup/AnimationGroup';
-import { PracticeDetails, IndividualDetails } from '../Details';
-import { ScoreChart } from '../Chart';
-import SanitizedContent from '../../SanitizedContent';
-import * as SvgComponents from '../../../lib/SvgComponents.jsx';
-import SVGIcons from '../../../lib/svg-definitions.svg';
-import CmsSwitchLink from '../Links/CmsSwitchLink';
-import defaultContent from './default-content';
+    NavLinkContainer,
+    NavLinkInline,
+    NavLinkDrawer,
+    NavLinkToggle,
+} from "../Links";
+import AnimationGroup from "../AnimationGroup/AnimationGroup";
+import { PracticeDetails, IndividualDetails } from "../Details";
+import { ScoreChart } from "../Chart";
+import SanitizedContent from "../../SanitizedContent";
+import * as SvgComponents from "../../../lib/SvgComponents.jsx";
+import SVGIcons from "../../../lib/svg-definitions.svg";
+import CmsSwitchLink from "../Links/CmsSwitchLink";
+import defaultContent from "./default-content";
 &nbsp;
 const SideNavUI = ({
-  chartData,
-  config,
-  currentLevel,
-  isAltStyle,
-  isExpanded,
-  items,
-  onCollapsed,
-  onExpanded,
-  performanceYear,
-  showReportingLinks,
-  svgIcons,
-  result,
+    chartData,
+    config,
+    currentLevel,
+    isAltStyle,
+    isExpanded,
+    items,
+    onCollapsed,
+    onExpanded,
+    performanceYear,
+    showReportingLinks,
+    svgIcons,
+    result,
 }) =&gt; {
-  const [isExpandedState, setIsExpandedState] = useState(isExpanded);
-  const [itemsState, setItemsState] = useState(items);
-  const [currentLevelState, setCurrentLevelState] = useState(currentLevel);
+    const [isExpandedState, setIsExpandedState] = useState(isExpanded);
+    const [itemsState, setItemsState] = useState(items);
+    const [currentLevelState, setCurrentLevelState] = useState(currentLevel);
 &nbsp;
-  const collapseRef = useRef(null);
+    const collapseRef = useRef(null);
 &nbsp;
-  const expand = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
-<span class="cstat-no" title="statement not covered" >    setIsExpandedState(true);</span>
-<span class="cstat-no" title="statement not covered" >    if (onExpanded) {</span>
-<span class="cstat-no" title="statement not covered" >      onExpanded();</span>
-    }
-  };
+    const expand = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
+<span class="cstat-no" title="statement not covered" >        setIsExpandedState(true);</span>
+<span class="cstat-no" title="statement not covered" >        if (onExpanded) {</span>
+<span class="cstat-no" title="statement not covered" >            onExpanded();</span>
+        }
+    };
 &nbsp;
-  const collapse = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
-<span class="cstat-no" title="statement not covered" >    setIsExpandedState(false);</span>
-<span class="cstat-no" title="statement not covered" >    if (onCollapsed) {</span>
-<span class="cstat-no" title="statement not covered" >      onCollapsed();</span>
-    }
-  };
+    const collapse = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
+<span class="cstat-no" title="statement not covered" >        setIsExpandedState(false);</span>
+<span class="cstat-no" title="statement not covered" >        if (onCollapsed) {</span>
+<span class="cstat-no" title="statement not covered" >            onCollapsed();</span>
+        }
+    };
 &nbsp;
-  const toggleExpanded = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
-<span class="cstat-no" title="statement not covered" >    isExpandedState ? collapse() : expand();</span>
-  };
+    const toggleExpanded = <span class="fstat-no" title="function not covered" >()</span> =&gt; {
+<span class="cstat-no" title="statement not covered" >        isExpandedState ? collapse() : expand();</span>
+    };
 &nbsp;
-  const getLevelContent = () =&gt; {
-    return (
-      {
-        2: (
-          &lt;LevelTwoContent
-            showReportingLinks={showReportingLinks}
-            isExpanded={isExpandedState}
-            chartData={chartData}
-            config={config}
-          /&gt;
-        ),
-      }[currentLevelState] || (
-        &lt;LevelOneContent
-          levelOneContent={result?.content}
-          isExpanded={isExpandedState}
-          config={config}
-        /&gt;
-      )
-    );
-  };
+    const getLevelContent = () =&gt; {
+        return (
+            {
+                2: (
+                    &lt;LevelTwoContent
+                        showReportingLinks={showReportingLinks}
+                        isExpanded={isExpandedState}
+                        chartData={chartData}
+                        config={config}
+                    /&gt;
+                ),
+            }[currentLevelState] || (
+                &lt;LevelOneContent
+                    levelOneContent={result?.content}
+                    isExpanded={isExpandedState}
+                    config={config}
+                /&gt;
+            )
+        );
+    };
 &nbsp;
-  const getDynamicContent = <span class="fstat-no" title="function not covered" >(c</span>ontentItems, className, recursionId) =&gt; {
-    const { openDrawersByDefault, linkActiveFunc, linkCallback, useTooltips } =
-<span class="cstat-no" title="statement not covered" >      config;</span>
-    const linkClass = <span class="cstat-no" title="statement not covered" >isExpandedState ? 'link-inline' : 'link-collapsed';</span>
-    const containerRecursionId = <span class="cstat-no" title="statement not covered" >recursionId || 0;</span>
+    const getDynamicContent = <span class="fstat-no" title="function not covered" >(c</span>ontentItems, className, recursionId) =&gt; {
+        const {
+            openDrawersByDefault,
+            linkActiveFunc,
+            linkCallback,
+            useTooltips,
+        } = <span class="cstat-no" title="statement not covered" >config;</span>
+        const linkClass = <span class="cstat-no" title="statement not covered" >isExpandedState ? "link-inline" : "link-collapsed";</span>
+        const containerRecursionId = <span class="cstat-no" title="statement not covered" >recursionId || 0;</span>
 &nbsp;
-    const getDynamicIcon = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(i</span>con) =&gt; {</span>
-      const Component = <span class="cstat-no" title="statement not covered" >SvgComponents[icon];</span>
-<span class="cstat-no" title="statement not covered" >      return Component ? &lt;Component /&gt; : null;</span>
-    };
+        const getDynamicIcon = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(i</span>con) =&gt; {</span>
+            const Component = <span class="cstat-no" title="statement not covered" >SvgComponents[icon];</span>
+<span class="cstat-no" title="statement not covered" >            return Component ? &lt;Component /&gt; : null;</span>
+        };
 &nbsp;
-    const hasDarkerBackground = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(d</span>arkerBackground) =&gt; {</span>
-<span class="cstat-no" title="statement not covered" >      return darkerBackground ? 'hr-smaller-vertical-spacing' : '';</span>
-    }
+        const hasDarkerBackground = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(d</span>arkerBackground) =&gt; {</span>
+<span class="cstat-no" title="statement not covered" >            return darkerBackground ? "hr-smaller-vertical-spacing" : "";</span>
+        };
 &nbsp;
-    const itemsMarkup = <span class="cstat-no" title="statement not covered" >(contentItems || []).map(<span class="fstat-no" title="function not covered" >(i</span>tem, index) =&gt; {</span>
-      const key = <span class="cstat-no" title="statement not covered" >`${JSON.stringify(item)}-${index}-${containerRecursionId}`;</span>
-<span class="cstat-no" title="statement not covered" >      return (</span>
-        {
-          divider: (
-            &lt;AnimationGroup display={isExpandedState} key={key} darkerBackground={item.darkerBackground}&gt;
-              &lt;hr className={`${hasDarkerBackground(item.darkerBackground)}`}/&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          container: getDynamicContent(
-            item.items,
-            item.className,
-            containerRecursionId + 1
-          ),
-          linkBack: (
-            &lt;AnimationGroup display={isExpandedState} key={key}&gt;
-              &lt;NavLinkInline
-                className="link-back"
-                icon={getDynamicIcon('ChevronLeft')}
-                url={item.url}
-                label={item.label}
-                linkCallback={linkCallback}
-                showLabel={true}
-                useTooltips={useTooltips}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          linkHome: (
-            &lt;AnimationGroup display={isExpandedState} key={key}&gt;
-              &lt;NavLinkInline
-                className="account-home-link"
-                icon={getDynamicIcon(item?.icon)}
-                url={item.url}
-                label={item.label}
-                linkCallback={linkCallback}
-                showLabel={true}
-                useTooltips={useTooltips}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          practiceDetails: (
-            &lt;AnimationGroup
-              display={isExpandedState}
-              className={'details'}
-              key={key}
-            &gt;
-              &lt;PracticeDetails
-                practiceName={item.practiceName}
-                {...(!item.practiceTin
-                  ? {}
-                  : { practiceTin: item.practiceTin })}
-                {...(!item.apmEntityId
-                  ? {}
-                  : { apmEntityId: item.apmEntityId })}
-                {...(!item.vgId ? {} : { vgId: item.vgId })}
-                {...(!item.cpcPlusId ? {} : { cpcPlusId: item.cpcPlusId })}
-                {...(!item.pcfId ? {} : { pcfId: item.pcfId })}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          individualDetails: (
-            &lt;AnimationGroup display={isExpandedState} key={key}&gt;
-              &lt;IndividualDetails
-                individualName={item.individualName}
-                individualNpi={item.individualNpi}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          linkDrawer: (
-            &lt;NavLinkDrawer
-              key={key}
-              isExpanded={isExpandedState}
-              isAlwaysOpen={item.isAlwaysOpen}
-              openByDefault={openDrawersByDefault}
-              rightIcon="chevron-down"
-              leftIcon={getDynamicIcon(item?.icon)}
-              className={linkClass}
-              label={item.label}
-              linkActiveFunc={linkActiveFunc}
-              linkCallback={linkCallback}
-              listOfLinks={item.items}
-              url={item.url}
-              sidebarExpand={expand}
-              isHighlighted={item.isHighlighted}
-              darkerBackground={item.darkerBackground}
-              leftBorderHighlightDisabled={item.leftBorderHighlightDisabled}
-              largerDrawerBottomPadding={item.largerDrawerBottomPadding}
-            /&gt;
-          ),
-          custom: (
-            &lt;AnimationGroup display={isExpandedState} key={key}&gt;
-              &lt;SanitizedContent
-                html={item.content}
-                customClassName={item.customClassName}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          chart: (
-            &lt;AnimationGroup display={isExpandedState} key={key}&gt;
-              &lt;ScoreChart
-                chartData={item.chartData}
-                linkCallback={linkCallback}
-                performanceYear={performanceYear}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-          switchLink: (
-            &lt;AnimationGroup display={isExpandedState} key={key}&gt;
-              &lt;CmsSwitchLink
-                linkCallback={linkCallback}
-                label={item.label}
-                url={item.url}
-              /&gt;
-            &lt;/AnimationGroup&gt;
-          ),
-        }[item.type] || (
-          &lt;NavLinkInline
-            key={key}
-            icon={getDynamicIcon(item?.icon)}
-            className={item.className ? item.className : linkClass}
-            url={item.url}
-            label={item.label}
-            linkCallback={linkCallback}
-            showLabel={isExpandedState}
-            disabled={item.disabled}
-            useTooltips={useTooltips}
-            target={item.target}
-          /&gt;
-        )
-      );
-    });
+        const itemsMarkup = <span class="cstat-no" title="statement not covered" >(contentItems || []).map(<span class="fstat-no" title="function not covered" >(i</span>tem, index) =&gt; {</span>
+            const key = <span class="cstat-no" title="statement not covered" >`${JSON.stringify(</span>
+                item
+            )}-${index}-${containerRecursionId}`;
+<span class="cstat-no" title="statement not covered" >            return (</span>
+                {
+                    divider: (
+                        &lt;AnimationGroup
+                            display={isExpandedState}
+                            key={key}
+                            darkerBackground={item.darkerBackground}
+                        &gt;
+                            &lt;hr
+                                className={`${hasDarkerBackground(
+                                    item.darkerBackground
+                                )}`}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    container: getDynamicContent(
+                        item.items,
+                        item.className,
+                        containerRecursionId + 1
+                    ),
+                    linkBack: (
+                        &lt;AnimationGroup display={isExpandedState} key={key}&gt;
+                            &lt;NavLinkInline
+                                className="link-back"
+                                icon={getDynamicIcon("ChevronLeft")}
+                                url={item.url}
+                                label={item.label}
+                                linkCallback={linkCallback}
+                                showLabel={true}
+                                useTooltips={useTooltips}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    linkHome: (
+                        &lt;AnimationGroup display={isExpandedState} key={key}&gt;
+                            &lt;NavLinkInline
+                                className="account-home-link"
+                                icon={getDynamicIcon(item?.icon)}
+                                url={item.url}
+                                label={item.label}
+                                linkCallback={linkCallback}
+                                showLabel={true}
+                                useTooltips={useTooltips}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    practiceDetails: (
+                        &lt;AnimationGroup
+                            display={isExpandedState}
+                            className={"details"}
+                            key={key}
+                        &gt;
+                            &lt;PracticeDetails
+                                practiceName={item.practiceName}
+                                {...(!item.practiceTin
+                                    ? {}
+                                    : { practiceTin: item.practiceTin })}
+                                {...(!item.apmEntityId
+                                    ? {}
+                                    : { apmEntityId: item.apmEntityId })}
+                                {...(!item.vgId ? {} : { vgId: item.vgId })}
+                                {...(!item.cpcPlusId
+                                    ? {}
+                                    : { cpcPlusId: item.cpcPlusId })}
+                                {...(!item.pcfId ? {} : { pcfId: item.pcfId })}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    individualDetails: (
+                        &lt;AnimationGroup display={isExpandedState} key={key}&gt;
+                            &lt;IndividualDetails
+                                individualName={item.individualName}
+                                individualNpi={item.individualNpi}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    linkDrawer: (
+                        &lt;NavLinkDrawer
+                            key={key}
+                            isExpanded={isExpandedState}
+                            isAlwaysOpen={item.isAlwaysOpen}
+                            openByDefault={openDrawersByDefault}
+                            rightIcon="chevron-down"
+                            leftIcon={getDynamicIcon(item?.icon)}
+                            className={linkClass}
+                            label={item.label}
+                            linkActiveFunc={linkActiveFunc}
+                            linkCallback={linkCallback}
+                            listOfLinks={item.items}
+                            url={item.url}
+                            sidebarExpand={expand}
+                            isHighlighted={item.isHighlighted}
+                            darkerBackground={item.darkerBackground}
+                            leftBorderHighlightDisabled={
+                                item.leftBorderHighlightDisabled
+                            }
+                            largerDrawerBottomPadding={
+                                item.largerDrawerBottomPadding
+                            }
+                        /&gt;
+                    ),
+                    custom: (
+                        &lt;AnimationGroup display={isExpandedState} key={key}&gt;
+                            &lt;SanitizedContent
+                                html={item.content}
+                                customClassName={item.customClassName}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    chart: (
+                        &lt;AnimationGroup display={isExpandedState} key={key}&gt;
+                            &lt;ScoreChart
+                                chartData={item.chartData}
+                                linkCallback={linkCallback}
+                                performanceYear={performanceYear}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                    switchLink: (
+                        &lt;AnimationGroup display={isExpandedState} key={key}&gt;
+                            &lt;CmsSwitchLink
+                                linkCallback={linkCallback}
+                                label={item.label}
+                                url={item.url}
+                            /&gt;
+                        &lt;/AnimationGroup&gt;
+                    ),
+                }[item.type] || (
+                    &lt;NavLinkInline
+                        key={key}
+                        icon={getDynamicIcon(item?.icon)}
+                        className={item.className ? item.className : linkClass}
+                        url={item.url}
+                        label={item.label}
+                        linkCallback={linkCallback}
+                        showLabel={isExpandedState}
+                        disabled={item.disabled}
+                        useTooltips={useTooltips}
+                        target={item.target}
+                    /&gt;
+                )
+            );
+        });
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    if (className === 'link-container') {</span>
-<span class="cstat-no" title="statement not covered" >      return (</span>
-        &lt;div
-          className="animation-flat"
-          key={`nav-link-container-${recursionId}`}
-        &gt;
-          &lt;NavLinkContainer
-            listOfLinks={itemsMarkup}
-            linkActiveFunc={linkActiveFunc}
-          /&gt;
-        &lt;/div&gt;
-      );
-    } else {
-<span class="cstat-no" title="statement not covered" >      return &lt;div className={className}&gt;{itemsMarkup}&lt;/div&gt;;</span>
-    }
-  };
+<span class="cstat-no" title="statement not covered" >        if (className === "link-container") {</span>
+<span class="cstat-no" title="statement not covered" >            return (</span>
+                &lt;div
+                    className="animation-flat"
+                    key={`nav-link-container-${recursionId}`}
+                &gt;
+                    &lt;NavLinkContainer
+                        listOfLinks={itemsMarkup}
+                        linkActiveFunc={linkActiveFunc}
+                    /&gt;
+                &lt;/div&gt;
+            );
+        } else {
+<span class="cstat-no" title="statement not covered" >            return &lt;div className={className}&gt;{itemsMarkup}&lt;/div&gt;;</span>
+        }
+    };
 &nbsp;
-  const content = itemsState
-    ? <span class="branch-0 cbranch-no" title="branch not covered" >getDynamicContent(</span>
-        itemsState,
-        'sidebar-content' + (isAltStyle ? ' alt-style' : '')
-      )
-    : getLevelContent();
+    const content = itemsState
+        ? <span class="branch-0 cbranch-no" title="branch not covered" >getDynamicContent(</span>
+              itemsState,
+              "sidebar-content" + (isAltStyle ? " alt-style" : "")
+          )
+        : getLevelContent();
 &nbsp;
-  useEffect(() =&gt; {
-    setIsExpandedState(isExpanded);
-  }, [isExpanded]);
+    useEffect(() =&gt; {
+        setIsExpandedState(isExpanded);
+    }, [isExpanded]);
 &nbsp;
-  useEffect(() =&gt; {
-    setCurrentLevelState(currentLevel);
-  }, [currentLevel]);
+    useEffect(() =&gt; {
+        setCurrentLevelState(currentLevel);
+    }, [currentLevel]);
 &nbsp;
-  useEffect(() =&gt; {
-    setItemsState(items);
-  }, [items]);
+    useEffect(() =&gt; {
+        setItemsState(items);
+    }, [items]);
 &nbsp;
-  return (
-    &lt;aside
-      id="qppSidebar"
-      tabIndex="-1"
-      className={`${isExpandedState ? 'sidebar' : <span class="branch-1 cbranch-no" title="branch not covered" >'sidebar closed'}</span> sidebar-${
-        config.navClassName
-      }`}
-    &gt;
-      &lt;SVGInline svg={svgIcons} /&gt;
-      {content}
-      &lt;NavLinkToggle
-        isAltStyle={isAltStyle}
-        collapseRef={collapseRef}
-        isExpanded={isExpandedState}
-        onClick={toggleExpanded}
-      /&gt;
-    &lt;/aside&gt;
-  );
+    return (
+        &lt;aside
+            id="qppSidebar"
+            tabIndex="-1"
+            className={`${
+                isExpandedState ? "sidebar" : <span class="branch-1 cbranch-no" title="branch not covered" >"sidebar closed"</span>
+            } sidebar-${config.navClassName}`}
+        &gt;
+            &lt;SVGInline svg={svgIcons} /&gt;
+            {content}
+            &lt;NavLinkToggle
+                isAltStyle={isAltStyle}
+                collapseRef={collapseRef}
+                isExpanded={isExpandedState}
+                onClick={toggleExpanded}
+            /&gt;
+        &lt;/aside&gt;
+    );
 };
 &nbsp;
 SideNavUI.propTypes = {
-  currentLevel: PropTypes.number,
-  isExpanded: PropTypes.bool,
-  onExpanded: PropTypes.func,
-  onCollapsed: PropTypes.func,
-  chartData: PropTypes.object,
-  config: PropTypes.object,
-  items: PropTypes.object,
-  isAltStyle: PropTypes.bool,
-  showReportingLinks: PropTypes.bool,
-  performanceYear: PropTypes.string,
-  svgIcons: PropTypes.string,
-  result: PropTypes.shape({
-    content: PropTypes.shape({
-      default: PropTypes.arrayOf(PropTypes.object),
-      devPre: PropTypes.arrayOf(PropTypes.object),
-      internalReviewers: PropTypes.arrayOf(PropTypes.object),
-      viewer: PropTypes.arrayOf(PropTypes.object),
+    currentLevel: PropTypes.number,
+    isExpanded: PropTypes.bool,
+    onExpanded: PropTypes.func,
+    onCollapsed: PropTypes.func,
+    chartData: PropTypes.object,
+    config: PropTypes.object,
+    items: PropTypes.object,
+    isAltStyle: PropTypes.bool,
+    showReportingLinks: PropTypes.bool,
+    performanceYear: PropTypes.string,
+    svgIcons: PropTypes.string,
+    result: PropTypes.shape({
+        content: PropTypes.shape({
+            default: PropTypes.arrayOf(PropTypes.object),
+            devPre: PropTypes.arrayOf(PropTypes.object),
+            internalReviewers: PropTypes.arrayOf(PropTypes.object),
+            viewer: PropTypes.arrayOf(PropTypes.object),
+        }),
     }),
-  }),
 };
 &nbsp;
 SideNavUI.defaultProps = {
-  currentLevel: 1,
-  isExpanded: true,
-  onExpanded: <span class="fstat-no" title="function not covered" >()</span> =&gt; {},
-  onCollapsed: <span class="fstat-no" title="function not covered" >()</span> =&gt; {},
-  chartData: {},
-  config: {},
-  items: null,
-  isAltStyle: false,
-  showReportingLinks: false,
-  performanceYear: '2017',
-  svgIcons: SVGIcons,
-  result: {
-    content: {
-      default: [],
-      devPre: [],
-      internalReviewers: [],
-      viewer: [],
+    currentLevel: 1,
+    isExpanded: true,
+    onExpanded: <span class="fstat-no" title="function not covered" >()</span> =&gt; {},
+    onCollapsed: <span class="fstat-no" title="function not covered" >()</span> =&gt; {},
+    chartData: {},
+    config: {},
+    items: null,
+    isAltStyle: false,
+    showReportingLinks: false,
+    performanceYear: "2017",
+    svgIcons: SVGIcons,
+    result: {
+        content: {
+            default: [],
+            devPre: [],
+            internalReviewers: [],
+            viewer: [],
+        },
     },
-  },
 };
 &nbsp;
 export default withGetConfig(SideNavUI, {
-  timeout: 5,
-  url: '/config/side-navigation',
-  localStorageName: 'qpp_side_navigation',
-  defaultContent,
+    timeout: 5,
+    url: "/config/side-navigation",
+    localStorageName: "qpp_side_navigation",
+    defaultContent,
 });
 &nbsp;</pre></td></tr></table></pre>
 
@@ -1069,7 +1129,7 @@ export default withGetConfig(SideNavUI, {
             <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 Mon Mar 14 2022 14:52:06 GMT-0700 (Pacific Daylight Time)
+                at Thu Mar 24 2022 11:31:04 GMT-0700 (Pacific Daylight Time)
             </div>
         <script src="../../../../prettify.js"></script>
         <script>