Issue #302: ADD button remove resoureces on profile page

src/app/components/Cards.js

@@ -29,6 +29,7 @@ export default function Cards(props) {
 
   const [deleteOpen, setDeleteOpen] = useState(false)
   const [userData, setUserData] = useState([])
+  const [userProfile, setUserProfile] = useState(false)
 
 
   useEffect(() => {
@@ -36,7 +37,18 @@ export default function Cards(props) {
 
     const data = JSON.parse(getStoredValue("user_data"));
     setUserData(data);
-  }, [userData])
+
+    /*Verifica se o usuario está na sua própria pagina de perfil*/
+    const baseUrl = typeof window !== 'undefined' ? window.location.href : '';
+    const profilePage = /\/perfil\//.test(baseUrl)
+    const userId = baseUrl.match(/\/perfil\/(\d+)/);
+
+    if (userId && profilePage) {
+      const compare = String(userId[1]) === String(data?.id);
+      profilePage && compare ? setUserProfile(true) : null;
+    }
+
+  }, [])
 
   /**
    * 
@@ -138,7 +150,7 @@ export default function Cards(props) {
     },
   ]
 
-  console.log("props: ", props)
+
 
   return (
     <Card
@@ -151,19 +163,18 @@ export default function Cards(props) {
         backgroundColor: "transparent",
         boxShadow: "none",
       }}
-      component={Link}
-      href={`/recurso/${props["id"]}` + (props.collectionSource ? `?collectionId=${props.collectionSource}` : "")}
+
     >
 
       <CardMedia
         id="conteudo"
         tabIndex="0"
-        className="hover:scale-[1.02] p-1 focus:border-turquoise-HC-white focus:border-4 border-gray-color transition-transform rounded-xl flex-shrink-0 aspect-video"
+        className="hover:scale-[1.02] p-1 focus:border-turquoise-HC-white focus:border-4 border-gray-color transition-transform rounded-xl flex-shrink-0 aspect-video justify-start"
         sx={{
           width: 327,
           height: 181,
         }}
-        component="img"
+        //component="img"
         image={
           props["image"] === null
             ? getDefaultThumbnail(props["type"])
@@ -171,13 +182,18 @@ export default function Cards(props) {
         }
         alt="imagem"
         title={props.title}
+        component={Link}
+        href={`/recurso/${props["id"]}` + (props.collectionSource ? `?collectionId=${props.collectionSource}` : "")}
       />
+
       {
         props.page === "recurso" ?
           <>
 
             <div className="flex flex-col ml-4 max-sm:ml-0 max-sm:justify-stretch">
-              <div className="line-clamp-2 text-lg font-bold text-darkGray-HC-white-underline min-h-4 max-sm:w-full"> {props["title"]}  </div>
+              <div
+                href={`/recurso/${props["id"]}` + (props.collectionSource ? `?collectionId=${props.collectionSource}` : "")}
+                className="line-clamp-2 text-lg font-bold text-darkGray-HC-white-underline min-h-4 max-sm:w-full"> {props["title"]}  </div>
 
               <div className=" flex flex-row ">
                 <div className="flex flex-col ">
@@ -194,18 +210,23 @@ export default function Cards(props) {
           </>
           :
           <>
-            <div className="flex flex-row mt-4 w-full justify-start outline outline-1 outline-ice-HC-white">
-              {props?.noAvatar || !props["avatar"] ? <div className={`flex items-center shrink-0 justify-center text-xl font-bold ml-1 text-ice-HC-dark rounded-full h-[33px] w-[33px] ${getRandomBg(props["id"])}`} >{props["author"][0]}</div>
-                :
+            <Link href={`/recurso/${props.id}${props.collectionSource ? `?collectionId=${props.collectionSource}` : ""}`} className="w-full">
+              <div className="flex flex-row mt-4 mb-3 w-full justify-start cursor-pointer">
+                {props?.noAvatar || !props["avatar"] ? (
+                  <div className={`flex items-center shrink-0 justify-center text-xl font-bold ml-1 text-ice-HC-dark rounded-full h-[33px] w-[33px] ${getRandomBg(props["id"])}`}>
+                    {props["author"][0]}
+                  </div>
+                ) : (
                   <img
                     src={mecredURL + props["avatar"]}
                     alt={props["author"]}
                     className="w-[33px] h-[33px] object-cover rounded-full"
-
                   />
-              }
+                )}
                 <div className="mx-2">
-                <div className="line-clamp-1 text-sm font-bold text-darkGray-HC-white-underline mb- w-[100%] min-h-4"> {props["title"]}  </div>
+                  <div className="line-clamp-1 text-sm font-bold text-darkGray-HC-white-underline mb- w-[100%] min-h-4">
+                    {props["title"]}
+                  </div>
                   <div className="flex flex-row">
                     <div className="flex flex-col">
                       <div>
@@ -220,11 +241,12 @@ export default function Cards(props) {
                   </div>
                 </div>
               </div>
-            {
+            </Link>
+            {userProfile ?
               <div className="flex justify-end w-full">
+                <DeleteModal open={deleteOpen} onClose={() => setDeleteOpen(false)} idLogin={userData["id"]} resourceId={props["id"]} />
                 {button.map((item, index) => (
                   <div key={index}>
-                    <DeleteModal open={deleteOpen} onClose={() => setDeleteOpen(false)} idLogin={userData["id"]} resourceId={props["id"]} onClick={item.action} />
                     <Button
                       onClick={item.action}
                       className="text-red-HC-white justify-end"
@@ -234,15 +256,18 @@ export default function Cards(props) {
                   </div>
                 ))}
               </div>
-
+              : null
             }
           </>
       }
       {props?.homologa == "submitted" ?
-        <div className="text-ice-HC-dark text-xs p-1 bg-turquoise-HC-dark rounded-full flex justify-start">Em homologação</div>
+        <div className="text-xs p-1 bg-turquoise-HC-dark rounded-full flex justify-start text-ice-HC-dark">Em homologação</div>
         :
         null
       }
     </Card>
   );
 }
+
+
+

src/app/components/GroupCardsCollections.js

@@ -30,7 +30,7 @@ export default function GroupCardsCollections({ data, cardsPerRow, collectionId
 
     <div className="flex flex-col">
       <div className="mx-1 flex flex-col">
-        <div id="contentSize" className={`flex content flex-wrap max-sm:justify-center mb-4 max-sm:ml-0  md:ml-0 ${expanded ? "" : "overflow-y-hidden h-[270px]"}`}>
+        <div id="contentSize" className={`flex content flex-wrap max-sm:justify-center mb-4 max-sm:ml-0 gap-1 md:ml-0 gap-5 ${expanded ? "" : "overflow-y-hidden h-[270px]"}`}>
 
         {data?.length !== 0 ? data?.sort((a,b) => a.position - b.position).map((item, index) => {
             return (