update

src/components/ReactTable5/BasicTable.js

@@ -212,7 +212,7 @@ const BasicTable = ({ addTab, activeTab }) => {
             >
               <tbody
                 {...getTableBodyProps()}
-                className={"divide-y divide-gray-200 "}
+                className={"divide-y divide-gray-200 cursor-pointer"}
               >
                 {page.map((row, idx) => {
                   prepareRow(row);
@@ -278,18 +278,20 @@ const BasicTable = ({ addTab, activeTab }) => {
               {...getTableBodyProps()}
               className="flex flex-row flex-wrap gap-4 items-center justify-center"
             >
-              {page.map((row, index) => {
+              {page.map((row, idx) => {
                 prepareRow(row);
                 return (
                   <div
                     {...row.getRowProps()}
-                    className="flex flex-col items-stretch px-3 py-2 rounded-md w-52 relative"
-                    key={index}
-                    style={{ backgroundColor: "#F3F3F3" }}
+                    className={`flex flex-col items-stretch px-3 py-2 rounded-md w-52 relative ${
+                      chekedItems.includes(row.original.id)
+                        ? "bg-blue-200"
+                        : "bg-blue-100"
+                    }`}
+                    key={idx}
+                    // onClick={() => toggelChekedItems(row.original.id)}
                   >
-                    {/* {columns[5].Cell({ value: row.order_status })} */}
-                    {/* {console.log(row.values)} */}
-                    <div className="absolute left-3">
+                    <div onClick={() => toggelChekedItems(row.original.id)}>
                       {columns[0].Cell({ value: row.id })}
                     </div>
                     <img