fix llm prompt for mobile
This commit is contained in:
parent
61143d2c20
commit
d733b61a66
|
|
@ -29,7 +29,7 @@ import { SlideShape } from "@/shapes/SlideShapeUtil"
|
||||||
import { makeRealSettings, applySettingsMigrations } from "@/lib/settings"
|
import { makeRealSettings, applySettingsMigrations } from "@/lib/settings"
|
||||||
import { PromptShapeTool } from "@/tools/PromptShapeTool"
|
import { PromptShapeTool } from "@/tools/PromptShapeTool"
|
||||||
import { PromptShape } from "@/shapes/PromptShapeUtil"
|
import { PromptShape } from "@/shapes/PromptShapeUtil"
|
||||||
import { llm } from "@/utils/llm"
|
import { llm } from "@/utils/llmUtils"
|
||||||
|
|
||||||
// Default to production URL if env var isn't available
|
// Default to production URL if env var isn't available
|
||||||
export const WORKER_URL = "https://jeffemmett-canvas.jeffemmett.workers.dev"
|
export const WORKER_URL = "https://jeffemmett-canvas.jeffemmett.workers.dev"
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import {
|
||||||
TLShape,
|
TLShape,
|
||||||
} from "tldraw"
|
} from "tldraw"
|
||||||
import { getEdge } from "@/propagators/tlgraph"
|
import { getEdge } from "@/propagators/tlgraph"
|
||||||
import { llm } from "@/utils/llm"
|
import { llm } from "@/utils/llmUtils"
|
||||||
import { isShapeOfType } from "@/propagators/utils"
|
import { isShapeOfType } from "@/propagators/utils"
|
||||||
|
|
||||||
type IPrompt = TLBaseShape<
|
type IPrompt = TLBaseShape<
|
||||||
|
|
@ -74,8 +74,8 @@ export class PromptShape extends BaseBoxShapeUtil<IPrompt> {
|
||||||
return acc
|
return acc
|
||||||
}, {} as Record<string, TLShape>)
|
}, {} as Record<string, TLShape>)
|
||||||
|
|
||||||
const generateText = async (prompt: string) => {
|
const generateText = async (prompt: string) => {
|
||||||
await llm("", prompt, (partial: string, done: boolean) => {
|
await llm(prompt, (partial: string, done: boolean) => {
|
||||||
console.log("DONE??", done)
|
console.log("DONE??", done)
|
||||||
this.editor.updateShape<IPrompt>({
|
this.editor.updateShape<IPrompt>({
|
||||||
id: shape.id,
|
id: shape.id,
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,7 @@ import {
|
||||||
TldrawUiMenuActionItem,
|
TldrawUiMenuActionItem,
|
||||||
TldrawUiMenuItem,
|
TldrawUiMenuItem,
|
||||||
TldrawUiMenuSubmenu,
|
TldrawUiMenuSubmenu,
|
||||||
|
TLGeoShape,
|
||||||
TLShape,
|
TLShape,
|
||||||
} from "tldraw"
|
} from "tldraw"
|
||||||
import { TldrawUiMenuGroup } from "tldraw"
|
import { TldrawUiMenuGroup } from "tldraw"
|
||||||
|
|
@ -19,6 +20,8 @@ import { useState, useEffect } from "react"
|
||||||
import { saveToPdf } from "../utils/pdfUtils"
|
import { saveToPdf } from "../utils/pdfUtils"
|
||||||
import { TLFrameShape } from "tldraw"
|
import { TLFrameShape } from "tldraw"
|
||||||
import { searchText } from "../utils/searchUtils"
|
import { searchText } from "../utils/searchUtils"
|
||||||
|
import { llm } from "../utils/llmUtils"
|
||||||
|
import { getEdge } from "@/propagators/tlgraph"
|
||||||
|
|
||||||
const getAllFrames = (editor: Editor) => {
|
const getAllFrames = (editor: Editor) => {
|
||||||
return editor
|
return editor
|
||||||
|
|
@ -97,6 +100,41 @@ export function CustomContextMenu(props: TLUiContextMenuProps) {
|
||||||
disabled={!hasSelection}
|
disabled={!hasSelection}
|
||||||
onSelect={() => saveToPdf(editor)}
|
onSelect={() => saveToPdf(editor)}
|
||||||
/>
|
/>
|
||||||
|
<TldrawUiMenuItem
|
||||||
|
id="run-llm-prompt"
|
||||||
|
label="Run LLM Prompt"
|
||||||
|
icon="file"
|
||||||
|
kbd="g"
|
||||||
|
disabled={!hasSelection}
|
||||||
|
onSelect={() => {
|
||||||
|
const selectedShape = editor.getSelectedShapes()[0];
|
||||||
|
if (!selectedShape || selectedShape.type !== 'arrow') return;
|
||||||
|
|
||||||
|
const edge = getEdge(selectedShape, editor);
|
||||||
|
if (!edge) return;
|
||||||
|
|
||||||
|
const sourceShape = editor.getShape(edge.from);
|
||||||
|
const sourceText =
|
||||||
|
sourceShape && sourceShape.type === "geo"
|
||||||
|
? (sourceShape as TLGeoShape).props.text
|
||||||
|
: "";
|
||||||
|
|
||||||
|
llm(
|
||||||
|
`Instruction: ${edge.text}
|
||||||
|
${sourceText ? `Context: ${sourceText}` : ""}`,
|
||||||
|
(partialResponse) => {
|
||||||
|
editor.updateShape({
|
||||||
|
id: edge.to,
|
||||||
|
type: "geo",
|
||||||
|
props: {
|
||||||
|
...(editor.getShape(edge.to) as TLGeoShape).props,
|
||||||
|
text: partialResponse
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</TldrawUiMenuGroup>
|
</TldrawUiMenuGroup>
|
||||||
|
|
||||||
{/* Creation Tools Group */}
|
{/* Creation Tools Group */}
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@ import { EmbedShape, IEmbedShape } from "@/shapes/EmbedShapeUtil"
|
||||||
import { moveToSlide } from "@/slides/useSlides"
|
import { moveToSlide } from "@/slides/useSlides"
|
||||||
import { ISlideShape } from "@/shapes/SlideShapeUtil"
|
import { ISlideShape } from "@/shapes/SlideShapeUtil"
|
||||||
import { getEdge } from "@/propagators/tlgraph"
|
import { getEdge } from "@/propagators/tlgraph"
|
||||||
import { llm } from "@/utils/llm"
|
import { llm } from "@/utils/llmUtils"
|
||||||
|
|
||||||
export const overrides: TLUiOverrides = {
|
export const overrides: TLUiOverrides = {
|
||||||
tools(editor, tools) {
|
tools(editor, tools) {
|
||||||
|
|
@ -407,7 +407,6 @@ export const overrides: TLUiOverrides = {
|
||||||
? (sourceShape as TLGeoShape).props.text
|
? (sourceShape as TLGeoShape).props.text
|
||||||
: ""
|
: ""
|
||||||
llm(
|
llm(
|
||||||
"You are a helpful assistant.",
|
|
||||||
`Instruction: ${edge.text}
|
`Instruction: ${edge.text}
|
||||||
${sourceText ? `Context: ${sourceText}` : ""}`,
|
${sourceText ? `Context: ${sourceText}` : ""}`,
|
||||||
(partialResponse) => {
|
(partialResponse) => {
|
||||||
|
|
|
||||||
|
|
@ -7,15 +7,15 @@ const openai = new OpenAI({
|
||||||
});
|
});
|
||||||
|
|
||||||
export async function llm(
|
export async function llm(
|
||||||
systemPrompt: string,
|
//systemPrompt: string,
|
||||||
userPrompt: string,
|
userPrompt: string,
|
||||||
onToken: (partialResponse: string, done: boolean) => void,
|
onToken: (partialResponse: string, done: boolean) => void,
|
||||||
) {
|
) {
|
||||||
if (!apiKey) {
|
if (!apiKey) {
|
||||||
throw new Error("No API key found")
|
throw new Error("No API key found")
|
||||||
}
|
}
|
||||||
console.log("System Prompt:", systemPrompt);
|
//console.log("System Prompt:", systemPrompt);
|
||||||
console.log("User Prompt:", userPrompt);
|
//console.log("User Prompt:", userPrompt);
|
||||||
let partial = "";
|
let partial = "";
|
||||||
const stream = await openai.chat.completions.create({
|
const stream = await openai.chat.completions.create({
|
||||||
model: "gpt-4o",
|
model: "gpt-4o",
|
||||||
Loading…
Reference in New Issue