import React, { useMemo } from "react";
import Link from "next/link";
import {
Home,
LineChart,
Menu,
Package,
Package2,
ShoppingCart,
Users,
} from "lucide-react";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from "@/components/ui/card";
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
import Head from "next/head";
import { sidebarNavs } from "@/config/constants/sidebarNavs";
import { cn } from "@/lib/utils";
import { useRouter } from "next/router";
import clsx from "clsx";
interface IProps {
leftComponent?: React.ReactNode | string;
rightComponent?: React.ReactNode | string;
title?: string;
}
export default function Header({ leftComponent, rightComponent, title }: IProps) {
const { pathname } = useRouter();
const pageTitle = useMemo(() => {
if (title && typeof title === "string") {
return title;
}
if (typeof leftComponent === "string") {
return leftComponent;
}
return "";
}, [title, leftComponent]);
const renderLeftComponent = () => {
if (typeof leftComponent === "string") {
return {leftComponent}
;
}
return leftComponent;
};
const renderRightComponent = () => {
if (typeof rightComponent === "string") {
return {rightComponent}
;
}
return rightComponent;
}
return (
<>
{!!pageTitle && (
{pageTitle} - Immich Power Tools
)}
{renderLeftComponent()}
{renderRightComponent()}
);
}