diff --git a/web/bun.lockb b/web/bun.lockb index 892e2b9..88b5cc2 100755 Binary files a/web/bun.lockb and b/web/bun.lockb differ diff --git a/web/package.json b/web/package.json index 79db5e9..3757de7 100644 --- a/web/package.json +++ b/web/package.json @@ -28,6 +28,7 @@ "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "@radix-ui/react-tabs": "^1.0.4", + "@radix-ui/react-tooltip": "^1.0.7", "@tanstack/react-table": "^8.10.7", "@types/jsonwebtoken": "^9.0.5", "@types/uuid": "^9.0.7", diff --git a/web/src/app/layout.tsx b/web/src/app/layout.tsx index 19e48a4..a9a4fc8 100644 --- a/web/src/app/layout.tsx +++ b/web/src/app/layout.tsx @@ -1,29 +1,29 @@ import "./globals.css"; import { NavbarRight } from "@/components/NavbarRight"; import { Button } from "@/components/ui/button"; +import { TooltipProvider } from "@/components/ui/tooltip"; import { ClerkProvider, UserButton } from "@clerk/nextjs"; import { Github } from "lucide-react"; import type { Metadata } from "next"; +import meta from "next-gen/config"; import PlausibleProvider from "next-plausible"; import { Inter } from "next/font/google"; import { Toaster } from "sonner"; const inter = Inter({ subsets: ["latin"] }); -import meta from 'next-gen/config'; - export const metadata: Metadata = { - title: meta['og:title'], - description: meta['og:description'], + title: meta["og:title"], + description: meta["og:description"], - category: 'technology', + category: "technology", openGraph: { - type: 'website', - title: meta['og:title'], - description: meta['og:description'], - locale: 'en_US', - images: '/og.jpg', + type: "website", + title: meta["og:title"], + description: meta["og:description"], + locale: "en_US", + images: "/og.jpg", }, }; @@ -35,44 +35,51 @@ export default function RootLayout({ return ( - - {process.env.PLAUSIBLE_DOMAIN && ( - - )} - - -
-
-
-
- - {meta.name} - - + + + {process.env.PLAUSIBLE_DOMAIN && ( + + )} + + +
+
+
-
- - + +
+
+ + +
+ {/*
*/}
- {/*
*/} -
-
- {children} -
- -
- +
+ {children} +
+ + + + ); diff --git a/web/src/app/workflows/[workflow_id]/page.tsx b/web/src/app/workflows/[workflow_id]/page.tsx index ba059b6..804b1e5 100644 --- a/web/src/app/workflows/[workflow_id]/page.tsx +++ b/web/src/app/workflows/[workflow_id]/page.tsx @@ -48,7 +48,6 @@ export default async function Page({ - diff --git a/web/src/components/CodeBlock.tsx b/web/src/components/CodeBlock.tsx index c00b7b2..24967cb 100644 --- a/web/src/components/CodeBlock.tsx +++ b/web/src/components/CodeBlock.tsx @@ -1,10 +1,14 @@ import { CopyButton } from "@/components/CopyButton"; -import { getHighlighter, StringLiteralUnion } from 'shikiji' +import type { StringLiteralUnion } from "shikiji"; +import { getHighlighter } from "shikiji"; -export async function CodeBlock(props: { code: string; lang: StringLiteralUnion }) { +export async function CodeBlock(props: { + code: string; + lang: StringLiteralUnion; +}) { const highlighter = await getHighlighter({ themes: ["one-dark-pro"], - langs: [props.lang] + langs: [props.lang], }); return ( diff --git a/web/src/components/VersionSelect.tsx b/web/src/components/VersionSelect.tsx index 66be4dc..26b38d9 100644 --- a/web/src/components/VersionSelect.tsx +++ b/web/src/components/VersionSelect.tsx @@ -19,6 +19,11 @@ import { SelectTrigger, SelectValue, } from "@/components/ui/select"; +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from "@/components/ui/tooltip"; import { createRun } from "@/server/createRun"; import { createDeployments } from "@/server/curdDeploments"; import type { getMachines } from "@/server/curdMachine"; @@ -75,11 +80,11 @@ export function MachineSelect({ }} > - + - Versions + Machines {machines?.map((x) => ( {x.name} @@ -203,7 +208,7 @@ export function CreateDeploymentButton({ const customInputNodes: Record = { ComfyUIDeployExternalText: "string", - ComfyUIDeployExternalImage: "string - image url", + ComfyUIDeployExternalImage: "string - (public image url)", }; export function VersionDetails({ @@ -223,7 +228,7 @@ export function VersionDetails({ Workflow Details
{workflow_version?.workflow_api && ( -
+
{Object.entries(workflow_version.workflow_api).map( ([key, value]) => { if (!value.class_type) return <> ; @@ -232,10 +237,24 @@ export function VersionDetails({ const input_id = value.inputs.input_id; const defaultValue = value.inputs.default_value; return ( - <> - {input_id} {nodeType}{" "} - {defaultValue} - +
+ + + +
+ {input_id} + {" : "} + {nodeType} +
+ + {/* {nodeType}{" "} */} + {/* */} + + + Default Value: {defaultValue} + + +
); } return <>; diff --git a/web/src/components/ui/tooltip.tsx b/web/src/components/ui/tooltip.tsx new file mode 100644 index 0000000..a9bf209 --- /dev/null +++ b/web/src/components/ui/tooltip.tsx @@ -0,0 +1,29 @@ +"use client"; + +import { cn } from "@/lib/utils"; +import * as TooltipPrimitive from "@radix-ui/react-tooltip"; +import * as React from "react"; + +const TooltipProvider = TooltipPrimitive.Provider; + +const Tooltip = TooltipPrimitive.Root; + +const TooltipTrigger = TooltipPrimitive.Trigger; + +const TooltipContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, sideOffset = 4, ...props }, ref) => ( + +)); +TooltipContent.displayName = TooltipPrimitive.Content.displayName; + +export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };