feat: conditionally render TimeBadge based on cloud status

- Updated the ShowProjects and side layout components to only display the TimeBadge when not in cloud mode.
- Modified the TimeBadge component to remove the refetch interval for server time when in cloud mode, returning null instead.
- Enhanced the server API to return null for server time in cloud environments, improving performance and avoiding unnecessary queries.

apps/dokploy/components/dashboard/projects/show.tsx

@@ -14,6 +14,7 @@ import { useEffect, useMemo, useState } from "react";
 import { toast } from "sonner";
 import { BreadcrumbSidebar } from "@/components/shared/breadcrumb-sidebar";
 import { DateTooltip } from "@/components/shared/date-tooltip";
+import { FocusShortcutInput } from "@/components/shared/focus-shortcut-input";
 import { StatusTooltip } from "@/components/shared/status-tooltip";
 import {
 	AlertDialog,
@@ -44,7 +45,6 @@ import {
 	DropdownMenuSeparator,
 	DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
-import { FocusShortcutInput } from "@/components/shared/focus-shortcut-input";
 import {
 	Select,
 	SelectContent,
@@ -52,13 +52,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
+import { TimeBadge } from "@/components/ui/time-badge";
 import { api } from "@/utils/api";
 import { HandleProject } from "./handle-project";
 import { ProjectEnvironment } from "./project-environment";
-import { TimeBadge } from "@/components/ui/time-badge";
 
 export const ShowProjects = () => {
 	const utils = api.useUtils();
+	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { data, isLoading } = api.project.all.useQuery();
 	const { data: auth } = api.user.get.useQuery();
 	const { mutateAsync } = api.project.remove.useMutation();
@@ -136,9 +137,11 @@ export const ShowProjects = () => {
 			<BreadcrumbSidebar
 				list={[{ name: "Projects", href: "/dashboard/projects" }]}
 			/>
-			<div className="absolute top-5 right-5">
-				<TimeBadge />
-			</div>
+			{!isCloud && (
+				<div className="absolute top-5 right-5">
+					<TimeBadge />
+				</div>
+			)}
 			<div className="w-full">
 				<Card className="h-full bg-sidebar p-2.5 rounded-xl  ">
 					<div className="rounded-xl bg-background shadow-md ">

apps/dokploy/components/layouts/side.tsx

@@ -1126,7 +1126,7 @@ export default function Page({ children }: Props) {
 									</BreadcrumbList>
 								</Breadcrumb>
 							</div>
-							<TimeBadge />
+							{!isCloud && <TimeBadge />}
 						</div>
 					</header>
 				)}

apps/dokploy/components/ui/time-badge.tsx

@@ -4,9 +4,7 @@ import { useEffect, useState } from "react";
 import { api } from "@/utils/api";
 
 export function TimeBadge() {
-	const { data: serverTime } = api.server.getServerTime.useQuery(undefined, {
-		refetchInterval: 60000, // Refetch every 60 seconds
-	});
+	const { data: serverTime } = api.server.getServerTime.useQuery(undefined);
 	const [time, setTime] = useState<Date | null>(null);
 
 	useEffect(() => {

apps/dokploy/server/api/routers/server.ts

@@ -384,6 +384,9 @@ export const serverRouter = createTRPCRouter({
 		return ip;
 	}),
 	getServerTime: protectedProcedure.query(() => {
+		if (IS_CLOUD) {
+			return null;
+		}
 		return {
 			time: new Date(),
 			timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,