Update the sidebar to support different sections

webapp/src/components/DataPage.tsx

@@ -5,6 +5,7 @@ import PageHeader from "../components/global/PageHeader"
 import SectionLink from "../components/global/SectionLink";
 import SectionNavigation from "./SectionNavigation";
 import { Sections } from "../helpers/constants";
+import PolicySidebar from "./PolicySidebar";
 
 interface inputProps {
     title: string,
@@ -16,7 +17,8 @@ interface inputProps {
 function DataPage({ title, filter, children, category }: inputProps): ReactElement {
     return (
         <>
-            <OrganizationSidebar />
+            {category === Sections.Organisation && <OrganizationSidebar />}
+            {category === Sections.Policy && <PolicySidebar />}
             <PageHeader type={'data'} header={'Compendium Data'}>
                 <SectionLink section={"Reports"} />
             </PageHeader>

webapp/src/components/OrganizationSidebar.tsx

@@ -50,11 +50,6 @@ const OrganizationSidebar = () => {
                     <span>NREN Involvement in European Commission Projects</span>
                 </Link>
             </Row>
-            <Row>
-                <Link to="/policy" className="link-text-underline">
-                    <span>NREN Policies</span>
-                </Link>
-            </Row>
         </Sidebar>
     )
 }

webapp/src/components/PolicySidebar.tsx

+import React from 'react';
+import { Link } from 'react-router-dom';
+import { Row } from 'react-bootstrap';
+import Sidebar from './SideBar';
+
+const PolicySidebar = () => {
+    return (
+        <Sidebar>
+            <h5>Standards and Policies</h5>
+            <Row>
+                <Link to="/policy" className="link-text-underline">
+                    <span>NREN Policies</span>
+                </Link>
+            </Row>
+        </Sidebar>
+    )
+}
+
+export default PolicySidebar
\ No newline at end of file

webapp/src/scss/layout/Sidebar.scss

@@ -21,6 +21,7 @@
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
     border: $yellow-orange 2px solid;
     pointer-events: auto;
+    width: 28rem;
 
     a {
         padding-top: 0.3rem;