docs: add monitoring documentation and update navigation

apps/docs/app/layout.config.tsx

@@ -1,5 +1,5 @@
 import type { BaseLayoutProps } from "fumadocs-ui/layouts/shared";
-import { Github, GlobeIcon, HeartIcon } from "lucide-react";
+import { Github, GlobeIcon, HeartIcon, Rss } from "lucide-react";
 import Link from "next/link";
 /**
  * Shared layout configurations
@@ -89,5 +89,15 @@ export const baseOptions: BaseLayoutProps = {
 				</>
 			),
 		},
+		{
+			text: "Blog",
+			url: "https://dokploy.com/blog",
+			active: "nested-url",
+			icon: (
+				<>
+					<Rss />
+				</>
+			),
+		},
 	],
 };

apps/docs/content/docs/core/meta.json

@@ -16,6 +16,7 @@
 		"...",
 		"---Cloud---",
 		"cloud",
+		"monitoring",
 		"differences",
 		"---Server---",
 		"(S3-Destinations)",

apps/docs/content/docs/core/monitoring.mdx

@@ -0,0 +1,67 @@
+---
+title: Monitoring
+description: "Monitor your applications and servers with Dokploy"
+---
+
+### Prerequisites
+
+Before setting up monitoring for your applications and servers, ensure you have completed the server deployment setup. You can verify this by:
+
+1. Navigate to Remote Servers → Select your server → Setup Server
+2. Validate that you see a green checkmark in every section
+
+### Configuration Options
+
+Once the prerequisites are met, you can access the Monitoring Section where you'll find the following configuration options:
+
+#### Refresh Rates
+- **Server Refresh Rate**: Determines how frequently the server metrics are collected (default: 20 seconds). Lower values provide more accurate metrics but increase server load.
+- **Container Refresh Rate**: Sets the frequency for container metric collection (default: 20 seconds). Similar to server refresh rate, lower values mean more precise data but higher resource usage.
+
+#### Data Management
+- **Cron Job**: Automated task that cleans old metrics based on the retention period settings.
+- **Server Retention Days**: Specifies how long metrics data is stored (default: 2 days).
+- **Port**: The designated port for the metrics server (default: 4500).
+
+#### Service Selection
+- **Include Services**: Choose which services to monitor. Options include:
+  - All services
+  - Specific compose services
+  - Specific applications
+  - Both compose and applications
+- **Exclude Services**: Specify services to exclude from monitoring using the same options as above.
+
+#### Alert Thresholds
+- **CPU Threshold (%)**: Set the CPU usage percentage that triggers an alert. Set to 0 to disable alerts.
+- **Memory Threshold (%)**: Set the memory usage percentage that triggers an alert. Set to 0 to disable alerts.
+
+#### Security and Integration
+- **Metrics Token**: Authentication token for metrics requests. You can:
+  - Use the automatically generated token
+  - Generate a new token in the server section
+- **Metrics Callback URL**: The endpoint that receives metrics data. Default URL is:
+  ```
+  https://app.dokploy.com/api/trpc/notification.receiveNotification
+  ```
+  You can use this default or configure your own callback URL.
+
+In order to enable just click on `Save Changes` button.
+
+
+### Notifications
+If you have configured notifications with Server Threshold properties, metric alerts will be sent to your enabled notification providers, the notifications will sent only if the threshold is exceeded based on the Server itself not individual services.
+
+### Important Security Note
+**Make sure port 4500 is open on your server** to allow proper communication of monitoring metrics. This is essential for the monitoring system to function correctly.
+
+If you have errors like failed to fetch metrics, or no data available, just give it a few minutes and check again, this is normal, the server needs to collect data first.
+
+You should see something like this for your server:
+<ImageZoom src="/monitoring.png" alt="Architecture Diagram" width={1000} height={600} className="rounded-lg"/>
+
+For your services you should see something like this:
+<ImageZoom src="/monitoring-services.png" alt="Architecture Diagram" width={1000} height={600} className="rounded-lg"/>
+
+
+This is feature only available on Cloud Version of Dokploy.
+