Merge pull request #24 from NwinNwin/steven-connect+updated+backend

added resolve + help to items
NwinNwin · Sep 17, 2023 · 7efe289 · 7efe289
2 parents fc65b4a + 21981e3
commit 7efe289
Show file tree

Hide file tree

Showing 5 changed files with 64 additions and 12 deletions.
diff --git a/src/components/CreateModal/CreateModal.jsx b/src/components/CreateModal/CreateModal.jsx
@@ -151,6 +151,8 @@ export default function CreateModal({
               name: "",
               description: "",
               itemDate: "",
+              isResolved: false,
+              isHelped: null,
             });
             setUploadImg("");
             setActiveStep(0);
@@ -172,6 +174,8 @@ export default function CreateModal({
             name: "",
             description: "",
             itemDate: "",
+            isResolved: false,
+            isHelped: null,
           });
           setUploadImg("");
           setActiveStep(0);
@@ -545,6 +549,8 @@ export default function CreateModal({
                         name: "",
                         description: "",
                         itemDate: "",
+                        isResolved: false,
+                        isHelped: null,
                       });
                       setUploadImg("");
                       onClose();

diff --git a/src/components/Home/Home.jsx b/src/components/Home/Home.jsx
@@ -85,6 +85,8 @@ export default function Home() {
     name: "",
     description: "",
     itemDate: "",
+    isResolved: false,
+    isHelped: null
   });
 
   const [isEdit, setIsEdit] = useState(false);
@@ -133,7 +135,7 @@ export default function Home() {
     };
     getData();
   }, []);
-
+  
   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
@@ -133,6 +133,7 @@ export default function Map({
   );
 
   async function handleSubmit() {
+    console.log("submitted")
     const date = new Date();
 
     axios
@@ -146,6 +147,8 @@ export default function Map({
         location: [position.lat, position.lng],
         itemDate: newAddedItem.itemDate,
         date: date.toISOString(),
+        isResolved: newAddedItem.isResolved,
+        isHelped: newAddedItem.isHelped,
       })
       .then((item) => {
         const newItem = {
@@ -159,6 +162,8 @@ export default function Map({
           date: date.toISOString(),
           itemDate: newAddedItem.itemDate,
           id: item.data.id,
+          isResolved: newAddedItem.isResolved,
+          isHelped: newAddedItem.isHelped,
         };
         setData((prev) => [...prev, newItem]);
         setPosition(centerPosition);
@@ -170,6 +175,8 @@ export default function Map({
           name: "",
           description: "",
           itemDate: "",
+          isResolved: false,
+          isHelped: null,
         });
         setIsCreate(!isCreate);
         setUploadImg("");
@@ -221,8 +228,8 @@ export default function Map({
       },
     });
 
-    return (position.lat !== centerPosition[0] &&
-      position.lng !== centerPosition[1]) ? (
+    return position.lat !== centerPosition[0] &&
+      position.lng !== centerPosition[1] ? (
       <Marker
         className="marker"
         draggable={true}