From 6bd0832728be90ba325df6ed7572cc832120a143 Mon Sep 17 00:00:00 2001
From: Yahialabeeb <yahia.labeeb@gmail.com>
Date: Tue, 4 Jan 2022 17:33:48 +0200
Subject: [PATCH 1/3] add post functionality

---
 .../{userProfile.js => UserProfile.js}        |   2 +-
 pages/Newsfeed.js                             |  69 ++++++--
 pages/Profile.js                              |  18 +++
 pages/home_compnenet/LoginForm.js             |  11 +-
 pages/home_compnenet/Signupform.js            | 148 +++++++++++-------
 pages/index.js                                |   8 +-
 pages/postComponents/Editpost.js              |  59 +++++++
 pages/postComponents/PostElement.js           |  98 ++++++------
 8 files changed, 277 insertions(+), 136 deletions(-)
 rename pages/Donar_component/{userProfile.js => UserProfile.js} (97%)
 create mode 100644 pages/Profile.js
 create mode 100644 pages/postComponents/Editpost.js

diff --git a/pages/Donar_component/userProfile.js b/pages/Donar_component/UserProfile.js
similarity index 97%
rename from pages/Donar_component/userProfile.js
rename to pages/Donar_component/UserProfile.js
index f78e03a..8221406 100644
--- a/pages/Donar_component/userProfile.js
+++ b/pages/Donar_component/UserProfile.js
@@ -51,7 +51,7 @@ function UserProfile() {
               <UserInfo result={result} submitHandler={submitHandler} />
 
               <button
-                className="mt-12 text-red-600 border-2 border-red-600 border-dashed rounded-lg  h-9 w-36 ml-52"
+                className="mt-12 text-red-600 border-2 border-red-600 border-dashed rounded-lg h-9 w-36 ml-52"
                 onClick={deleteHandler}
               >
                 Remove Account
diff --git a/pages/Newsfeed.js b/pages/Newsfeed.js
index def0791..4141ebf 100644
--- a/pages/Newsfeed.js
+++ b/pages/Newsfeed.js
@@ -3,31 +3,70 @@ import axios from 'axios'
 import FormForPost from './postComponents/FormForPost'
 import PostElement from './postComponents/PostElement'
 import { useAuth } from '../contexts/auth'
-import { useState } from 'react'
+import { useState, useEffect } from "react";
 export default function Newsfeed() {
+
     const { tokens } = useAuth();
+
     const [result, setResult] = useState([]);
+    useEffect(async () => {
+        axios.get('http://127.0.0.1:8000/blood/show/').then((res) => {
+            setResult(res.data)
+            console.log(res.data);
+        }
+        )
+    }, []);
     const handlesubmit = async (e) => {
         e.preventDefault();
         console.log(e.target.title.value);
         let url = `http://127.0.0.1:8000/blood/add/`
         let data = {
-            patient: "yahialabib",
-            title : e.target.title.value,
-            text : e.target.content.value,
+            patient: tokens.username,
+            title: e.target.title.value,
+            text: e.target.content.value,
             publish: true
         }
         axios.post(url, data).then((res) => {
-                setResult(res.data);
+            setResult(result => [res.data, ...result]);
+        });
+        console.log(result);
+    }
+
+    const handledelete = async (item) => {
+        let url = `http://127.0.0.1:8000/blood/update-delete/${item.id}/`
+        axios.delete(url).then(()=>{
+            axios.get('http://127.0.0.1:8000/blood/show/').then((res) => {
+            setResult(res.data)
+        });
+        console.log(result);
+    })
+    }
+    const handleupdate = async (item) => {
+        let url = `http://127.0.0.1:8000/blood/update-delete/${item.id}/`
+        let data = {
+            patient: item.patient,
+            title: e.target.title.value,
+            text: e.target.content.value,
+            publish: true
+        }
+        axios.put(url, data).then(() => {
+            axios.get('http://127.0.0.1:8000/blood/show/').then((res) => {
+                setResult(res.data)
             });
+            console.log(result);
+        })
     }
-    return (
-        <div>
-            <FormForPost
-                handlesubmit={handlesubmit}
-            />
-            <PostElement
-            />
-        </div>
-    )
-}
\ No newline at end of file
+
+        return (
+            <div>
+                <FormForPost
+                    handlesubmit={handlesubmit}
+                />
+                <PostElement
+                    result={result}
+                    handledelete={handledelete}
+                    handleupdate={handleupdate}
+                />
+            </div>
+        )
+    }
\ No newline at end of file
diff --git a/pages/Profile.js b/pages/Profile.js
new file mode 100644
index 0000000..5594375
--- /dev/null
+++ b/pages/Profile.js
@@ -0,0 +1,18 @@
+import React from 'react'
+import axios from 'axios'
+import UserProfile from './Donar_component/UserProfile'
+import HospitalProfile from './Hospital_component/hospitalProfile'
+import { useAuth } from '../contexts/auth'
+import { useState } from 'react'
+export default function Newsfeed() {
+    const { tokens } = useAuth()
+    return (
+        <>
+        {tokens &&
+        <div>
+             {tokens.Role == 'Hospital' ?  <HospitalProfile/> : <UserProfile/>}
+        </div>
+        }   
+       </> 
+    )
+}
\ No newline at end of file
diff --git a/pages/home_compnenet/LoginForm.js b/pages/home_compnenet/LoginForm.js
index 0764188..c82e62e 100644
--- a/pages/home_compnenet/LoginForm.js
+++ b/pages/home_compnenet/LoginForm.js
@@ -12,17 +12,8 @@ export default function LoginForm() {
     try{
         
         await login(username, password)
-        if (tokens.Role == 'Doner' || tokens.Role == 'Patient'){
-        router.push({
-          pathname: '/Donar_component/userProfile',
-        });
-        }
         
-        if (tokens.Role == 'Hospital'){
-        router.push({
-          pathname: '/Hospital_component/hospitalProfile',
-        });
-        }
+        
         
     }
     catch(error){
diff --git a/pages/home_compnenet/Signupform.js b/pages/home_compnenet/Signupform.js
index ff2e703..ec456f2 100644
--- a/pages/home_compnenet/Signupform.js
+++ b/pages/home_compnenet/Signupform.js
@@ -2,42 +2,57 @@ import React from "react";
 import axios from "axios";
 import { useState, useEffect } from "react";
 import { TweenMax, Power3, TimelineLite, Expo, gsap } from "gsap";
-
+import { useAuth } from "../../contexts/auth";
 import Navbar from "./Navbar";
+import { useRouter } from 'next/router';
 export default function Signupform() {
+  const { login } = useAuth()
+  const router = useRouter()
   const showsignhospital = () => {
     gsap.to("#sectionsignuphospital", 1.5, { top: 0, ease: Power3.easeInOut });
   };
   const handlesubmitsignup = async (e) => {
+    let role = {
+      Doner: "donater",
+      Patient: "patient",
+    };
     let data = new FormData();
     e.preventDefault();
-    const url =' http://127.0.0.1:8000/'
+    const url = ' http://127.0.0.1:8000/'
     let blood = {
-      blood_type:e.target.blood_type.value,
-      description : e.target.description.value
+      blood_type: e.target.blood_type.value,
+      description: e.target.description.value
     }
-    const create_blood =await axios.post(`${url}blood/add/`, blood)
-    
+    // console.log(e.target.role.value);
+    const bloodtt = await axios.post(`${url}blood/addtype/`, blood)
+      
     data.append("first_name", e.target.firstname.value);
     data.append("username", e.target.username.value);
     data.append("email", e.target.email.value);
     data.append("password", e.target.password.value);
-    data.append("blood_type", create_blood.data.id);
-    data.append("roles", "Doner");
-    let urls = `${url}accounts/donater/signup/`;
-    const create = axios.post(urls, data, {
+    data.append("blood_type",bloodtt.data.id);
+    data.append("roles", e.target.role.value);
+    
+    let urls = `${url}accounts/${role[e.target.role.value]}/signup/`;
+    const user = await axios.post(urls, data, {
       headers: {
         "content-type": "multipart/form-data",
       },
     });
-    console.log(create.data);
+    router.push({
+      pathname: '/Profile',
+    }); 
+    console.log(user); 
+    await login(user.data.username, e.target.password.value)
+    
+ 
   };
   return (
     <>
       <section id="sectionsignup">
         <div className="container px-4 mx-auto" id="divsignup">
           <div className="flex items-center content-center justify-center">
-            <div className="w-full px-4 mt-40 lg:w-6/12">
+            <div className="w-full px-4 mt-28 lg:w-6/12">
               <div className="relative flex flex-col w-full min-w-0 mb-6 break-words border-0 rounded-lg shadow-lg bg-blueGray-200 frombakc">
                 <div className="flex-auto px-4 py-10 pt-0 lg:px-20">
                   <div className="mt-6 text-center">
@@ -83,19 +98,36 @@ export default function Signupform() {
                         />
                       </div>
                     </div>
-                    <div className="relative w-full mb-3">
-                      <label
-                        className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
-                        htmlFor="grid-password"
-                      >
-                        Email
-                      </label>
-                      <input
-                        type="email"
-                        name="email"
-                        className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring"
-                        placeholder="Email"
-                      />
+                    <div className="grid grid-cols-[1fr_1fr] gap-3">
+                      <div className="relative w-full mb-3">
+                        <label
+                          className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
+                          htmlFor="grid-password"
+                        >
+                          Email
+                        </label>
+                        <input
+                          type="email"
+                          name="email"
+                          className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring"
+                          placeholder="Email"
+                        />
+                        </div>
+                        <div className="relative w-full mb-3">
+                          <label
+                            className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
+                            htmlFor="grid-password"
+                          >
+                            Role
+                          </label>
+                          <select name="role" id="role"
+                            className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring"
+                          >
+                            <option value="Doner">Doner</option>
+                            <option value="Patient">Patient</option>
+                          </select>
+                        
+                      </div>
                     </div>
                     <div className="grid grid-cols-[1fr_1fr] gap-3">
                       <div className="relative w-full mb-3">
@@ -128,39 +160,39 @@ export default function Signupform() {
                       </div>
                     </div>
                     <div className="grid grid-cols-[1fr_1fr] gap-3">
-                    <div className="relative w-full mb-3">
-                      <label
-                        className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
-                        htmlFor="grid-password"
-                      >
-                        blood_type
-                      </label>
-                      <select
-                        id="cars"
-                        name="blood_type"
-                        className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring"
-                      >
-                        <option value="A+">A+</option>
-                        <option value="A-">A-</option>
-                        <option value="B+">B+</option>
-                        <option value="B-">B-</option>
-                        <option value="AB+">AB+</option>
-                        <option value="AB-">AB-</option>
-                        <option value="O+">O+</option>
-                        <option value="O-">O-</option>
-                      </select>
-                    </div>
-                    <div className="relative w-full mb-3">
-                      <label
-                        className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
-                        htmlFor="grid-password"
-                      >
-                        blood_type
-                      </label>
-                      <textarea name="description" rows="10" cols="30"  className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring">
-                        No Comment
-                      </textarea>
-                    </div>
+                      <div className="relative w-full mb-3">
+                        <label
+                          className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
+                          htmlFor="grid-password"
+                        >
+                          blood_type
+                        </label>
+                        <select
+                          id="cars"
+                          name="blood_type"
+                          className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring"
+                        >
+                          <option value="A+">A+</option>
+                          <option value="A-">A-</option>
+                          <option value="B+">B+</option>
+                          <option value="B-">B-</option>
+                          <option value="AB+">AB+</option>
+                          <option value="AB-">AB-</option>
+                          <option value="O+">O+</option>
+                          <option value="O-">O-</option>
+                        </select>
+                      </div>
+                      <div className="relative w-full mb-3">
+                        <label
+                          className="block mb-2 text-xs font-bold uppercase text-blueGray-600"
+                          htmlFor="grid-password"
+                        >
+                          blood_type
+                        </label>
+                        <textarea name="description" rows="10" cols="30" className="w-full h-10 px-3 py-3 text-sm transition-all duration-150 ease-linear bg-white border-0 rounded shadow placeholder-blueGray-300 text-blueGray-600 focus:outline-none focus:ring">
+                          No Comment
+                        </textarea>
+                      </div>
                     </div>
                     <div className="mt-6 text-center">
                       <button
diff --git a/pages/index.js b/pages/index.js
index 4c0945b..3ef01dd 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,7 +1,7 @@
 import Head from 'next/head'
 import Homa_page from './home_compnenet/Homa_page'
-import HospitalProfile from './Hospital_component/hospitalProfile'
-import UserProfile from './Donar_component/userProfile'
+// import HospitalProfile from './Hospital_component/hospitalProfile'
+// import UserProfile from './Donar_component/userProfile'
 import { useEffect,useRef } from 'react'
 import Testfrom from './TestForm'
 import { useAuth } from '../contexts/auth'
@@ -12,9 +12,9 @@ export default function Home() {
 
   return (
     <>
+    {tokens ? <Newsfeed/> : <Homa_page/>}
+    
     
-    <Newsfeed/>
-    {/* {<Homa_page/>} */}
     {/* <Testfrom/> */}
     </>
   )
diff --git a/pages/postComponents/Editpost.js b/pages/postComponents/Editpost.js
new file mode 100644
index 0000000..6132846
--- /dev/null
+++ b/pages/postComponents/Editpost.js
@@ -0,0 +1,59 @@
+export default function Editpost(props){
+    
+    return(
+      <div>
+      <div className="w-4/5 m-auto ">
+        <div className="mt-5 md:mt-0 md:col-span-2">
+          <form action="#" method="POST" onSubmit={handlesubmit}>
+            <div className="shadow sm:rounded-md sm:overflow-hidden">
+              <div className="px-4 py-5 space-y-6 bg-white sm:p-6">
+                <div className="grid grid-cols-1 gap-6">
+                  <div className="grid grid-cols-6 gap-6">
+                    <div className="col-span-6 sm:col-span-3">
+                      <label
+                        htmlFor="first-name"
+                        className="block text-sm font-medium text-gray-700"
+                      >
+                        Blood Type
+                      </label>
+                      <input
+                        defaultValue={props.result.first_name}
+                        type="text"
+                        name="firstname"
+                        id="first-name"
+                        autoComplete="given-name"
+                        className="block w-full mt-1 border-gray-300 rounded-md shadow-sm focus:ring-red-500 focus:border-red-500 sm:text-sm"
+                      />
+                    </div>
+                  </div>
+                </div>
+                <div className="col-span-6 sm:col-span-3">
+                  <label
+                    htmlFor="first-name"
+                    className="block text-sm font-medium text-gray-700"
+                  >
+                    User Name
+                  </label>
+                  <input
+                    defaultValue={props.result.username}
+                    type="text"
+                    name="username"
+                    id="first-name"
+                    autoComplete="given-name"
+                    className="block w-full mt-1 border border-gray-300 rounded-md shadow-sm focus:ring-red-500 focus:border-red-500 sm:text-sm"
+                  />
+                </div>
+                <button
+                  type="submit"
+                  className="inline-flex justify-center px-4 py-2 text-sm font-medium text-white bg-red-600 border border-transparent rounded-md shadow-sm hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500"
+                >
+                  Save
+                </button>
+              </div>
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
+    )
+}
\ No newline at end of file
diff --git a/pages/postComponents/PostElement.js b/pages/postComponents/PostElement.js
index f0b2ab4..f9de40b 100644
--- a/pages/postComponents/PostElement.js
+++ b/pages/postComponents/PostElement.js
@@ -1,60 +1,62 @@
-import { Result } from "postcss";
+
 import React from "react";
 import axios from "axios";
+import { useAuth } from '../../contexts/auth'
 import { useState, useEffect } from "react";
 
-  
-export default function PostElement() {
-  
-  const [result, setResult] = useState([]);
-  useEffect(async () => {
-    axios.get('http://127.0.0.1:8000/blood/show/').then((res) => {
-      setResult(res.data)
-      console.log(res.data);
-    }
-    )
-  }, []);
-  
-  return(
-    
-
-  result.map((item, idx) => {
-
-
-    return (
-      <div key={idx}>
-        <div className="w-4/5 m-auto mt-7 ">
-          <div className="w-4/5 m-auto ">
+export default function PostElement(props) {
+  const { tokens } = useAuth();
+  const [showform, setshowform] = useState(false);
+  const [itemupdate, setItemupdate] = useState("");
+  const handleform =  (item)=>{
+    // e.preventDefault()
+    setshowform(true)
+    setItemupdate(item)
+    console.log(itemupdate);
+  }
+  return (
+    <>
+    {showform ? <p>hi</p>:
+    props.result.map((item, idx) => {
+
+
+      return (
+        <div key={idx}>
+          
+          <div className="w-4/5 m-auto mt-7 ">
+            <div className="w-4/5 m-auto ">
 
-          </div>
-          <div className="flex items-center gap-7">
-            <img
-              src="https://www.w3schools.com/w3css/img_avatar3.png"
-              alt=""
-              className="rounded-full w-14 h-14"
-            />
-            <div>
-              <h1 className="text-2xl">{item.patient}</h1>
-              <span className="text-xs">{item.time}</span>
             </div>
-          </div>
-
-          <div class="shadow overflow-hidden sm:rounded-md w-4/5 mt-6 ">
-          <h1 className="p-6 text-4xl" >{item.title}</h1>
-            <p className="p-6 text-1xl">
-            {item.text}
-            </p>
-            <div className="flex justify-end">
-              <div className="flex items-center inline w-12 h-10 text-red-700 border border-red-700 rounded-xl ">
-                <p className="w-full text-center">AB+</p>
+            <div className="flex items-center gap-7">
+              <img
+                src="https://www.w3schools.com/w3css/img_avatar3.png"
+                alt=""
+                className="rounded-full w-14 h-14"
+              />
+              <div>
+                <h1 className="text-2xl">{item.patient}</h1>
+                <span className="text-xs">{item.time}</span>
               </div>
             </div>
-          </div>
 
+            <div class="shadow overflow-hidden sm:rounded-md w-4/5 mt-6 ">
+              <h1 className="p-6 text-4xl" >{item.title}</h1>
+              <p className="p-6 text-1xl">
+                {item.text}
+              </p>
+              {item.patient == tokens.username &&
+                <div className="flex justify-end">
+                  <button onClick={()=>handleform(item)} >update</button>
+                  <button onClick={()=>props.handledelete(item)}>delete</button>
+                </div>
+              }
+            </div>
+
+          </div>
         </div>
-      </div>
 
-    );
-  })
-)
+      );
+    })}
+  </>
+  )
 }
\ No newline at end of file

From 9931b1e2cfcb46cd88b6912603b2312f1eadd35f Mon Sep 17 00:00:00 2001
From: Yahialabeeb <yahia.labeeb@gmail.com>
Date: Tue, 4 Jan 2022 17:59:33 +0200
Subject: [PATCH 2/3] add post functionality

---
 pages/Newsfeed.js                   | 23 +++++++++++++++++++++--
 pages/postComponents/Editpost.js    | 20 ++++++++++----------
 pages/postComponents/PostElement.js | 20 ++++++++------------
 3 files changed, 39 insertions(+), 24 deletions(-)

diff --git a/pages/Newsfeed.js b/pages/Newsfeed.js
index 4141ebf..1eb7019 100644
--- a/pages/Newsfeed.js
+++ b/pages/Newsfeed.js
@@ -4,10 +4,12 @@ import FormForPost from './postComponents/FormForPost'
 import PostElement from './postComponents/PostElement'
 import { useAuth } from '../contexts/auth'
 import { useState, useEffect } from "react";
+import Editpost from "./postComponents/Editpost";
 export default function Newsfeed() {
 
     const { tokens } = useAuth();
-
+    const [showform, setshowform] = useState(false);
+    const [itemupdate, setItemupdate] = useState("");
     const [result, setResult] = useState([]);
     useEffect(async () => {
         axios.get('http://127.0.0.1:8000/blood/show/').then((res) => {
@@ -41,6 +43,12 @@ export default function Newsfeed() {
         console.log(result);
     })
     }
+    const handleform =  (item)=>{
+        // e.preventDefault()
+        setshowform(true)
+        setItemupdate(item)
+        // console.log(itemupdate);
+      }
     const handleupdate = async (item) => {
         let url = `http://127.0.0.1:8000/blood/update-delete/${item.id}/`
         let data = {
@@ -55,18 +63,29 @@ export default function Newsfeed() {
             });
             console.log(result);
         })
+        setshowform(false)
     }
 
         return (
             <div>
+                {showform ? 
+                <Editpost
+                handleupdate={handleupdate}
+                itemupdate ={itemupdate}
+                />
+                :
+                <>
                 <FormForPost
                     handlesubmit={handlesubmit}
                 />
                 <PostElement
                     result={result}
                     handledelete={handledelete}
-                    handleupdate={handleupdate}
+                    handleform = {handleform}
+                    showform = {showform}   
                 />
+                </>
+                }
             </div>
         )
     }
\ No newline at end of file
diff --git a/pages/postComponents/Editpost.js b/pages/postComponents/Editpost.js
index 6132846..d9b79f0 100644
--- a/pages/postComponents/Editpost.js
+++ b/pages/postComponents/Editpost.js
@@ -4,23 +4,23 @@ export default function Editpost(props){
       <div>
       <div className="w-4/5 m-auto ">
         <div className="mt-5 md:mt-0 md:col-span-2">
-          <form action="#" method="POST" onSubmit={handlesubmit}>
+          <form action="#" method="POST" onSubmit={props.handleupdate}>
             <div className="shadow sm:rounded-md sm:overflow-hidden">
               <div className="px-4 py-5 space-y-6 bg-white sm:p-6">
                 <div className="grid grid-cols-1 gap-6">
                   <div className="grid grid-cols-6 gap-6">
                     <div className="col-span-6 sm:col-span-3">
                       <label
-                        htmlFor="first-name"
+                        htmlFor="bloodtype"
                         className="block text-sm font-medium text-gray-700"
                       >
                         Blood Type
                       </label>
                       <input
-                        defaultValue={props.result.first_name}
+                        defaultValue={props.itemupdate.title}
                         type="text"
-                        name="firstname"
-                        id="first-name"
+                        name="bloodtype"
+                        id="bloodtype"
                         autoComplete="given-name"
                         className="block w-full mt-1 border-gray-300 rounded-md shadow-sm focus:ring-red-500 focus:border-red-500 sm:text-sm"
                       />
@@ -29,16 +29,16 @@ export default function Editpost(props){
                 </div>
                 <div className="col-span-6 sm:col-span-3">
                   <label
-                    htmlFor="first-name"
+                    htmlFor="Content"
                     className="block text-sm font-medium text-gray-700"
                   >
-                    User Name
+                    Content
                   </label>
                   <input
-                    defaultValue={props.result.username}
+                    defaultValue={props.itemupdate.text}
                     type="text"
-                    name="username"
-                    id="first-name"
+                    name="Content"
+                    id="Content"
                     autoComplete="given-name"
                     className="block w-full mt-1 border border-gray-300 rounded-md shadow-sm focus:ring-red-500 focus:border-red-500 sm:text-sm"
                   />
diff --git a/pages/postComponents/PostElement.js b/pages/postComponents/PostElement.js
index f9de40b..54e3ebe 100644
--- a/pages/postComponents/PostElement.js
+++ b/pages/postComponents/PostElement.js
@@ -1,22 +1,18 @@
 
 import React from "react";
-import axios from "axios";
 import { useAuth } from '../../contexts/auth'
-import { useState, useEffect } from "react";
 
 export default function PostElement(props) {
   const { tokens } = useAuth();
-  const [showform, setshowform] = useState(false);
-  const [itemupdate, setItemupdate] = useState("");
-  const handleform =  (item)=>{
-    // e.preventDefault()
-    setshowform(true)
-    setItemupdate(item)
-    console.log(itemupdate);
-  }
+
+
   return (
     <>
-    {showform ? <p>hi</p>:
+    {
+    // props.showform ? <Editpost
+    // itemupdate ={itemupdate}
+    // handleupdate={props.handleupdate}
+    // />:
     props.result.map((item, idx) => {
 
 
@@ -46,7 +42,7 @@ export default function PostElement(props) {
               </p>
               {item.patient == tokens.username &&
                 <div className="flex justify-end">
-                  <button onClick={()=>handleform(item)} >update</button>
+                  <button onClick={()=>props.handleform(item)} >update</button>
                   <button onClick={()=>props.handledelete(item)}>delete</button>
                 </div>
               }

From 76c1894c2eefc429ba204854406b6ca7bc307374 Mon Sep 17 00:00:00 2001
From: Yahialabeeb <yahia.labeeb@gmail.com>
Date: Tue, 4 Jan 2022 18:29:12 +0200
Subject: [PATCH 3/3] edit

---
 pages/Newsfeed.js                   | 11 ++++++-----
 pages/postComponents/PostElement.js | 10 +++++++---
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/pages/Newsfeed.js b/pages/Newsfeed.js
index 1eb7019..5de78ab 100644
--- a/pages/Newsfeed.js
+++ b/pages/Newsfeed.js
@@ -49,12 +49,13 @@ export default function Newsfeed() {
         setItemupdate(item)
         // console.log(itemupdate);
       }
-    const handleupdate = async (item) => {
-        let url = `http://127.0.0.1:8000/blood/update-delete/${item.id}/`
+    const handleupdate = async (e) => {
+        e.preventDefault()
+        let url = `http://127.0.0.1:8000/blood/update-delete/${itemupdate.id}/`
         let data = {
-            patient: item.patient,
-            title: e.target.title.value,
-            text: e.target.content.value,
+            patient: itemupdate.patient,
+            title: e.target.bloodtype.value,
+            text: e.target.Content.value,
             publish: true
         }
         axios.put(url, data).then(() => {
diff --git a/pages/postComponents/PostElement.js b/pages/postComponents/PostElement.js
index 54e3ebe..327a52a 100644
--- a/pages/postComponents/PostElement.js
+++ b/pages/postComponents/PostElement.js
@@ -35,15 +35,19 @@ export default function PostElement(props) {
               </div>
             </div>
 
-            <div class="shadow overflow-hidden sm:rounded-md w-4/5 mt-6 ">
+            <div class="shadow overflow-hidden sm:rounded-md w-4/5 mt-6 bg-white">
               <h1 className="p-6 text-4xl" >{item.title}</h1>
               <p className="p-6 text-1xl">
                 {item.text}
               </p>
               {item.patient == tokens.username &&
                 <div className="flex justify-end">
-                  <button onClick={()=>props.handleform(item)} >update</button>
-                  <button onClick={()=>props.handledelete(item)}>delete</button>
+                  <button onClick={()=>props.handleform(item)} 
+                  className="inline-flex justify-center px-4 py-2 m-2 text-sm font-medium text-white bg-red-600 border border-transparent rounded-md shadow-sm hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500"
+                  >update</button>
+                  <button onClick={()=>props.handledelete(item)}
+                  className="inline-flex justify-center px-4 py-2 m-2 text-sm font-medium text-white bg-red-600 border border-transparent rounded-md shadow-sm hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500"
+                  >delete</button>
                 </div>
               }
             </div>