Table Management - Copy this React, Tailwind Component to your project
{ "data": [ { "_id": "670951b3ea6efb0659c337c0", "restaurant": "670543302090430a304e75b1", "tableNumber": 1, "capacity": 4, "status": "OCCUPIED", "location": "BALCONY" }, { "_id": "670951b3ea6efb0659c337c2", "restaurant": "670543302090430a304e75b1", "tableNumber": 3, "capacity": 6, "status": "OCCUPIED", "location": "INDOOR" }, { "_id": "670951b3ea6efb0659c337c4", "restaurant": "670543302090430a304e75b1", "tableNumber": 5, "capacity": 10, "status": "CLOSED", "location": "INDOOR" }, { "_id": "670951b3ea6efb0659c337c1", "restaurant": "670543302090430a304e75b1", "tableNumber": 2, "capacity": 2, "status": "OCCUPIED", "location": "INDOOR" }, { "_id": "670951b3ea6efb0659c337c3", "restaurant": "670543302090430a304e75b1", "tableNumber": 4, "capacity": 8, "status": "CLEANING", "location": "INDOOR" }, { "_id": "671b1201602f95c6674d877d", "restaurant": "670543302090430a304e75b1", "tableNumber": 9, "capacity": 4, "location": "OUTDOOR", "__v": 0 }, { "_id": "670951b3ea6efb0659c337c2", "restaurant": "670543302090430a304e75b1", "tableNumber": 3, "capacity": 6, "status": "OCCUPIED", "location": "INDOOR" }, { "_id": "670951b3ea6efb0659c337c3", "restaurant": "670543302090430a304e75b1", "tableNumber": 4, "capacity": 8, "status": "CLEANING", "location": "INDOOR" }, { "_id": "670951b3ea6efb0659c337c4", "restaurant": "670543302090430a304e75b1", "tableNumber": 5, "capacity": 10, "status": "CLOSED", "location": "INDOOR" }, { "_id": "672a627ba11f0bc1f91201ee", "restaurant": "67012a161f350cf152712f3c", "tableNumber": 24, "capacity": 2, "location": "OUTDOOR", "__v": 0 }, { "_id": "670951b3ea6efb0659c337c2", "restaurant": "670543302090430a304e75b1", "tableNumber": 3, "capacity": 6, "status": "OCCUPIED", "location": "INDOOR" }, { "_id": "670951b3ea6efb0659c337c3", "restaurant": "670543302090430a304e75b1", "tableNumber": 4, "capacity": 8, "status": "CLEANING", "location": "INDOOR" }, { "_id": "671bc9cd193a62b642c6df27", "restaurant": "670543302090430a304e75b1", "tableNumber": 15, "capacity": 12, "location": "OUTDOOR", "__v": 0 }, { "_id": "671b1caad83f24908f838905", "restaurant": "6705457b2090430a304e75bd", "tableNumber": 11, "capacity": 5, "location": "INDOOR", "__v": 0 }, { "_id": "672a627ba11f0bc1f91201ee", "restaurant": "67012a161f350cf152712f3c", "tableNumber": 24, "capacity": 2, "location": "OUTDOOR", "__v": 0 }, { "_id": "672b14e4e65dfc9e5f4070cb", "restaurant": "67012a161f350cf152712f3c", "tableNumber": 22, "capacity": 11, "location": "INDOOR", "__v": 0 }, { "_id": "672a627ba11f0bc1f91201ee", "restaurant": "67012a161f350cf152712f3c", "tableNumber": 24, "capacity": 2, "location": "OUTDOOR", "__v": 0 } ] } Help me create UI according to dining table blocks
