Fix TypeScript errors on nav components (#12)

- Remove unused `icons` object.
- Force `route.pages.length` to a boolean.

Author: fwextensions

packages/astro/src/components/FooterNav.astro

@@ -1,15 +1,6 @@
 ---
 import { Icon } from "astro-icon/components";
 
-const icons = {
-  twitter: "twitter",
-  facebook: "facebook",
-  linkedin: "linkedin",
-  github: "github",
-  slack: "slack",
-  meetup: "meetup",
-};
-
 const routes = [
   [
     "Resources",
@@ -44,7 +35,7 @@ const routes = [
       ["https://www.meetup.com/sfcivictech/", "meetup", true],
     ],
   ],
-];
+] as const;
 // because of annoying differences between dev and build modes, due to this
 // behavior (https://github.com/withastro/astro/issues/5630), always remove
 // any trailing slash so currentPage can match the pages above

packages/astro/src/components/HeaderNav.astro

@@ -29,9 +29,9 @@ const currentPage = fullPath.slice(fullPath.lastIndexOf("/") + 1);
 	</ul>
 	<ul>
 		{routes.map(route => (
-            <li class={`nav-item ${route.pages?.length > 0 ? "dropdown" : ""}`}>
+            <li class={`nav-item ${!!route.pages?.length ? "dropdown" : ""}`}>
                 <a href={route.page} aria-current={currentPage === route.page ? "page" : false}>{route.label}</a>
-                {route.pages?.length > 0 && 
+                {!!route.pages?.length &&
                     <div class="dropdown-content">
                         {route.pages.map(page => (
                             <a href={page.page} aria-current={currentPage === page.page ? "page" : false}>{page.label}</a>
@@ -54,7 +54,7 @@ const currentPage = fullPath.slice(fullPath.lastIndexOf("/") + 1);
         position: relative;
         display: inline-block;
     }
-    
+
     .dropdown-content {
         display: none;
         position: absolute;
@@ -63,16 +63,16 @@ const currentPage = fullPath.slice(fullPath.lastIndexOf("/") + 1);
         box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
         z-index: 1;
     }
-    
+
     .dropdown-content a {
         color: black;
         padding: 12px 16px;
         text-decoration: none;
         display: block;
     }
-    
+
     .dropdown:hover .dropdown-content {
         display: block;
     }
-    
+
 </style>