add search icon to the docs search button

documentation/player/skin-parts.md

@@ -16,8 +16,8 @@ GET /player/:part/:query
 ## Parts
 
 | Part | Description                     |
-|------|-----------------------|
+|------|---------------------------------|
-| head | Get the player's head |
+| head | Get the player's isometric head |
 | face | Get the player's face           |
 | body | Get the player's body           |
 

src/app/components/docs/search.tsx

@@ -5,6 +5,7 @@ import { Button } from "@/app/components/ui/button";
 import { Dialog, DialogContent, DialogTitle, DialogTrigger } from "@/app/components/ui/dialog";
 import { DocsContentMetadata } from "@/app/common/documentation";
 import { DocumentationPages } from "@/app/components/docs/documentation-pages";
+import { SearchIcon } from "lucide-react";
 
 export function Search(): ReactElement {
   /**
@@ -41,7 +42,10 @@ export function Search(): ReactElement {
       <div className="flex flex-col w-full">
         <Dialog>
           <DialogTrigger asChild>
-            <Button>Search</Button>
+            <Button className="flex items-center gap-1">
+              <SearchIcon width={16} height={16} />
+              <p>Search</p>
+            </Button>
           </DialogTrigger>
           <DialogContent className="w-screen md:w-[600px]">
             <DialogTitle>Search Documentation</DialogTitle>

src/app/components/navbar.tsx

@@ -61,7 +61,7 @@ export default function NavBar(): ReactElement {
       <div className="absolute inset-x-0 flex justify-center">
         <div className="flex gap-4">
           {pages.map((page, index) => {
-            const isActive = path.includes(page.url);
+            const isActive: boolean = path ? path.includes(page.url) : false;
 
             return (
               <HrefButton

src/app/not-found.tsx

@@ -1,7 +1,8 @@
 import Link from "next/link";
 import { Button } from "@/app/components/ui/button";
+import { ReactElement } from "react";
 
-export default function NotFound() {
+export default function NotFound(): ReactElement {
   return (
     <div className="flex text-center flex-col gap-4">
       <div>