resolved labels for images

NwinNwin · Sep 17, 2023 · 21981e3 · 21981e3
1 parent 4b82504
commit 21981e3
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 11 deletions.
diff --git a/src/components/Home/Home.jsx b/src/components/Home/Home.jsx
@@ -135,7 +135,6 @@ export default function Home() {
     };
     getData();
   }, []);
-  console.log("data", data)
 
   window.onresize = () => {
     setScreenWidth(window.screen.width);

diff --git a/src/components/ImageContainer/ImageContainer.jsx b/src/components/ImageContainer/ImageContainer.jsx
@@ -0,0 +1,27 @@
+import { Image, Flex, Text } from "@chakra-ui/react";
+
+export default function ImageContainer({ image, isresolved }) {
+  return (
+    <Flex>
+      {isresolved && <Flex
+        backgroundColor={"rgba(255, 123, 0, 0.9)"}
+        position={"absolute"}
+        w={282}
+        justifyContent={"center"}
+        alignItems={"center"}
+        marginTop={90}
+        flexDir={"column"}
+      >
+        <Text fontSize={18} as="b" color={"white"} >RETURNED</Text>
+        <Text fontSize={15} color={"white"} >This item has been returned.</Text>
+      </Flex>}
+      <Image
+        rounded={"lg"}
+        height={230}
+        width={282}
+        objectFit={"cover"}
+        src={image}
+      />
+    </Flex>
+  );
+}
diff --git a/src/components/InfoModal/InfoModal.jsx b/src/components/InfoModal/InfoModal.jsx
@@ -8,7 +8,6 @@ import {
   Text,
   Stack,
   useColorModeValue,
-  Image,
   Modal,
   ModalOverlay,
   ModalContent,
@@ -20,6 +19,7 @@ import { formatDate } from "../../utils";
 import { UserAuth } from "../../context/AuthContext";
 import DataContext from "../../context/DataContext";
 import axios from "axios";
+import ImageContainer from "../ImageContainer/ImageContainer";
 
 export default function InfoModal({ setData, isOpen, onClose, props }) {
   const [showEmail, setShowEmail] = useState(false);
@@ -52,7 +52,6 @@ export default function InfoModal({ setData, isOpen, onClose, props }) {
   }
 
   const formattedDate = formatDate(new Date(props.date));
-
   return (
     <Modal
       isOpen={isOpen}
@@ -109,13 +108,24 @@ export default function InfoModal({ setData, isOpen, onClose, props }) {
                 {props.name}
               </Heading>
 
-              <Image
-                rounded={"lg"}
-                height={230}
-                width={282}
-                objectFit={"cover"}
-                src={props.image}
-              />
+
+              <ImageContainer image={props.image} isresolved={props.isresolved}/>
+              {/* <Flex>
+                <Flex
+                  backgroundColor={"rgba(245, 44, 44, 0.5)"}
+                  float={"left"}
+                  position={"absolute"}
+                >
+                  <Text>RESOLVED</Text>
+                </Flex>
+                <Image
+                  rounded={"lg"}
+                  height={230}
+                  width={282}
+                  objectFit={"cover"}
+                  src={props.image}
+                />
+              </Flex> */}
 
               <Text
                 textAlign="center"

diff --git a/src/components/Map/Map.jsx b/src/components/Map/Map.jsx
@@ -151,7 +151,6 @@ export default function Map({
         isHelped: newAddedItem.isHelped,
       })
       .then((item) => {
-        console.log("item", item)
         const newItem = {
           image: newAddedItem.image,
           type: newAddedItem.type,