Correct layout and button

src/components/Cards/FamilyMarketCard.jsx

@@ -1,41 +1,9 @@
-import React, { useMemo, useState } from "react";
-import { getTimeAgo } from "../../lib";
-import { toast } from "react-toastify";
+import { useState } from "react";
 import SuggestTask from "../FamilyPopup/SuggestTask";
-import usersService from "../../services/UsersService";
 
 export default function FamilyMarketCard({ className, datas, hidden = false }) {
-  const [submitTask, setSubmitTask] = useState({
-    loading: false,
-    msg: "",
-    state: "",
-  });
-
-  const apiCall = useMemo(() => new usersService(), []);
-
-  const handleSubmit = async () => {
-    try {
-      setSubmitTask({ loading: true });
-      const reqData = {
-        title: datas?.title,
-        description: datas?.description,
-      };
-      const res = await apiCall.sendFamilySuggestedTasks(reqData);
-      if (res.internal_return < 0) {
-        setSubmitTask({ loading: false, msg: res.status, state: "bad" });
-        return;
-      }
-      setSubmitTask({ loading: false, msg: res.status, state: "success" });
-      toast.success("Task has been sent!");
-    } catch (error) {
-      setSubmitTask({ loading: false, msg: error, state: "bad" });
-      throw new Error("Error Occurred", error);
-    }
-  };
-
   // debugger;
   const [popUp, setPopUp] = useState(false);
-
   const popUpHandler = () => {
     setPopUp((prev) => !prev);
   };
@@ -71,7 +39,7 @@ export default function FamilyMarketCard({ className, datas, hidden = false }) {
               {hidden && <div className="flex justify-center"></div>}
             </div>
           </div>
-          <div className="details-area mt-12">
+          <div className="details-area mt-12 flex justify-between items-center gap-2">
             {/* title */}
             <button onClick={popUpHandler}>
               <h1 className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white capitalize">
@@ -79,24 +47,18 @@ export default function FamilyMarketCard({ className, datas, hidden = false }) {
               </h1>
             </button>
             <div className="flex justify-between">
-              <div className="flex items-center space-x-2">
+              {/* <div className="flex items-center space-x-2">
                 <p className="italic text-gray-400">
                   {getTimeAgo(datas?.added)}
                 </p>
-              </div>
+              </div> */}
               <div>
                 <button
                   type="button"
-                  onClick={handleSubmit}
+                  onClick={popUpHandler}
                   className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
                 >
-                  {submitTask.loading
-                    ? "..."
-                    : submitTask.state == "success"
-                    ? "Sent!"
-                    : submitTask.state == "bad"
-                    ? "Failed"
-                    : "Send"}
+                  View
                 </button>
               </div>
             </div>

src/components/FamilyPopup/SuggestTask.jsx

@@ -97,6 +97,7 @@ const SuggestTask = ({ details, onClose, situation }) => {
                         inputBg="bg-slate-100"
                         type="text"
                         name="title"
+                        disable={details?.title}
                         value={props.values.title}
                         inputHandler={props.handleChange}
                         blurHandler={props.handleBlur}