refactor: update service extraction logic to utilize environment data, enhancing clarity and consistency in monitoring setup

apps/dokploy/components/dashboard/settings/servers/setup-monitoring.tsx

@@ -35,9 +35,9 @@ import {
 	PopoverContent,
 	PopoverTrigger,
 } from "@/components/ui/popover";
-import { extractServices } from "@/pages/dashboard/project/[projectId]";
 import { api } from "@/utils/api";
 import { useUrl } from "@/utils/hooks/use-url";
+import { extractServices } from "../users/add-permissions";
 
 interface Props {
 	serverId?: string;
@@ -95,11 +95,13 @@ export const SetupMonitoring = ({ serverId }: Props) => {
 
 	const { data: projects } = api.project.all.useQuery();
 
-	const extractServicesFromProjects = (projects: any[] | undefined) => {
+	const extractServicesFromProjects = () => {
 		if (!projects) return [];
 
 		const allServices = projects.flatMap((project) => {
-			const services = extractServices(project);
+			const services = project.environments.flatMap((env) =>
+				extractServices(env),
+			);
 			return serverId
 				? services
 						.filter((service) => service.serverId === serverId)
@@ -110,7 +112,7 @@ export const SetupMonitoring = ({ serverId }: Props) => {
 		return [...new Set(allServices)];
 	};
 
-	const services = extractServicesFromProjects(projects);
+	const services = extractServicesFromProjects();
 
 	const form = useForm<Schema>({
 		resolver: zodResolver(Schema),

apps/dokploy/components/dashboard/settings/users/add-permissions.tsx

@@ -1,3 +1,4 @@
+import type { findEnvironmentById } from "@dokploy/server/index";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
@@ -26,9 +27,132 @@ import {
 	FormMessage,
 } from "@/components/ui/form";
 import { Switch } from "@/components/ui/switch";
-import { extractServices } from "@/pages/dashboard/project/[projectId]";
 import { api } from "@/utils/api";
 
+type Environment = Omit<
+	Awaited<ReturnType<typeof findEnvironmentById>>,
+	"project"
+>;
+
+export type Services = {
+	appName: string;
+	serverId?: string | null;
+	name: string;
+	type:
+		| "mariadb"
+		| "application"
+		| "postgres"
+		| "mysql"
+		| "mongo"
+		| "redis"
+		| "compose";
+	description?: string | null;
+	id: string;
+	createdAt: string;
+	status?: "idle" | "running" | "done" | "error";
+};
+
+export const extractServices = (data: Environment | undefined) => {
+	const applications: Services[] =
+		data?.applications.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "application",
+			id: item.applicationId,
+			createdAt: item.createdAt,
+			status: item.applicationStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	const mariadb: Services[] =
+		data?.mariadb.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "mariadb",
+			id: item.mariadbId,
+			createdAt: item.createdAt,
+			status: item.applicationStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	const postgres: Services[] =
+		data?.postgres.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "postgres",
+			id: item.postgresId,
+			createdAt: item.createdAt,
+			status: item.applicationStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	const mongo: Services[] =
+		data?.mongo.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "mongo",
+			id: item.mongoId,
+			createdAt: item.createdAt,
+			status: item.applicationStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	const redis: Services[] =
+		data?.redis.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "redis",
+			id: item.redisId,
+			createdAt: item.createdAt,
+			status: item.applicationStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	const mysql: Services[] =
+		data?.mysql.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "mysql",
+			id: item.mysqlId,
+			createdAt: item.createdAt,
+			status: item.applicationStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	const compose: Services[] =
+		data?.compose.map((item) => ({
+			appName: item.appName,
+			name: item.name,
+			type: "compose",
+			id: item.composeId,
+			createdAt: item.createdAt,
+			status: item.composeStatus,
+			description: item.description,
+			serverId: item.serverId,
+		})) || [];
+
+	applications.push(
+		...mysql,
+		...redis,
+		...mongo,
+		...postgres,
+		...mariadb,
+		...compose,
+	);
+
+	applications.sort((a, b) => {
+		return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
+	});
+
+	return applications;
+};
+
 const addPermissions = z.object({
 	accessedProjects: z.array(z.string()).optional(),
 	accessedServices: z.array(z.string()).optional(),