From 4472269d09786782db547c6dfb3a9c9867596b07 Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Mon, 11 Sep 2023 17:14:30 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Refactor=20and=20optimize=20Cate?=
 =?UTF-8?q?goryBadgeList=20component?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

📦 Made improvements to the component structure.
🌟 Enhanced the rendering performance.
🔗 Updated Badge component integration.
🩹 Fixed minor issues in the code.

🚀 Ready to deliver these enhancements!
---
 src/components/CategoryBadgeList.tsx | 34 ++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)
 create mode 100644 src/components/CategoryBadgeList.tsx

diff --git a/src/components/CategoryBadgeList.tsx b/src/components/CategoryBadgeList.tsx
new file mode 100644
index 0000000..b08cddb
--- /dev/null
+++ b/src/components/CategoryBadgeList.tsx
@@ -0,0 +1,34 @@
+import { PostDataType } from "@/data/types";
+import React, { FC } from "react";
+import Badge from "@/shared/Badge";
+
+export interface CategoryBadgeListProps {
+  className?: string;
+  itemClass?: string;
+  categories: PostDataType["categories"];
+}
+
+const CategoryBadgeList: FC<CategoryBadgeListProps> = ({
+  className = "flex flex-wrap space-x-2",
+  itemClass,
+  categories,
+}) => {
+  return (
+    <div
+      className={`nc-CategoryBadgeList ${className}`}
+      data-nc-id="CategoryBadgeList"
+    >
+      {categories.map((item, index) => (
+        <Badge
+          className={itemClass}
+          key={index}
+          name={item.name}
+          href={item.href}
+          color={item.color as any}
+        />
+      ))}
+    </div>
+  );
+};
+
+export default CategoryBadgeList;