feat: add Pagination component for video list navigation

- Implemented a reusable Pagination component with first/last, previous/next, and numbered page buttons.
- Added PageInfo component to display current page and total items.
- Integrated pagination into VideoList component, allowing users to navigate through video pages.
- Updated useVideoList hook to manage current page and total pages state.
- Modified videoApi service to support pagination with offset-based API.
- Enhanced VideoCard styling for better UI consistency.
- Updated Tailwind CSS configuration to include custom colors and shadows for branding.
- Refactored video file settings to use 'h264' codec for better compatibility.
This commit is contained in:
Alireza Vaezi
2025-08-05 13:56:26 -04:00
parent 7bc76d72f9
commit 228efb0f55
38 changed files with 1836 additions and 604 deletions

View File

@@ -38,7 +38,7 @@ When you run the system, you'll see:
### MQTT Status
```http
GET http://localhost:8000/mqtt/status
GET http://vision:8000/mqtt/status
```
**Response:**
@@ -60,7 +60,7 @@ GET http://localhost:8000/mqtt/status
### Machine Status
```http
GET http://localhost:8000/machines
GET http://vision:8000/machines
```
**Response:**
@@ -85,7 +85,7 @@ GET http://localhost:8000/machines
### System Status
```http
GET http://localhost:8000/system/status
GET http://vision:8000/system/status
```
**Response:**
@@ -125,13 +125,13 @@ Tests all the API endpoints and shows expected responses.
### 4. **Query APIs Directly**
```bash
# Check MQTT status
curl http://localhost:8000/mqtt/status
curl http://vision:8000/mqtt/status
# Check machine states
curl http://localhost:8000/machines
curl http://vision:8000/machines
# Check overall system status
curl http://localhost:8000/system/status
curl http://vision:8000/system/status
```
## 🔧 Configuration