Tanaka chinengundu update post

backend/api/urls.py

@@ -24,5 +24,6 @@
     path("api/posts/new/", views.PostCreate.as_view(), name="post-create"),
     path("api/posts/<int:pk>/", views.PostDetail.as_view(), name="post-detail"),
     path("api/posts/delete/<int:pk>/", views.PostDelete.as_view(), name="post-delete"),
+    path("api/posts/<int:pk>/edit/", views.PostUpdate.as_view(), name='post-update'),
     path("api/signup", views.SignUpView.as_view(), name="signup-view"),
 ]

backend/api/views.py

@@ -194,3 +194,20 @@ def delete(self, request, *args, **kwargs):
             return self.destroy(request, *args, **kwargs)
         else:
             return Response(status=status.HTTP_403_FORBIDDEN)
+
+
+class PostUpdate(generics.UpdateAPIView):
+    """
+    View to edit a single post.
+    """
+
+    queryset = Post.objects.all()
+    serializer_class = PostSerializer
+    lookup_field = "pk"
+
+    def put(self, request, *args, **kwargs):
+        post = self.get_object()
+        if post.user_profile.user == request.user:  # Check if the user has permission to edit
+            return self.update(request, *args, **kwargs)
+        else:
+            return Response(status=status.HTTP_403_FORBIDDEN)

frontend/src/components/common/Post.tsx

@@ -5,6 +5,7 @@ import TechSTack from "./TechSTack";
 import { AiOutlineLike } from "react-icons/ai";
 import { GrView } from "react-icons/gr";
 import { FaRegCommentAlt } from "react-icons/fa";
+import { SlOptionsVertical } from "react-icons/sl";
 
 const techSTack = ["HTML", "React", "PHP", "Laravel"];
 
@@ -20,9 +21,20 @@ const Post = () => {
 					className="object-fill h-8"
 				/>
 				<div className="flex flex-col">
-					<p className="text-sm font-bold">Jessica William</p>
+					<div className="flex flex-row items-center justify-between">
+						<span className="text-sm font-bold">Jessica William</span>
+						<button
+							onClick={() => {
+								//!TODO implement a dropdown for edit, delete and share options
+							}}
+							className="ml-auto"
+						>
+							<SlOptionsVertical />
+						</button>
+					</div>
 					<p className="text-xs">{formatPostDate(createdAt)}</p>
 				</div>
+
 			</div>
 			<div className="my-2">
 				<p className="text-subheading-100 text-sm">