77 | Generate a twitter thread from a youtube video
78 |
79 |
80 | Generate a blog from a youtube video
81 |
82 |
83 | Chat with the youtube video
84 |
85 |
86 |
87 |
88 |
89 | );
90 | };
91 |
--------------------------------------------------------------------------------
/utils/index.ts:
--------------------------------------------------------------------------------
1 | import { decode, encode } from "gpt-tokenizer";
2 |
3 | const openAiHandler = async (
4 | query: string,
5 | variant: string,
6 | instructions?: string
7 | ) => {
8 | let encoded = encode(query);
9 | query = "";
10 |
11 | if (encoded?.length > 10000) {
12 | encoded = encoded.slice(0, 10000);
13 | }
14 | const decoded = await decode(encoded);
15 | const tweetExample = [
16 | {
17 | role: "user",
18 | content: "Example",
19 | },
20 | {
21 | role: "assistant",
22 | content: "['Tweet1', 'Tweet2']",
23 | },
24 | {
25 | role: "user",
26 | content: `A new PostgreSQL extension is now available in Supabase: pgvector, an open-source vector similarity search. The exponential progress of AI functionality over the past year has inspired many new real world applications. One specific challenge has been the ability to store and query embeddings at scale. In this post we'll explain what embeddings are, why we might want to use them, and how we can store and query them in PostgreSQL using pgvector.`,
27 | },
28 | {
29 | role: "assistant",
30 | content: `["🚀 Exciting news! 🎉 Supabase has just released a new PostgreSQL extension called pgvector! 🐘 It's an open-source vector similarity search that enables storing and querying of embeddings at scale. Let's dive in to learn more about this game-changing technology! #AI #PostgreSQL #pgvector", "🔎 What are embeddings, you ask? Embeddings are dense numerical representations of data that capture its semantic meaning. They have been crucial in various AI applications such as natural language processing and computer vision. #AI #Embeddings #pgvector", "💡 With the exponential progress in AI functionality, the demand for storing and querying embeddings at scale has increased. That's where pgvector comes in. It allows you to efficiently store and search vector embeddings directly in PostgreSQL 🐘. Say goodbye to performance bottlenecks! #pgvector #PostgreSQL", "🔍 Wondering how to get started with pgvector? It's as easy as installing the extension and creating a pgvector column on your table. Just a few simple steps, and you're ready to store and query your vector embeddings at lightning speed! ⚡️ #pgvector #AI #PostgreSQL", "🎯 Whether you're working on recommendation systems, image recognition, or any AI application that requires similarity search, pgvector and Supabase have got your back! Say hello to efficient, scalable, and lightning-fast vector similarity search with pgvector! 🚀 #pgvector #Supabase"]`,
31 | },
32 | ];
33 |
34 | const response = await fetch(`https://api.openai.com/v1/chat/completions`, {
35 | method: "POST",
36 | headers: {
37 | "Content-Type": "application/json",
38 | Authorization: `Bearer ${process.env.OPENAI_API_KEY}`,
39 | },
40 | body: JSON.stringify({
41 | model: "gpt-3.5-turbo-16k",
42 | messages: [
43 | {
44 | role: "system",
45 | content:
46 | variant === "blog"
47 | ? `You are a highly efficient assistant specializing in converting user information into engaging, viral SEO-friendly detailed blog posts. Adhering to the key structure of a blog post - including Heading 1, Introduction, Body, and End notes - you weave compelling narratives without deviating from the facts provided in the input text. Please ensure responses are returned in markdown format.`
48 | : `You are a highly efficient assistant that can turn user input into a concise, engaging viral tweet thread. While aiming to include all key information, keep the thread to a maximum of 5 tweets. Please formulate responses in this format ["Tweet1", "Tweet2"].`,
49 | },
50 | ...(variant === "tweet" ? tweetExample : []),
51 | {
52 | role: "user",
53 | content: `${
54 | instructions
55 | ? `Instructions given by user: ${instructions}\n Content:\n`
56 | : ""
57 | }${decoded}`,
58 | },
59 | ],
60 | max_tokens: 1800,
61 | temperature: 0.4,
62 | stream: false,
63 | }),
64 | });
65 | const data = await response.json();
66 |
67 | return data?.choices?.[0]?.message?.content ?? null;
68 | };
69 |
70 | export { openAiHandler };
71 |
--------------------------------------------------------------------------------
/app/components/ActionComponent.tsx:
--------------------------------------------------------------------------------
1 | import { useState } from "react";
2 | import Loading from "../components/SvgComps/loading";
3 | import axios from "axios";
4 | import { GithubButton } from "./GithubButton";
5 |
6 | export const ActionComponent = ({
7 | setSessionId,
8 | sessionId,
9 | }: {
10 | setSessionId: (sessionId: string) => void;
11 | sessionId: string;
12 | }) => {
13 | const [action, setAction] = useState("");
14 | const [loading, setLoading] = useState(false);
15 | const [instructions, setInstructions] = useState("");
16 |
17 | const generateContent = (variant: string) => {
18 | axios
19 | .post("/api/content", {
20 | sessionId: sessionId,
21 | variant,
22 | instructions,
23 | })
24 | .then(() => {
25 | const a = document.createElement("a");
26 | a.setAttribute(
27 | "href",
28 | `${window.location.origin}/${variant}/${sessionId}`
29 | );
30 | a.setAttribute("target", "_blank");
31 | a.setAttribute("hidden", "true");
32 | document.body.appendChild(a);
33 | a.click();
34 | document.body.removeChild(a);
35 | })
36 | .catch(() => {
37 | alert("Something went wrong, please try again.");
38 | })
39 | .finally(() => {
40 | setLoading(false);
41 | });
42 | };
43 |
44 | const startChat = () => {
45 | const a = document.createElement("a");
46 | a.setAttribute("href", `${window.location.origin}/chat/${sessionId}`);
47 | a.setAttribute("target", "_blank");
48 | a.setAttribute("hidden", "true");
49 | document.body.appendChild(a);
50 | a.click();
51 | document.body.removeChild(a);
52 | };
53 |
54 | return (
55 |
56 |
57 | {
59 | setSessionId("");
60 | }}
61 | className="text-sm cursor-pointer font-thin"
62 | >{`<- Go Back`}
63 | What would you like to do with this video?
64 |