85 lines
2.6 KiB
Vue
85 lines
2.6 KiB
Vue
<script setup lang="ts">
|
|
import { Button } from '@/registry/new-york/ui/button'
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
DialogTrigger,
|
|
} from '@/registry/new-york/ui/dialog'
|
|
</script>
|
|
|
|
<template>
|
|
<Dialog>
|
|
<DialogTrigger as-child>
|
|
<Button variant="secondary">
|
|
View code
|
|
</Button>
|
|
</DialogTrigger>
|
|
<DialogContent class="sm:max-w-[625px]">
|
|
<DialogHeader>
|
|
<DialogTitle>View code</DialogTitle>
|
|
<DialogDescription>
|
|
You can use the following code to start integrating your current
|
|
prompt and settings into your application.
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
<div class="grid gap-4">
|
|
<div class="rounded-md bg-black p-6">
|
|
<pre>
|
|
<code class="grid gap-1 text-sm text-muted-foreground [&_span]:h-4">
|
|
<span>
|
|
<span class="text-sky-300">import</span> os
|
|
</span>
|
|
<span>
|
|
<span class="text-sky-300">import</span> openai
|
|
</span>
|
|
<span />
|
|
<span>
|
|
openai.api_key = os.getenv(
|
|
<span class="text-green-300">
|
|
"OPENAI_API_KEY"
|
|
</span>
|
|
)
|
|
</span>
|
|
<span />
|
|
<span>response = openai.Completion.create(</span>
|
|
<span>
|
|
model=
|
|
<span class="text-green-300">"davinci"</span>,
|
|
</span>
|
|
<span>
|
|
prompt=<span class="text-amber-300">""</span>,
|
|
</span>
|
|
<span>
|
|
temperature=<span class="text-amber-300">0.9</span>,
|
|
</span>
|
|
<span>
|
|
max_tokens=<span class="text-amber-300">5</span>,
|
|
</span>
|
|
<span>
|
|
top_p=<span class="text-amber-300">1</span>,
|
|
</span>
|
|
<span>
|
|
frequency_penalty=<span class="text-amber-300">0</span>,
|
|
</span>
|
|
<span>
|
|
presence_penalty=<span class="text-green-300">0</span>,
|
|
</span>
|
|
<span>)</span>
|
|
</code>
|
|
</pre>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm text-muted-foreground">
|
|
Your API Key can be found here. You should use environment
|
|
variables or a secret management tool to expose your key to your
|
|
applications.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</DialogContent>
|
|
</Dialog>
|
|
</template>
|