From 9e7fcc8ed385d3bca9ee376a436cb6ecd9ed7ad0 Mon Sep 17 00:00:00 2001
From: mahdi andalib <andalibmahdi45@gmail.com>
Date: Mon, 4 Apr 2022 15:00:13 +0430
Subject: [PATCH] update

---
 src/App.js                         |  2 +-
 src/components/SelectYear/Month.js | 12 ++++++++--
 src/components/SelectYear/index.js | 38 ++++++++++++++++++++++++++++++
 3 files changed, 49 insertions(+), 3 deletions(-)

diff --git a/src/App.js b/src/App.js
index 6f57166..0e80dd9 100644
--- a/src/App.js
+++ b/src/App.js
@@ -115,7 +115,7 @@ function App() {
         {/* <TableDesign1 /> */}
         {/* <ReactTable2 /> */}
         {/* <ReactTable3 /> */}
-        {/* <ReactTable4 /> */}
+        <ReactTable4 />
         {/* <ReactTable5 /> */}
         {/* <Digikala /> */}
         <SidebarDesign2 />
diff --git a/src/components/SelectYear/Month.js b/src/components/SelectYear/Month.js
index ffb1f1e..1ca42ab 100644
--- a/src/components/SelectYear/Month.js
+++ b/src/components/SelectYear/Month.js
@@ -1,10 +1,18 @@
-import React from "react";
+import React, { useState } from "react";
 
 const Month = ({ items }) => {
+  const [selectedYear, setSelectedYear] = useState(null);
+
   return (
     <div className="flex flex-col">
       {items.map((item, index) => (
-        <span className="text-xs my-2" key={index}>
+        <span
+          onClick={() => setSelectedYear(selectedYear === item ? null : item)}
+          className={`text-xs my-2 cursor-pointer ${
+            selectedYear === item ? "text-[#06BACE] font-bold " : ""
+          }`}
+          key={index}
+        >
           {item.month}
         </span>
       ))}
diff --git a/src/components/SelectYear/index.js b/src/components/SelectYear/index.js
index cee05d8..b35f651 100644
--- a/src/components/SelectYear/index.js
+++ b/src/components/SelectYear/index.js
@@ -78,4 +78,42 @@ SelectYear.defaultProps = {
       components: <Month />,
     },
   ],
+  months: [
+    {
+      month: "فروردین",
+    },
+    {
+      month: "اردیبهشت",
+    },
+    {
+      month: "خرداد",
+    },
+    {
+      month: "تیر",
+    },
+    {
+      month: "مرداد",
+    },
+    {
+      month: "شهریور",
+    },
+    {
+      month: "مهر",
+    },
+    {
+      month: "آبان",
+    },
+    {
+      month: "آذر",
+    },
+    {
+      month: "دی",
+    },
+    {
+      month: "بهمن",
+    },
+    {
+      month: "اسفند",
+    },
+  ],
 };