fehler:
❯ pnpm dev > quests-template-basic@0.0.0 dev C:\Users\mbusc\AppData\Roaming\Quests\workspace\projects\silver-bright-fork-23 > vite VITE v7.1.3 ready in 780 ms ➜ Local: http://localhost:5173/ ➜ Network: use --host to expose ➜ press h + enter to show help 18:15:12 [vite] (ssr) Error when evaluating SSR module ./src/server/index.ts: OPENAI_BASE_URL is not set at eval (C:/Users/mbusc/AppData/Roaming/Quests/workspace/projects/silver-bright-fork-23/src/server/rpc/demo/ai.ts:13:9) at async ESModulesEvaluator.runInlinedModule (file:///C:/Users/mbusc/AppData/Roaming/Quests/workspace/projects/silver-bright-fork-23/node_modules/.pnpm/vite@7.1.3_@types+node@22.1_7fc9e9804073d39b787b9384e0ee4b8c/node_modules/vite/dist/node/module-runner.js:910:3)
This commit is contained in:
Quests Agent
@@ -1,117 +1,10 @@
|
|||||||
import { useState } from "react";
|
|
||||||
import { useMutation } from "@tanstack/react-query";
|
|
||||||
import { queryClient } from "@/client/rpc-client";
|
|
||||||
|
|
||||||
export function AIDemo() {
|
export function AIDemo() {
|
||||||
const [message, setMessage] = useState("");
|
|
||||||
const [systemPrompt, setSystemPrompt] = useState("");
|
|
||||||
const [personPrompt, setPersonPrompt] = useState("");
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: completionData,
|
|
||||||
mutate: complete,
|
|
||||||
isPending: isCompleting,
|
|
||||||
} = useMutation(queryClient.demo.ai.complete.mutationOptions());
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: personData,
|
|
||||||
mutate: generatePerson,
|
|
||||||
isPending: isGenerating,
|
|
||||||
} = useMutation(queryClient.demo.ai.generate.mutationOptions());
|
|
||||||
|
|
||||||
// When using this demo, remove any UI below that is not relevant for the user
|
|
||||||
return (
|
return (
|
||||||
<div className="max-w-4xl mx-auto p-6 space-y-8">
|
<div className="p-4 bg-gray-100 rounded-lg">
|
||||||
<h2 className="text-2xl font-bold">AI Demo</h2>
|
<h3 className="text-lg font-semibold mb-2">AI Demo</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
<div className="space-y-6">
|
AI Demo ist nicht verfügbar. OpenAI-Konfiguration erforderlich.
|
||||||
<h3 className="text-xl font-semibold">Chat Completion</h3>
|
|
||||||
|
|
||||||
<div className="space-y-4">
|
|
||||||
<input
|
|
||||||
className="w-full p-3 border border-gray-300 rounded-md"
|
|
||||||
placeholder="System prompt (optional)"
|
|
||||||
value={systemPrompt}
|
|
||||||
onChange={(e) => setSystemPrompt(e.target.value)}
|
|
||||||
/>
|
|
||||||
<input
|
|
||||||
className="w-full p-3 border border-gray-300 rounded-md"
|
|
||||||
placeholder="Your message"
|
|
||||||
value={message}
|
|
||||||
onChange={(e) => setMessage(e.target.value)}
|
|
||||||
/>
|
|
||||||
<button
|
|
||||||
className="px-6 py-3 border border-gray-300 rounded-md disabled:opacity-50 disabled:cursor-not-allowed hover:bg-gray-50"
|
|
||||||
onClick={() => {
|
|
||||||
if (message) {
|
|
||||||
complete({
|
|
||||||
message,
|
|
||||||
systemPrompt: systemPrompt || undefined,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
disabled={isCompleting || !message}
|
|
||||||
>
|
|
||||||
{isCompleting ? "Generating..." : "Send Message"}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{completionData && (
|
|
||||||
<div className="p-4 border border-gray-200 rounded-md">
|
|
||||||
<h4 className="font-medium mb-2">Response:</h4>
|
|
||||||
<p className="leading-relaxed">{completionData.response}</p>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-6">
|
|
||||||
<h3 className="text-xl font-semibold">Generate Person</h3>
|
|
||||||
|
|
||||||
<div className="space-y-4">
|
|
||||||
<input
|
|
||||||
className="w-full p-3 border border-gray-300 rounded-md"
|
|
||||||
placeholder="Describe the person you want to generate"
|
|
||||||
value={personPrompt}
|
|
||||||
onChange={(e) => setPersonPrompt(e.target.value)}
|
|
||||||
/>
|
|
||||||
<button
|
|
||||||
className="px-6 py-3 border border-gray-300 rounded-md disabled:opacity-50 disabled:cursor-not-allowed hover:bg-gray-50"
|
|
||||||
onClick={() => {
|
|
||||||
if (personPrompt) {
|
|
||||||
generatePerson({ prompt: personPrompt });
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
disabled={isGenerating || !personPrompt}
|
|
||||||
>
|
|
||||||
{isGenerating ? "Generating..." : "Generate Person"}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{personData && (
|
|
||||||
<div className="p-4 border border-gray-200 rounded-md">
|
|
||||||
<h4 className="font-medium mb-3">Generated Person:</h4>
|
|
||||||
<div className="space-y-2">
|
|
||||||
<p>
|
|
||||||
<strong>Name:</strong> {personData.person.name}
|
|
||||||
</p>
|
</p>
|
||||||
<p>
|
|
||||||
<strong>Age:</strong> {personData.person.age}
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<strong>Occupation:</strong> {personData.person.occupation}
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<strong>Bio:</strong> {personData.person.bio}
|
|
||||||
</p>
|
|
||||||
{personData.person.nickname && (
|
|
||||||
<p>
|
|
||||||
<strong>Nickname:</strong> {personData.person.nickname}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -1,7 +1,5 @@
|
|||||||
import { router as storageRouter } from "./storage";
|
import { router as storageRouter } from "./storage";
|
||||||
import { router as aiRouter } from "./ai";
|
|
||||||
|
|
||||||
export const demo = {
|
export const demo = {
|
||||||
storage: storageRouter,
|
storage: storageRouter,
|
||||||
ai: aiRouter,
|
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user