feat: enhance organization invitation UI and add organization details

apps/dokploy/components/layouts/side.tsx

@@ -555,7 +555,7 @@ function SidebarLogo() {
 								</SidebarMenuButton>
 							</DropdownMenuTrigger>
 							<DropdownMenuContent
-								className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
+								className="w-[--radix-dropdown-menu-trigger-width] min-w-64 rounded-lg"
 								align="start"
 								side={isMobile ? "bottom" : "right"}
 								sideOffset={4}
@@ -634,9 +634,9 @@ function SidebarLogo() {
 						<DropdownMenu>
 							<DropdownMenuTrigger asChild>
 								<Button variant="ghost" size="icon" className="relative">
-									<Bell className="h-5 w-5" />
+									<Bell className="size-4" />
 									{invitations && invitations.length > 0 && (
-										<span className="absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-blue-500 text-xs text-white">
+										<span className="absolute -top-0 -right-0 flex size-4 items-center justify-center rounded-full bg-blue-500 text-xs text-white">
 											{invitations.length}
 										</span>
 									)}
@@ -648,6 +648,7 @@ function SidebarLogo() {
 								className="w-80"
 							>
 								<DropdownMenuLabel>Pending Invitations</DropdownMenuLabel>
+								<div className="flex flex-col gap-2">
 									{invitations && invitations.length > 0 ? (
 										invitations.map((invitation) => (
 											<div key={invitation.id} className="flex flex-col gap-2">
@@ -655,10 +656,12 @@ function SidebarLogo() {
 													className="flex flex-col items-start gap-1 p-3"
 													onSelect={(e) => e.preventDefault()}
 												>
-												<div className="font-medium">{invitation.email}</div>
+													<div className="font-medium">
+														{invitation?.organization?.name}
+													</div>
 													<div className="text-xs text-muted-foreground">
 														Expires:{" "}
-													{new Date(invitation.expiresAt).toLocaleDateString()}
+														{new Date(invitation.expiresAt).toLocaleString()}
 													</div>
 													<div className="text-xs text-muted-foreground">
 														Role: {invitation.role}
@@ -681,6 +684,7 @@ function SidebarLogo() {
 														} else {
 															toast.success("Invitation accepted successfully");
 															await refetchInvitations();
+															await refetch();
 														}
 													}}
 												>
@@ -695,6 +699,7 @@ function SidebarLogo() {
 											No pending invitations
 										</DropdownMenuItem>
 									)}
+								</div>
 							</DropdownMenuContent>
 						</DropdownMenu>
 					</SidebarMenuItem>

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

@@ -144,6 +144,9 @@ export const userRouter = createTRPCRouter({
 				gt(invitation.expiresAt, new Date()),
 				eq(invitation.status, "pending"),
 			),
+			with: {
+				organization: true,
+			},
 		});
 	}),
 });

packages/server/src/db/schema/user.ts

@@ -140,7 +140,12 @@ export const apiRemoveUser = createSchema
 	})
 	.required();
 
-export const apiFindOneToken = createSchema.pick({}).required();
+export const apiFindOneToken = createSchema
+	.pick({})
+	.required()
+	.extend({
+		token: z.string().min(1),
+	});
 
 export const apiAssignPermissions = createSchema
 	.pick({