1#@!#!123s

ALWAYS HENGHENG888 1#@!#!123s
: / var / www / smartweb / priyoholidays.com / src / components / pages / dashboard / includes /
Filename : DashboardCardItem.tsx
back
"use client";
import React, { ReactNode } from "react";
import Link from "next/link";
import { cn } from "@/helpers/general";

interface Props {
  href?: string;
  icon?: string;
  text: string | ReactNode;
  external?: boolean;
  classNames?: {
    cardClass?: string | undefined;
    textClass?: string | undefined;
  };
}

export default function DashboardCardItem({
  href = "/",
  external = false,
  icon = "",
  text = "Orders",
  classNames,
  ...rest
}: Props) {

  if (external) {
    return (
      <div
        className={cn(
          "group inline-block h-[90px] lg:h-[170px] w-full lg:w-[200px] shadow border-2 border-neutral-400 hover:border-[#F85606] rounded-xl hover:shadow-xl",
          classNames?.cardClass
        )}
      >
        <a
          href={href}
          className="h-full flex justify-center items-center"
          {...rest}
        >
          <div className="p-4">
            {!!icon && (
              <div className="mb-2 lg:mb-4 text-center mx-auto">
                <span
                  className={
                    "flex justify-center items-center text-neutral-900 group-hover:text-[#F85606]"
                  }
                >
                  {icon}
                </span>
              </div>
            )}
            <p
              className={cn(
                "text-neutral-900 group-hover:text-[#F85606] text-[12px] lg:text-xl font-semibold m-0 text-center",
                classNames?.textClass
              )}
            >
              {text}
            </p>
          </div>
        </a>
      </div>
    );
  }

  return (
    <div
      className={cn(
        "group inline-block h-[90px] lg:h-[170px] w-full lg:w-[200px] shadow border-2 border-neutral-400 hover:border-[#F85606] rounded-xl hover:shadow-xl",
        classNames?.cardClass
      )}
    >
      <Link
        href={href}
        className="h-full flex justify-center items-center"
        {...rest}
      >
        <div className="p-4 ">
          {!!icon && (
            <div className="mb-2 lg:mb-4 text-center mx-auto">
              <span
                className={
                  "flex justify-center items-center text-neutral-900 group-hover:text-[#F85606]"
                }
              >
                {icon}
              </span>
            </div>
          )}
          <p
            className={cn(
              "text-neutral-900 group-hover:text-[#F85606] text-[12px] lg:text-xl font-semibold m-0 text-center",
              classNames?.textClass
            )}
          >
            {text}
          </p>
        </div>
      </Link>
    </div>
  );
}