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.

API Documentations/docs/guides/CAMERA_RECOVERY_GUIDE.md

@@ -56,27 +56,27 @@ When a camera has issues, follow this order:
 
 1. **Test Connection** - Diagnose the problem
    ```http
-   POST http://localhost:8000/cameras/camera1/test-connection
+   POST http://vision:8000/cameras/camera1/test-connection
    ```
 
 2. **Try Reconnect** - Most common fix
    ```http
-   POST http://localhost:8000/cameras/camera1/reconnect
+   POST http://vision:8000/cameras/camera1/reconnect
    ```
 
 3. **Restart Grab** - If reconnect doesn't work
    ```http
-   POST http://localhost:8000/cameras/camera1/restart-grab
+   POST http://vision:8000/cameras/camera1/restart-grab
    ```
 
 4. **Full Reset** - For persistent issues
    ```http
-   POST http://localhost:8000/cameras/camera1/full-reset
+   POST http://vision:8000/cameras/camera1/full-reset
    ```
 
 5. **Reinitialize** - For cameras that never worked
    ```http
-   POST http://localhost:8000/cameras/camera1/reinitialize
+   POST http://vision:8000/cameras/camera1/reinitialize
    ```
 
 ## Response Format

API Documentations/docs/guides/MQTT_LOGGING_GUIDE.md

@@ -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

API Documentations/docs/guides/STREAMING_GUIDE.md

@@ -40,13 +40,13 @@ Open `camera_preview.html` in your browser and click "Start Stream" for any came
 ### 3. API Usage
 ```bash
 # Start streaming for camera1
-curl -X POST http://localhost:8000/cameras/camera1/start-stream
+curl -X POST http://vision:8000/cameras/camera1/start-stream
 
 # View live stream (open in browser)
-http://localhost:8000/cameras/camera1/stream
+http://vision:8000/cameras/camera1/stream
 
 # Stop streaming
-curl -X POST http://localhost:8000/cameras/camera1/stop-stream
+curl -X POST http://vision:8000/cameras/camera1/stop-stream
 ```
 
 ## 📡 API Endpoints
@@ -150,10 +150,10 @@ The system supports these concurrent operations:
 ### Example: Concurrent Usage
 ```bash
 # Start streaming
-curl -X POST http://localhost:8000/cameras/camera1/start-stream
+curl -X POST http://vision:8000/cameras/camera1/start-stream
 
 # Start recording (while streaming continues)
-curl -X POST http://localhost:8000/cameras/camera1/start-recording \
+curl -X POST http://vision:8000/cameras/camera1/start-recording \
   -H "Content-Type: application/json" \
   -d '{"filename": "test_recording.avi"}'
 
@@ -232,8 +232,8 @@ For issues with streaming functionality:
 
 1. Check the system logs: `usda_vision_system.log`
 2. Run the test script: `python test_streaming.py`
-3. Verify API health: `http://localhost:8000/health`
-4. Check camera status: `http://localhost:8000/cameras`
+3. Verify API health: `http://vision:8000/health`
+4. Check camera status: `http://vision:8000/cameras`
 
 ---