Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy synced 2025-06-26 18:27:59 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: add interface tooltip

Browse Source
This commit is contained in:
Mauricio Siu
2024-05-18 14:55:59 -06:00
parent 683a62f418
commit bf133536ba
1 changed files with 207 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

230
components/dashboard/application/advanced/cluster/modify-swarm-settings.tsx
View File

@@ -25,7 +25,13 @@ import { useForm } from "react-hook-form";
import { toast } from "sonner"; import { toast } from "sonner";
import { z } from "zod"; import { z } from "zod";
import { Textarea } from "@/components/ui/textarea"; import { Textarea } from "@/components/ui/textarea";
import { Settings } from "lucide-react"; import { HelpCircle, Settings } from "lucide-react";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
const HealthCheckSwarmSchema = z const HealthCheckSwarmSchema = z
.object({ .object({
@@ -269,9 +275,34 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pl-6 "> <FormItem className="relative max-lg:px-4 lg:pl-6 ">
<FormLabel>Health Check</FormLabel> <FormLabel>Health Check</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
Check the interface <Tooltip>
</FormDescription> <TooltipTrigger asChild>
<FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="start"
side="bottom"
>
<code>
<pre>
{`{
Test?: string[] | undefined;
Interval?: number | undefined;
Timeout?: number | undefined;
StartPeriod?: number | undefined;
Retries?: number | undefined;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;] min-h-[11.2rem]" className="font-mono [field-sizing:content;] min-h-[11.2rem]"
@@ -298,10 +329,33 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pr-6 "> <FormItem className="relative max-lg:px-4 lg:pr-6 ">
<FormLabel>Restart Policy</FormLabel> <FormLabel>Restart Policy</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
{/* {path} */} <Tooltip>
Check the interface <TooltipTrigger asChild>
</FormDescription> <FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="start"
side="bottom"
>
<code>
<pre>
{`{
Condition?: string | undefined;
Delay?: number | undefined;
MaxAttempts?: number | undefined;
Window?: number | undefined;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;] min-h-[11.2rem]" className="font-mono [field-sizing:content;] min-h-[11.2rem]"
@@ -327,9 +381,38 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pl-6 "> <FormItem className="relative max-lg:px-4 lg:pl-6 ">
<FormLabel>Placement</FormLabel> <FormLabel>Placement</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
Check the interface <Tooltip>
</FormDescription> <TooltipTrigger asChild>
<FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="start"
side="bottom"
>
<code>
<pre>
{`{
Constraints?: string[] | undefined;
Preferences?: Array<{ Spread: { SpreadDescriptor: string } }> | undefined;
MaxReplicas?: number | undefined;
Platforms?:
| Array<{
Architecture: string;
OS: string;
}>
| undefined;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;] min-h-[18.7rem]" className="font-mono [field-sizing:content;] min-h-[18.7rem]"
@@ -362,9 +445,35 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pr-6 "> <FormItem className="relative max-lg:px-4 lg:pr-6 ">
<FormLabel>Update Config</FormLabel> <FormLabel>Update Config</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
Check the interface <Tooltip>
</FormDescription> <TooltipTrigger asChild>
<FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="start"
side="bottom"
>
<code>
<pre>
{`{
Parallelism?: number;
Delay?: number | undefined;
FailureAction?: string | undefined;
Monitor?: number | undefined;
MaxFailureRatio?: number | undefined;
Order: string;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;] min-h-[18.7rem]" className="font-mono [field-sizing:content;] min-h-[18.7rem]"
@@ -392,9 +501,35 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pl-6 "> <FormItem className="relative max-lg:px-4 lg:pl-6 ">
<FormLabel>Rollback Config</FormLabel> <FormLabel>Rollback Config</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
Check the interface <Tooltip>
</FormDescription> <TooltipTrigger asChild>
<FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="start"
side="bottom"
>
<code>
<pre>
{`{
Parallelism?: number;
Delay?: number | undefined;
FailureAction?: string | undefined;
Monitor?: number | undefined;
MaxFailureRatio?: number | undefined;
Order: string;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;] min-h-[14.8rem]" className="font-mono [field-sizing:content;] min-h-[14.8rem]"
@@ -422,9 +557,38 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pr-6 "> <FormItem className="relative max-lg:px-4 lg:pr-6 ">
<FormLabel>Mode</FormLabel> <FormLabel>Mode</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
Check the interface <Tooltip>
</FormDescription> <TooltipTrigger asChild>
<FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="center"
side="bottom"
>
<code>
<pre>
{`{
Replicated?: { Replicas?: number | undefined } | undefined;
Global?: {} | undefined;
ReplicatedJob?:
| {
MaxConcurrent?: number | undefined;
TotalCompletions?: number | undefined;
}
| undefined;
GlobalJob?: {} | undefined;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;] min-h-[14.8rem]" className="font-mono [field-sizing:content;] min-h-[14.8rem]"
@@ -455,9 +619,29 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
render={({ field }) => ( render={({ field }) => (
<FormItem className="relative max-lg:px-4 lg:pl-6 "> <FormItem className="relative max-lg:px-4 lg:pl-6 ">
<FormLabel>Labels</FormLabel> <FormLabel>Labels</FormLabel>
<FormDescription className="break-all"> <TooltipProvider delayDuration={0}>
Check the interface <Tooltip>
</FormDescription> <TooltipTrigger asChild>
<FormDescription className="break-all w-fit flex flex-row gap-1 items-center">
Check the interface
<HelpCircle className="size-4 text-muted-foreground" />
</FormDescription>
</TooltipTrigger>
<TooltipContent
className="w-full z-[999]"
align="start"
side="bottom"
>
<code>
<pre>
{`{
[name: string]: string;
}`}
</pre>
</code>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<FormControl> <FormControl>
<Textarea <Textarea
className="font-mono [field-sizing:content;]" className="font-mono [field-sizing:content;]"