update src/components/CardTrelloDesign/index.js

src/components/CardTrelloDesign/index.js

@@ -9,11 +9,11 @@ import messageText from "./images/message-text.svg";
 import ProfilePicNextToEachOther from "../ProfilePicNextToEachOther";
 import AnimatedProgressBar from "../AnimatedProgressBar";
 
-const CardTrelloDesign = ({ circle,commnets,buttons,tags, }) => {
+const CardTrelloDesign = ({ circle,commnets,buttons,tags,showBtn,showTag }) => {
   return (
     <div className="w-3/12 mx-auto bg-white mt-10 rounded-md shadow p-3">
       {/* top */}
-      <div className="flex flex-row justify-between items-center">
+      <div className="flex flex-row justify-between items-center" style={{direction: circle === false ? "ltr" : "rtl"}}>
         {/* right */}
         {circle && (
           <CircleInCircle
@@ -27,7 +27,7 @@ const CardTrelloDesign = ({ circle,commnets,buttons,tags, }) => {
         )}
         {/* left */}
         <div className="flex flex-row gap-x-1 items-center place-content-end">
-          {buttons.map(btn=> <ButtonNewDesign
+          {showBtn && buttons.map(btn=> <ButtonNewDesign
             bgColor={`bg-[${btn.color}]`}
             bgHoverColor={"bg-transparent"}
             border={"border-none"}
@@ -37,7 +37,8 @@ const CardTrelloDesign = ({ circle,commnets,buttons,tags, }) => {
             borderRadius={"rounded-sm"}
             icon={false}
             text={btn.name}
-          />)}
+          />
+          )}
         </div>
       </div>
       {/* middle */}
@@ -63,7 +64,7 @@ const CardTrelloDesign = ({ circle,commnets,buttons,tags, }) => {
             <img src={messageText} alt="comment-icon" className="w-5" />
           </div>
           )}
-          {tags.map(tag => 
+          {showTag && tags.map(tag => 
               <NewTagDesign
               title={tag.title}
               align={"flex-row-reverse"}
@@ -92,6 +93,8 @@ export default CardTrelloDesign;
 CardTrelloDesign.defaultProps = {
   circle: true,
   commnets: true,
+
+  showBtn: true,
   buttons: [
     {
       name: "رابط کاربری",
@@ -106,6 +109,8 @@ CardTrelloDesign.defaultProps = {
       color: "#C7FF0A"
     }
   ],
+
+  showTag:true,
   tags: [
     {
       title:"29 فروردین",
@@ -119,6 +124,5 @@ CardTrelloDesign.defaultProps = {
       bgColor: "#FFAA0033",
       icon: nike
     },
-  ]
+  ],
-
 };