re-add next-remote-watch as local dev server

components/Menu/Menu.tsx

@@ -1,8 +1,8 @@
 import { memo } from "react";
 import { useRouter } from "next/router";
 import classNames from "classnames";
-import MenuLink from "../MenuLink/MenuLink";
-import { menuLinks } from "../../lib/config/menu";
+import MenuItem from "../MenuItem/MenuItem";
+import { menuItems } from "../../lib/config/menu";
 
 import styles from "./Menu.module.css";
 
@@ -15,10 +15,10 @@ const Menu = ({ className }: MenuProps) => {
 
   return (
     <ul className={classNames(styles.menu, className)}>
-      {menuLinks.map((link, index) => (
+      {menuItems.map((item, index) => (
         <li key={index} className={styles.item}>
           {/* kinda weird/hacky way to determine if the *first part* of the current path matches this href */}
-          <MenuLink {...link} current={link.href === `/${router.pathname.split("/")[1]}`} />
+          <MenuItem {...item} current={item.href === `/${router.pathname.split("/")[1]}`} />
         </li>
       ))}
     </ul>

components/MenuItem/MenuItem.tsx

@@ -1,9 +1,9 @@
 import Link from "next/link";
 import classNames from "classnames";
 
-import styles from "./MenuLink.module.css";
+import styles from "./MenuItem.module.css";
 
-export type MenuLinkProps = {
+export type MenuItemProps = {
   href?: string;
   text?: string;
   current?: boolean;
@@ -14,19 +14,23 @@ export type MenuLinkProps = {
   icon: any;
 };
 
-const MenuLink = ({ icon: Icon, href, text, current, className }: MenuLinkProps) => {
+const MenuItem = ({ icon: Icon, href, text, current, className }: MenuItemProps) => {
+  const linkContent = (
+    <>
+      <Icon className={classNames(styles.icon, className)} /> {text && <span className={styles.label}>{text}</span>}
+    </>
+  );
+
   // allow both navigational links and/or other interactive react components (e.g. the theme toggle)
   if (href) {
     return (
       <Link href={href} prefetch={false}>
-        <a className={classNames(styles.link, current && styles.current, className)}>
-          <Icon className={styles.icon} /> <span className={styles.label}>{text}</span>
-        </a>
+        <a className={classNames(styles.link, current && styles.current, className)}>{linkContent}</a>
       </Link>
     );
   } else {
-    return <Icon className={classNames(styles.icon, className)} />;
+    return linkContent;
   }
 };
 
-export default MenuLink;
+export default MenuItem;

lib/config/menu.ts

@@ -1,8 +1,8 @@
 import ThemeToggle from "../../components/ThemeToggle/ThemeToggle";
 import { HomeIcon, NotesIcon, ProjectsIcon, ContactIcon } from "../../components/Icons";
-import type { MenuLinkProps } from "../../components/MenuLink/MenuLink";
+import type { MenuItemProps } from "../../components/MenuItem/MenuItem";
 
-export const menuLinks: MenuLinkProps[] = [
+export const menuItems: MenuItemProps[] = [
   {
     icon: HomeIcon,
     text: "Home",

package.json

@@ -14,11 +14,11 @@
     "url": "https://github.com/jakejarvis/jarv.is.git"
   },
   "scripts": {
-    "dev": "cross-env NODE_OPTIONS='--inspect' next dev",
+    "dev": "cross-env NODE_OPTIONS='--inspect' next-remote-watch ./notes",
     "build": "next build",
     "analyze": "cross-env ANALYZE=true next build",
     "lint": "run-s lint:*",
-    "lint:next": "eslint .",
+    "lint:js": "eslint .",
     "lint:css": "stylelint '**/*.css'",
     "lint:prettier": "prettier --check ."
   },
@@ -28,7 +28,7 @@
     "@fontsource/roboto-mono": "4.5.3",
     "@giscus/react": "^1.1.2",
     "@hcaptcha/react-hcaptcha": "^1.1.0",
-    "@next/bundle-analyzer": "12.0.11-canary.17",
+    "@next/bundle-analyzer": "12.0.11-canary.18",
     "@novnc/novnc": "github:novnc/noVNC#679b45fa3b453c7cf32f4b4455f4814818ecf161",
     "@octokit/graphql": "^4.8.0",
     "@primer/octicons": "^16.3.1",
@@ -48,7 +48,7 @@
     "is-absolute-url": "^4.0.1",
     "markdown-to-jsx": "^7.1.6",
     "modern-normalize": "^1.1.0",
-    "next": "12.0.11-canary.17",
+    "next": "12.0.11-canary.18",
     "next-compose-plugins": "^2.2.1",
     "next-mdx-remote": "4.0.0-rc.2",
     "next-seo": "^5.1.0",
@@ -93,12 +93,13 @@
     "@typescript-eslint/parser": "^5.12.0",
     "cross-env": "^7.0.3",
     "eslint": "~8.9.0",
-    "eslint-config-next": "12.0.11-canary.17",
+    "eslint-config-next": "12.0.11-canary.18",
     "eslint-config-prettier": "~8.3.0",
     "eslint-plugin-import": "~2.25.4",
     "eslint-plugin-mdx": "~1.16.0",
     "eslint-plugin-prettier": "~4.0.0",
     "lint-staged": "^12.3.4",
+    "next-remote-watch": "^1.0.0",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.5.1",
     "simple-git-hooks": "^2.7.0",