diff --git a/apps/dokploy/components/dashboard/settings/log-management/handle-log-provider.tsx b/apps/dokploy/components/dashboard/settings/log-management/handle-log-provider.tsx index d134aaa99..8559c39d9 100644 --- a/apps/dokploy/components/dashboard/settings/log-management/handle-log-provider.tsx +++ b/apps/dokploy/components/dashboard/settings/log-management/handle-log-provider.tsx @@ -2,6 +2,7 @@ import type { LogProviderType } from "@dokploy/server/services/log-management/ty import { AlertTriangle, PenBoxIcon, PlusIcon } from "lucide-react"; import { useEffect, useState } from "react"; import { toast } from "sonner"; +import { logProviderIcons } from "@/components/icons/log-provider-icons"; import { Button } from "@/components/ui/button"; import { Dialog, @@ -219,7 +220,7 @@ export const HandleLogProvider = ({ logProviderId }: Props) => { )} - + {logProviderId ? "Edit Log Provider" : "Add a Log Provider"} @@ -240,7 +241,7 @@ export const HandleLogProvider = ({ logProviderId }: Props) => { )} -
+
{ - {availableTypes?.map((type) => ( - - {type.label} - - ))} + {availableTypes?.map((type) => { + const ProviderIcon = + logProviderIcons[ + type.type as keyof typeof logProviderIcons + ]; + return ( + +
+ {ProviderIcon && ( + + )} + {type.label} +
+ + ); + })}
{selectedType?.credentialFields.map((field) => ( -
+
))} -
+
diff --git a/apps/dokploy/components/dashboard/settings/log-management/show-log-providers.tsx b/apps/dokploy/components/dashboard/settings/log-management/show-log-providers.tsx index 626045bfb..efcf3fba2 100644 --- a/apps/dokploy/components/dashboard/settings/log-management/show-log-providers.tsx +++ b/apps/dokploy/components/dashboard/settings/log-management/show-log-providers.tsx @@ -7,6 +7,7 @@ import { } from "lucide-react"; import Link from "next/link"; import { toast } from "sonner"; +import { logProviderIcons } from "@/components/icons/log-provider-icons"; import { DialogAction } from "@/components/shared/dialog-action"; import { Badge } from "@/components/ui/badge"; import { Button } from "@/components/ui/button"; @@ -47,10 +48,14 @@ const LogProviderRow = ({ const { mutateAsync: testConnectionById, isPending: isTesting } = api.logProvider.testConnectionById.useMutation(); + const ProviderIcon = + logProviderIcons[provider.providerType as keyof typeof logProviderIcons]; + return (
-
+
+ {ProviderIcon && }
{index + 1}. {provider.name} diff --git a/apps/dokploy/components/icons/log-provider-icons.tsx b/apps/dokploy/components/icons/log-provider-icons.tsx new file mode 100644 index 000000000..5d4e247c8 --- /dev/null +++ b/apps/dokploy/components/icons/log-provider-icons.tsx @@ -0,0 +1,69 @@ +import { AwsIcon } from "@/components/icons/vault-provider-icons"; + +interface Props { + className?: string; +} + +export const GrafanaLokiIcon = ({ className }: Props) => ( + + + +); + +export const DatadogIcon = ({ className }: Props) => ( + + + +); + +export const BetterStackIcon = ({ className }: Props) => ( + + + +); + +export const ElasticsearchIcon = ({ className }: Props) => ( + + + +); + +export const SplunkIcon = ({ className }: Props) => ( + + + +); + +export const logProviderIcons = { + loki: GrafanaLokiIcon, + datadog: DatadogIcon, + betterstack: BetterStackIcon, + elasticsearch: ElasticsearchIcon, + splunk_hec: SplunkIcon, + aws_cloudwatch: AwsIcon, +} as const;