From b58b6636e3e77d0bb692cc544d166980a862de56 Mon Sep 17 00:00:00 2001 From: Andrey Kucherenko Date: Fri, 10 Jan 2025 08:18:43 +0100 Subject: [PATCH] feat: add AI assistant to dokploy --- .../dashboard/project/add-ai-assistant.tsx | 10 + .../dashboard/project/ai/step-four.tsx | 92 + .../dashboard/project/ai/step-one.tsx | 69 + .../dashboard/project/ai/step-three.tsx | 84 + .../dashboard/project/ai/step-two.tsx | 326 ++ .../project/ai/template-generator.tsx | 159 + .../components/dashboard/settings/ai-form.tsx | 276 ++ .../components/layouts/settings-layout.tsx | 9 +- apps/dokploy/components/ui/skeleton.tsx | 15 + .../drizzle/0054_cooing_typhoid_mary.sql | 7 + apps/dokploy/drizzle/meta/0054_snapshot.json | 4294 +++++++++++++++++ apps/dokploy/drizzle/meta/_journal.json | 7 + apps/dokploy/package.json | 23 +- .../pages/dashboard/project/[projectId].tsx | 6 +- apps/dokploy/pages/dashboard/settings/ai.tsx | 71 + apps/dokploy/server/api/root.ts | 2 + apps/dokploy/server/api/routers/ai.ts | 71 + apps/dokploy/tailwind.config.ts | 6 +- packages/server/package.json | 27 +- packages/server/src/db/schema/ai.ts | 37 + packages/server/src/db/schema/index.ts | 1 + packages/server/src/services/ai.ts | 104 + packages/server/src/utils/ai/index.ts | 1 + .../server/src/utils/ai/select-ai-provider.ts | 73 + pnpm-lock.yaml | 1122 ++++- 25 files changed, 6842 insertions(+), 50 deletions(-) create mode 100644 apps/dokploy/components/dashboard/project/add-ai-assistant.tsx create mode 100644 apps/dokploy/components/dashboard/project/ai/step-four.tsx create mode 100644 apps/dokploy/components/dashboard/project/ai/step-one.tsx create mode 100644 apps/dokploy/components/dashboard/project/ai/step-three.tsx create mode 100644 apps/dokploy/components/dashboard/project/ai/step-two.tsx create mode 100644 apps/dokploy/components/dashboard/project/ai/template-generator.tsx create mode 100644 apps/dokploy/components/dashboard/settings/ai-form.tsx create mode 100644 apps/dokploy/components/ui/skeleton.tsx create mode 100644 apps/dokploy/drizzle/0054_cooing_typhoid_mary.sql create mode 100644 apps/dokploy/drizzle/meta/0054_snapshot.json create mode 100644 apps/dokploy/pages/dashboard/settings/ai.tsx create mode 100644 apps/dokploy/server/api/routers/ai.ts create mode 100644 packages/server/src/db/schema/ai.ts create mode 100644 packages/server/src/services/ai.ts create mode 100644 packages/server/src/utils/ai/index.ts create mode 100644 packages/server/src/utils/ai/select-ai-provider.ts diff --git a/apps/dokploy/components/dashboard/project/add-ai-assistant.tsx b/apps/dokploy/components/dashboard/project/add-ai-assistant.tsx new file mode 100644 index 00000000..2bb47618 --- /dev/null +++ b/apps/dokploy/components/dashboard/project/add-ai-assistant.tsx @@ -0,0 +1,10 @@ +import { TemplateGenerator } from "@/components/dashboard/project/ai/template-generator"; + +interface Props { + projectId: string; + projectName?: string; +} + +export const AddAiAssistant = ({ projectId }: Props) => { + return ; +}; diff --git a/apps/dokploy/components/dashboard/project/ai/step-four.tsx b/apps/dokploy/components/dashboard/project/ai/step-four.tsx new file mode 100644 index 00000000..276869f7 --- /dev/null +++ b/apps/dokploy/components/dashboard/project/ai/step-four.tsx @@ -0,0 +1,92 @@ +import { Button } from "@/components/ui/button"; +import { ScrollArea } from "@/components/ui/scroll-area"; +import dynamic from "next/dynamic"; +import ReactMarkdown from "react-markdown"; + +const MonacoEditor = dynamic(() => import("@monaco-editor/react"), { + ssr: false, +}); + +export function StepFour({ + prevStep, + templateInfo, + setOpen, + setTemplateInfo, +}: any) { + const handleSubmit = () => { + setTemplateInfo(templateInfo); // Update the template info + setOpen(false); + }; + + return ( +
+
+
+

Step 4: Review and Finalize

+ +
+
+ + {templateInfo.details.description} + +
+
+

Name

+

{templateInfo.name}

+
+
+

Server

+

{templateInfo.server || "localhost"}

+
+
+

Docker Compose

+ +
+
+

Environment Variables

+
    + {templateInfo.details.envVariables.map( + ( + env: { + name: string; + value: string; + }, + index: number, + ) => ( +
  • + {env.name}: + {env.value} +
  • + ), + )} +
+
+
+
+
+
+
+
+ + +
+
+
+ ); +} diff --git a/apps/dokploy/components/dashboard/project/ai/step-one.tsx b/apps/dokploy/components/dashboard/project/ai/step-one.tsx new file mode 100644 index 00000000..704816e2 --- /dev/null +++ b/apps/dokploy/components/dashboard/project/ai/step-one.tsx @@ -0,0 +1,69 @@ +"use client"; + +import { Button } from "@/components/ui/button"; +import { Label } from "@/components/ui/label"; +import { Textarea } from "@/components/ui/textarea"; +import { useState } from "react"; + +const examples = [ + "Make a personal blog", + "Add a photo studio portfolio", + "Create a personal ad blocker", + "Build a social media dashboard", + "Sendgrid service opensource analogue", +]; + +export function StepOne({ nextStep, setTemplateInfo, templateInfo }: any) { + const [userInput, setUserInput] = useState(templateInfo.userInput); + + const handleNext = () => { + setTemplateInfo({ ...templateInfo, userInput }); + nextStep(); + }; + + const handleExampleClick = (example: string) => { + setUserInput(example); + }; + + return ( +
+
+
+

Step 1: Describe Your Needs

+
+ +