From f20339c39949e29798e8f58d3829a1536e129e33 Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Sat, 9 Sep 2023 16:57:10 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F=20Implemented=20Tag=20com?=
 =?UTF-8?q?ponent=20=E2=9C=A8=20Added=20a=20new=20Tag=20component=20for=20?=
 =?UTF-8?q?displaying=20taxonomy=20tags.=20=F0=9F=9A=80=20Ready=20to=20use?=
 =?UTF-8?q?=20in=20our=20Next.js=20project!=20=F0=9F=8E=A8=20Styled=20for?=
 =?UTF-8?q?=20both=20light=20and=20dark=20themes.=20=F0=9F=93=88=20Support?=
 =?UTF-8?q?s=20optional=20tag=20count=20display.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/shared/Tag.tsx | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)
 create mode 100644 src/shared/Tag.tsx

diff --git a/src/shared/Tag.tsx b/src/shared/Tag.tsx
new file mode 100644
index 0000000..41813b9
--- /dev/null
+++ b/src/shared/Tag.tsx
@@ -0,0 +1,26 @@
+import { TaxonomyType } from "@/data/types";
+import { Route } from "@/routers/types";
+import Link from "next/link";
+import React, { FC } from "react";
+
+export interface TagProps {
+  className?: string;
+  tag: TaxonomyType;
+  hideCount?: boolean;
+}
+
+const Tag: FC<TagProps> = ({ className = "", tag, hideCount = false }) => {
+  return (
+    <Link
+      className={`nc-Tag inline-block bg-white text-sm text-neutral-6000 dark:text-neutral-300 py-2 px-3 rounded-lg border border-neutral-100 md:py-2.5 md:px-4 dark:bg-neutral-700 dark:border-neutral-700 hover:border-neutral-200 dark:hover:border-neutral-6000 ${className}`}
+      href={tag.href as Route}
+    >
+      {`${tag.name}`}
+      {!hideCount && (
+        <span className="text-xs font-normal"> ({tag.count})</span>
+      )}
+    </Link>
+  );
+};
+
+export default Tag;