metadata

title: System Performance Monitor UI
emoji: 📊
colorFrom: blue
colorTo: gray
sdk: gradio
sdk_version: 5.35.0
app_file: app.py
python_version: 3.1
license: mit

ProMonitor 🌖

Features

ProMonitor offers a comprehensive interface for system monitoring and management, with a focus on security and usability:

Dashboard: Displays real-time system metrics (CPU, memory, GPU, disk usage) and health status (Healthy, Degraded, Unhealthy) with a refreshable view.
History: Visualizes historical CPU, memory, and GPU usage over a user-specified time range (1–1440 minutes) using tables and line charts.
Resource Limits: Allows setting and viewing CPU, memory, and GPU power limits, with validation and feedback.
Alerts: Shows active system alerts with severity levels (critical, warning) in a clear, color-coded table.
Processes: Lists top CPU- and memory-intensive processes, with options to kill, suspend, or resume processes (secured with API key).
System Info: Provides static system information (platform, CPU, memory, disk, GPU) in a structured format.
Emergency Stop: Enables termination of high-memory processes with confirmation and API key authentication.

Prerequisites

Python: 3.10+ (as specified in .hf_space.yml)
FastAPI Backend: The backend (app/main.py) must be running and accessible (default: http://localhost:8000).
Dependencies: Listed in requirements.txt (see Installation).

Installation

1	Clone the Repository: git clone https://huggingface.co/spaces//ProMonitor
2	cd ProMonitor
3	
4	Install Dependencies: pip install -r requirements.txt
5	 Dependencies include:
◦	gradio==5.35.0
◦	requests==2.32.3
◦	pydantic==2.9.2
◦	python-dotenv==1.0.1
◦	logging==0.5.1.2
6	Configure Environment: Create a .env file in the project root: API_BASE_URL=http://localhost:8000
7	API_KEY=your_secure_api_key
8	
◦	Replace your_secure_api_key with the API key required by the FastAPI backend.
◦	Ensure .env is listed in .gitignore to prevent committing sensitive data.
9	Run the FastAPI Backend: Start the backend (assumed to be in app/main.py): uvicorn app.main:app --host 0.0.0.0 --port 8000
10	 If the backend is hosted elsewhere, update API_BASE_URL in .env.
11	Run the UI: Launch the Gradio app: python app.py
12	 The UI will be available at http://localhost:7860.

Usage

1	Access the UI: Open http://localhost:7860 in a web browser to access the ProMonitor interface.
2	Navigate Tabs:
◦	Dashboard: View real-time metrics and health status. Click “Refresh Metrics” to update.
◦	History: Enter a time range (1–1440 minutes) to view historical data in tables and charts.
◦	Resource Limits: Set CPU, memory, and GPU limits using input fields. View current limits.
◦	Alerts: Monitor active alerts with severity indicators (red for critical, yellow for warning).
◦	Processes: View top processes and perform actions (kill, suspend, resume) with a valid API key.
◦	System Info: Review static system details (platform, CPU, memory, etc.).
◦	Emergency Stop: Trigger an emergency stop to terminate high-memory processes (requires API key and confirmation).
3	Secure Actions:
◦	For process actions and emergency stop, provide the API key in the respective input fields.
◦	Ensure the backend validates the API key to prevent unauthorized access.

Deployment on Hugging Face Spaces

ProMonitor is configured for deployment on Hugging Face Spaces with the following setup:

1	Push to Hugging Face Spaces:
◦	Create a new Space on Hugging Face: https://huggingface.co/new
◦	Select “Gradio” as the SDK and configure it as a public or private Space.
◦	Push the repository containing app.py, requirements.txt, .hf_space.yml, and this README.md.
2	Configure Secrets:
◦	In the Space’s Settings > Secrets, add:
▪	API_BASE_URL: URL of the FastAPI backend (e.g., https://your-backend.com).
▪	API_KEY: The API key for secure endpoint access.
◦	Avoid including .env in the repository; use Spaces secrets for sensitive data.
3	Build and Deploy:
◦	Hugging Face Spaces will automatically build the container using requirements.txt and run app.py.
◦	Check the Space’s logs for any errors during startup.
◦	Access the deployed UI at https://huggingface.co/spaces//ProMonitor.
4	Backend Hosting:
◦	The FastAPI backend must be hosted separately (e.g., on another Hugging Face Space, AWS, or a local server with tunneling via ngrok).
◦	Update API_BASE_URL in Spaces secrets to point to the backend.
◦	Ensure the backend implements API key authentication for endpoints like /processes/action and /emergency/stop.

Security Considerations

•	API Key Authentication:
◦	The backend (app/main.py) must validate the Authorization header (e.g., Bearer ).
◦	Update the backend to include middleware for API key verification: from fastapi import Depends, HTTPException, Security
◦	from fastapi.security import APIKeyHeader
◦	
◦	api_key_header = APIKeyHeader(name="Authorization")
◦	def verify_api_key(api_key: str = Security(api_key_header)):
◦	    if api_key != f"Bearer {os.getenv('API_KEY')}":
◦	        raise HTTPException(status_code=403, detail="Invalid API key")
◦	    return api_key
◦	 Apply to sensitive endpoints: @app.post("/emergency/stop", dependencies=[Depends(verify_api_key)]).
•	CORS:
◦	In the FastAPI backend, replace allow_origins=["*"] with specific origins (e.g., the Hugging Face Space URL) to prevent unauthorized access.
◦	Example: allow_origins=["https://-promonitor.hf.space"].
•	Sensitive Data:
◦	Do not commit .env or sensitive configuration files to the repository.
◦	Use Hugging Face Spaces secrets for API_KEY and API_BASE_URL.
•	Rate Limiting:
◦	Implement rate limiting in the Gradio UI (e.g., using the ratelimit library) to prevent overwhelming the backend.
◦	Consider adding rate limiting to the FastAPI backend using slowapi.

Testing

To ensure the UI works correctly, test it locally before deploying: 1 Install Testing Dependencies: pip install pytest pytest-httpx pytest-asyncio 2 3 Create a Test File (test_ui.py): import pytest 4 from httpx import AsyncClient 5 from app import APIClient 6 7 @pytest.mark.asyncio 8 async def test_get_metrics(): 9 async with AsyncClient() as client: 10 async def mock_get(*args, **kwargs): 11 return type("Response", (), {"json": lambda: {"status": "success", "data": {}}, "status_code": 200})() 12 client.get = mock_get 13 api_client = APIClient("http://test") 14 response = api_client.get_metrics() 15 assert response["status"] == "success" 16 17 @pytest.mark.asyncio 18 async def test_get_history(): 19 async with AsyncClient() as client: 20 async def mock_get(*args, **kwargs): 21 return type("Response", (), {"json": lambda: {"status": "success", "data": []}, "status_code": 200})() 22 client.get = mock_get 23 api_client = APIClient("http://test") 24 response = api_client.get_history(60) 25 assert response["status"] == "success" 26 27 Run Tests: pytest test_ui.py 28 29 Test Locally: ◦ Start the FastAPI backend: uvicorn app.main:app --host 0.0.0.0 --port 8000 ◦ Run the Gradio UI: python app.py ◦ Verify all tabs and functionality in the browser.

Troubleshooting

Backend Unreachable:
Ensure the FastAPI backend is running and accessible at API_BASE_URL.
Check network connectivity and firewall settings.
Use a tunneling service like ngrok for local testing: ngrok http 8000.
API Key Errors:
Verify the API_KEY matches the backend’s expected value.
Check backend logs for authentication errors.
Gradio UI Issues:
Review ui.log for error messages.
Ensure gradio==5.35.0 is installed correctly.
Check Hugging Face Spaces logs for deployment issues.

Contributing

Contributions are welcome! To contribute:

1	Fork the repository.
2	Create a feature branch: git checkout -b feature/your-feature.
3	Commit changes: git commit -m "Add your feature".
4	Push to the branch: git push origin feature/your-feature.
5	Open a pull request on the Hugging Face Space repository.

Please include tests and follow PEP 8 guidelines.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Acknowledgments

Built with Gradio for the UI and FastAPI for the backend.
Designed for cybersecurity and system performance monitoring on HP Z440 workstations.
Hosted on Hugging Face Spaces.