Skip to content

Commit

Permalink
refactor: add threshold property
Browse files Browse the repository at this point in the history
  • Loading branch information
Siumauricio committed Jan 4, 2025
1 parent e41c222 commit 66e1902
Show file tree
Hide file tree
Showing 21 changed files with 9,336 additions and 13 deletions.
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -39,3 +39,6 @@ yarn-error.log*
# Misc
.DS_Store
*.pem


.db
3 changes: 3 additions & 0 deletions apps/dokploy/components/dashboard/compose/monitoring/show.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,13 +27,15 @@ interface Props {
serverId?: string;
appType: "stack" | "docker-compose";
url: string;
token: string;
}

export const ShowMonitoringCompose = ({
appName,
appType = "stack",
serverId,
url,
token,
}: Props) => {
const { data, isLoading } = api.docker.getContainersByAppNameMatch.useQuery(
{
Expand Down Expand Up @@ -123,6 +125,7 @@ export const ShowMonitoringCompose = ({
<ContainerMonitoring
appName={containerAppName || ""}
BASE_URL={url}
TOKEN={token}
/>
</CardContent>
</Card>
Expand Down
18 changes: 13 additions & 5 deletions apps/dokploy/components/dashboard/monitoring/container/show.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,8 @@ interface ContainerMetric {
used: number;
total: number;
unit: string;
usedUnit: string;
totalUnit: string;
};
Network: {
input: number;
Expand All @@ -54,10 +56,11 @@ interface ContainerMetric {

interface Props {
appName: string;
BASE_URL: string;
baseUrl: string;
token: string;
}

export const ContainerMonitoring = ({ appName, BASE_URL }: Props) => {
export const ContainerMonitoring = ({ appName, baseUrl, token }: Props) => {
const [historicalData, setHistoricalData] = useState<ContainerMetric[]>([]);
const [metrics, setMetrics] = useState<ContainerMetric>(
{} as ContainerMetric,
Expand All @@ -69,15 +72,19 @@ export const ContainerMonitoring = ({ appName, BASE_URL }: Props) => {

const fetchMetrics = async () => {
try {
const url = new URL(`${BASE_URL}/metrics/containers`);
const url = new URL(`${baseUrl}/metrics/containers`);

if (dataPoints !== "all") {
url.searchParams.append("limit", dataPoints);
}

url.searchParams.append("appName", appName);

const response = await fetch(url.toString());
const response = await fetch(url.toString(), {
headers: {
Authorization: `Bearer ${token}`,
},
});

if (!response.ok) {
throw new Error(`Failed to fetch metrics: ${response.statusText}`);
Expand Down Expand Up @@ -120,7 +127,7 @@ export const ContainerMonitoring = ({ appName, BASE_URL }: Props) => {
return (
<div className="mt-5 flex min-h-[55vh] w-full items-center justify-center rounded-lg border p-4">
<span className="text-base font-medium leading-none text-muted-foreground">
Error fetching metrics from: {BASE_URL}{" "}
Error fetching metrics from: {baseUrl}{" "}
<strong className="font-semibold text-destructive">{error}</strong>
</span>
</div>
Expand All @@ -130,6 +137,7 @@ export const ContainerMonitoring = ({ appName, BASE_URL }: Props) => {
return (
<div className="space-y-4 pb-10 pt-5 w-full border p-4 rounded-lg">
{/* Header con selector de puntos de datos */}
{appName}
<div className="flex items-center justify-between">
<h2 className="text-2xl font-bold tracking-tight">
Container Monitoring
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -54,11 +54,13 @@ interface SystemMetrics {

interface Props {
BASE_URL?: string;
token?: string;
}

export const ShowMonitoring = ({
BASE_URL = process.env.NEXT_PUBLIC_METRICS_URL ||
"http://localhost:3001/metrics",
token = process.env.NEXT_PUBLIC_METRICS_TOKEN || "my-token",
}: Props) => {
const [historicalData, setHistoricalData] = useState<SystemMetrics[]>([]);
const [metrics, setMetrics] = useState<SystemMetrics>({} as SystemMetrics);
Expand All @@ -76,7 +78,11 @@ export const ShowMonitoring = ({
url.searchParams.append("limit", dataPoints);
}

const response = await fetch(url.toString());
const response = await fetch(url.toString(), {
headers: {
Authorization: `Bearer ${token}`,
},
});

if (!response.ok) {
throw new Error(`Failed to fetch metrics: ${response.statusText}`);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ const notificationBaseSchema = z.object({
databaseBackup: z.boolean().default(false),
dokployRestart: z.boolean().default(false),
dockerCleanup: z.boolean().default(false),
serverThreshold: z.boolean().default(false),
});

export const notificationSchema = z.discriminatedUnion("type", [
Expand Down Expand Up @@ -165,6 +166,7 @@ export const AddNotification = () => {
dokployRestart,
databaseBackup,
dockerCleanup,
serverThreshold,
} = data;
let promise: Promise<unknown> | null = null;
if (data.type === "slack") {
Expand All @@ -177,6 +179,7 @@ export const AddNotification = () => {
channel: data.channel,
name: data.name,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
} else if (data.type === "telegram") {
promise = telegramMutation.mutateAsync({
Expand All @@ -188,6 +191,7 @@ export const AddNotification = () => {
chatId: data.chatId,
name: data.name,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
} else if (data.type === "discord") {
promise = discordMutation.mutateAsync({
Expand All @@ -199,6 +203,7 @@ export const AddNotification = () => {
decoration: data.decoration,
name: data.name,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
} else if (data.type === "email") {
promise = emailMutation.mutateAsync({
Expand All @@ -214,6 +219,7 @@ export const AddNotification = () => {
toAddresses: data.toAddresses,
name: data.name,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
}

Expand Down Expand Up @@ -706,6 +712,27 @@ export const AddNotification = () => {
)}
/>
)}
<FormField
control={form.control}
name="serverThreshold"
render={({ field }) => (
<FormItem className=" flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm gap-2">
<div className="space-y-0.5">
<FormLabel>Server Threshold</FormLabel>
<FormDescription>
Trigger the action when the server threshold is
reached.
</FormDescription>
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
</div>
</div>
</form>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
channel: data.slack?.channel || "",
name: data.name,
type: data.notificationType,
serverThreshold: data.serverThreshold,
});
} else if (data.notificationType === "telegram") {
form.reset({
Expand All @@ -104,6 +105,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
type: data.notificationType,
name: data.name,
dockerCleanup: data.dockerCleanup,
serverThreshold: data.serverThreshold,
});
} else if (data.notificationType === "discord") {
form.reset({
Expand All @@ -116,6 +118,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
decoration: data.discord?.decoration || undefined,
name: data.name,
dockerCleanup: data.dockerCleanup,
serverThreshold: data.serverThreshold,
});
} else if (data.notificationType === "email") {
form.reset({
Expand All @@ -132,6 +135,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
fromAddress: data.email?.fromAddress,
name: data.name,
dockerCleanup: data.dockerCleanup,
serverThreshold: data.serverThreshold,
});
}
}
Expand All @@ -144,6 +148,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
dokployRestart,
databaseBackup,
dockerCleanup,
serverThreshold,
} = formData;
let promise: Promise<unknown> | null = null;
if (formData?.type === "slack" && data?.slackId) {
Expand All @@ -158,6 +163,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
notificationId: notificationId,
slackId: data?.slackId,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
} else if (formData.type === "telegram" && data?.telegramId) {
promise = telegramMutation.mutateAsync({
Expand All @@ -171,6 +177,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
notificationId: notificationId,
telegramId: data?.telegramId,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
} else if (formData.type === "discord" && data?.discordId) {
promise = discordMutation.mutateAsync({
Expand All @@ -184,6 +191,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
notificationId: notificationId,
discordId: data?.discordId,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
} else if (formData.type === "email" && data?.emailId) {
promise = emailMutation.mutateAsync({
Expand All @@ -201,6 +209,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
notificationId: notificationId,
emailId: data?.emailId,
dockerCleanup: dockerCleanup,
serverThreshold: serverThreshold,
});
}

Expand Down Expand Up @@ -668,6 +677,27 @@ export const UpdateNotification = ({ notificationId }: Props) => {
)}
/>
)}
<FormField
control={form.control}
name="serverThreshold"
render={({ field }) => (
<FormItem className=" flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm gap-2">
<div className="space-y-0.5">
<FormLabel>Server Threshold</FormLabel>
<FormDescription>
Trigger the action when the server threshold is
reached.
</FormDescription>
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
</div>
</div>
</form>
Expand Down
Loading

0 comments on commit 66e1902

Please sign in to comment.