components/Navbar/Navbar.tsx

import Link from "@/components/Navigation/Link";
import styles from "@/styles/Navbar.module.css";
import { pages } from "@/utils/pages";
import Image from "next/image";
import logo from "../../images/sudobot.png";
import Search from "../Searching/Search";
import NavbarClientSide from "./NavbarClientSide";
import { NavbarTitle } from "./NavbarTitle";

export default function Navbar() {
    return (
        <nav className={styles.nav}>
            <a className={styles.logoWrapper} href="/">
                <Image src={logo.src} alt="Logo" height={128} width={128} />
                <span className="mobile">SudoBot</span>
                <NavbarTitle />
            </a>

            <ul className={`${styles.ul} desktop`}>
                {pages.map(link => {
                    const LinkComponent = link.url.startsWith("/") ? Link : "a";
                    return (
                        <li key={`${link.url}_${link.name}`}>
                            <LinkComponent
                                href={link.url}
                                {...(/^http(s?):\/\//gi.test(link.url)
                                    ? { target: "_blank", rel: "noreferrer" }
                                    : {})}
                                title={link.name}
                            >
                                {link.name}
                            </LinkComponent>
                        </li>
                    );
                })}
            </ul>

            <Search />

            <NavbarClientSide />
        </nav>
    );
}
1	rakinar2	575	import Link from "@/components/Navigation/Link";
2			import styles from "@/styles/Navbar.module.css";
3			import { pages } from "@/utils/pages";
4			import Image from "next/image";
5			import logo from "../../images/sudobot.png";
6			import Search from "../Searching/Search";
7			import NavbarClientSide from "./NavbarClientSide";
8	rakinar2	626	import { NavbarTitle } from "./NavbarTitle";
9	rakinar2	575
10			export default function Navbar() {
11			return (
12			<nav className={styles.nav}>
13			<a className={styles.logoWrapper} href="/">
14			<Image src={logo.src} alt="Logo" height={128} width={128} />
15			<span className="mobile">SudoBot</span>
16	rakinar2	626	<NavbarTitle />
17	rakinar2	575	</a>
18
19			<ul className={`${styles.ul} desktop`}>
20			{pages.map(link => {
21			const LinkComponent = link.url.startsWith("/") ? Link : "a";
22			return (
23			<li key={`${link.url}_${link.name}`}>
24			<LinkComponent
25			href={link.url}
26			{...(/^http(s?):\/\//gi.test(link.url)
27			? { target: "_blank", rel: "noreferrer" }
28			: {})}
29			title={link.name}
30			>
31			{link.name}
32			</LinkComponent>
33			</li>
34			);
35			})}
36			</ul>
37
38			<Search />
39
40			<NavbarClientSide />
41			</nav>
42			);
43			}