Moved code into src folder. Added build for component library.

src/components/layout/NavGroup.js

@@ -0,0 +1,58 @@
+import { useState } from 'react';
+import { Icon, Text, TooltipPopup } from 'react-basics';
+import classNames from 'classnames';
+import { useRouter } from 'next/router';
+import Link from 'next/link';
+import Icons from 'components/icons';
+import styles from './NavGroup.module.css';
+
+export function NavGroup({
+  title,
+  items,
+  defaultExpanded = true,
+  allowExpand = true,
+  minimized = false,
+}) {
+  const { pathname } = useRouter();
+  const [expanded, setExpanded] = useState(defaultExpanded);
+
+  const handleExpand = () => setExpanded(state => !state);
+
+  return (
+    <div
+      className={classNames(styles.group, {
+        [styles.expanded]: expanded,
+        [styles.minimized]: minimized,
+      })}
+    >
+      {title && (
+        <div className={styles.header} onClick={allowExpand ? handleExpand : undefined}>
+          <Text>{title}</Text>
+          <Icon size="sm" rotate={expanded ? 0 : -90}>
+            <Icons.ChevronDown />
+          </Icon>
+        </div>
+      )}
+      <div className={styles.body}>
+        {items.map(({ label, url, icon, divider }) => {
+          return (
+            <TooltipPopup key={label} label={label} position="right" disabled={!minimized}>
+              <Link
+                href={url}
+                className={classNames(styles.item, {
+                  [styles.divider]: divider,
+                  [styles.selected]: pathname.startsWith(url),
+                })}
+              >
+                <Icon>{icon}</Icon>
+                <Text className={styles.text}>{label}</Text>
+              </Link>
+            </TooltipPopup>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
+
+export default NavGroup;