Drag and Drop Component - Copy this React, Tailwind Component to your project

Adjust for better look: import React from "react"; export default function PostsGrid({ posts }) { return ( <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6"> {posts.map((post) => ( <div key={post.id} className="bg-white p-6 rounded-lg shadow-lg hover:shadow-xl transition duration-300"> <h3 className="text-xl font-semibold text-gray-900">{post.title}</h3> <p className="mt-2 text-sm text-gray-700">{post.content}</p> <div className="mt-4"> <span className="inline-block text-sm font-medium text-gray-600">Category: {post.categories}</span> </div> <div className="mt-4 flex justify-between items-center"> <button className="text-indigo-600 hover:text-indigo-900"> Edit </button> <button className="text-red-600 hover:text-red-900"> Delete </button> </div> </div> ))} </div> ); };