add characters, formats, styles and tones

This commit is contained in:
Andrei Canta 2023-03-18 12:42:08 +02:00
parent ee5dd3abd7
commit 881ba95664
3 changed files with 262 additions and 43 deletions

View file

@ -5,6 +5,8 @@ import {
Container,
Flex,
MediaQuery,
Select,
SimpleGrid,
Skeleton,
Stack,
Textarea,
@ -17,7 +19,12 @@ import { AiOutlineSend } from "react-icons/ai";
import { MessageItem } from "../components/MessageItem";
import { db } from "../db";
import { useChatId } from "../hooks/useChatId";
import { characters } from "../utils/characters";
import {
writingCharacters,
writingFormats,
writingStyles,
writingTones,
} from "../utils/constants";
import { createChatCompletion } from "../utils/openai";
export function ChatRoute() {
@ -37,7 +44,23 @@ export function ChatRoute() {
return db.chats.get(chatId);
}, [chatId]);
const [character, setCharacter] = useState(0);
const [writingCharacter, setWritingCharacter] = useState<string | null>(null);
const [writingTone, setWritingTone] = useState<string | null>(null);
const [writingStyle, setWritingStyle] = useState<string | null>(null);
const [writingFormat, setWritingFormat] = useState<string | null>(null);
const getSystemMessage = () => {
const message: string[] = [];
if (writingCharacter) message.push(`You are ${writingCharacter}.`);
if (writingTone) message.push(`Respond in ${writingTone} tone.`);
if (writingStyle) message.push(`Respond in ${writingStyle} style.`);
if (writingFormat) message.push(writingFormat);
if (message.length === 0)
message.push(
"You are ChatGPT, a large language model trained by OpenAI."
);
return message.join(" ");
};
const submit = async () => {
if (submitting) return;
@ -75,7 +98,7 @@ export function ChatRoute() {
const result = await createChatCompletion(apiKey, [
{
role: "system",
content: `You are a ${characters[character].name}.${characters[character].description}`,
content: getSystemMessage(),
},
...(messages ?? []).map((message) => ({
role: message.role,
@ -111,7 +134,7 @@ export function ChatRoute() {
const createChatDscription = await createChatCompletion(apiKey, [
{
role: "system",
content: `You are a ${characters[character].name}.${characters[character].description}`,
content: getSystemMessage(),
},
...(messages ?? []).map((message) => ({
role: message.role,
@ -194,10 +217,61 @@ export function ChatRoute() {
})}
>
<Container>
{messages?.length === 0 && (
<SimpleGrid
mb="sm"
spacing="xs"
breakpoints={[
{ minWidth: "sm", cols: 4 },
{ maxWidth: "sm", cols: 2 },
]}
>
<Select
value={writingCharacter}
onChange={setWritingCharacter}
data={writingCharacters}
placeholder="Character"
variant="filled"
searchable
clearable
sx={{ flex: 1 }}
/>
<Select
value={writingTone}
onChange={setWritingTone}
data={writingTones}
placeholder="Tone"
variant="filled"
searchable
clearable
sx={{ flex: 1 }}
/>
<Select
value={writingStyle}
onChange={setWritingStyle}
data={writingStyles}
placeholder="Style"
variant="filled"
searchable
clearable
sx={{ flex: 1 }}
/>
<Select
value={writingFormat}
onChange={setWritingFormat}
data={writingFormats}
placeholder="Format"
variant="filled"
searchable
clearable
sx={{ flex: 1 }}
/>
</SimpleGrid>
)}
<Flex gap="sm">
<Textarea
key={chatId}
style={{ flex: 1 }}
sx={{ flex: 1 }}
placeholder="Your message here..."
autosize
autoFocus

View file

@ -1,38 +0,0 @@
export const characters = [
{
name: "ChatGPT",
description: "You are ChatGPT, a large language model trained by OpenAI.",
},
{
name: "Standup Comedian",
description: "A standup comedian who can make you laugh with their jokes and humor.",
},
{
name: "Life Coach",
description: "A life coach who can help you set and achieve personal and professional goals.",
},
{
name: "Career Counselor",
description: "A career counselor who can help you with anything related to your career, from job searching to career planning.",
},
{
name: "Nutritionist",
description: "A nutritionist who can help you with your dietary needs by providing recipes, advice on healthy eating habits, and dietary recommendations.",
},
{
name: "Product Manager",
description: "A product manager who can oversee the development and marketing of a product, identify customer needs, and work with engineers and designers to create a product roadmap.",
},
{
name: "Personal Trainer",
description: "A personal trainer who can help you stay fit and improve your health by creating personalized fitness plans and providing workout routines.",
},
{
name: "Life Hacker",
description: "A life hacker who can provide useful tips and tricks to help you optimize your daily routines, save time, and increase productivity.",
},
{
name: "Travel Advisor",
description: "A travel advisor who can suggest travel destinations, provide recommendations on transportation and accommodations, and help you plan your itinerary based on your preferences and budget.",
},
]

183
src/utils/constants.ts Normal file
View file

@ -0,0 +1,183 @@
export const writingCharacters = [
{
label: "Standup Comedian",
value:
"A performer who entertains audiences by telling jokes and humorous stories.",
},
{
label: "Life Coach",
value:
"A professional who helps individuals identify and achieve their personal and professional goals.",
},
{
label: "Career Counselor",
value:
"A professional who helps individuals explore and choose careers, develop job search strategies, and improve job performance.",
},
{
label: "Nutritionist",
value:
"A health professional who specializes in the study of nutrition and its effects on the body.",
},
{
label: "Product Manager",
value:
"A professional who oversees the development and marketing of a company's products.",
},
{
label: "Personal Trainer",
value:
"A fitness professional who works with individuals to develop personalized exercise programs and improve their overall health and fitness.",
},
{
label: "Life Hacker",
value:
"A person who uses unconventional methods to solve problems and increase productivity in everyday life.",
},
{
label: "Travel Advisor",
value:
"A professional who helps individuals plan and book travel arrangements.",
},
{
label: "Mindfulness Coach",
value:
"A professional who helps individuals develop mindfulness practices to reduce stress and improve well-being.",
},
{
label: "Financial Advisor",
value:
"A professional who provides guidance and advice on financial planning, investment strategies, and retirement planning.",
},
{
label: "Language Tutor",
value:
"A teacher who helps individuals learn and improve their language skills.",
},
{
label: "Travel Guide",
value:
"A professional who leads tours and provides information about local attractions and culture.",
},
{
label: "Marketing Expert",
value:
"A professional who develops and implements marketing strategies to promote products and services.",
},
{
label: "Software Developer",
value:
"A professional who designs, develops, and maintains software applications and systems.",
},
{
label: "Dating Coach",
value:
"A professional who helps individuals improve their dating and relationship skills.",
},
{
label: "DIY Expert",
value:
"A person who is skilled at completing a wide range of do-it-yourself projects around the home.",
},
{
label: "Journalist",
value:
"A professional who investigates and reports on current events and news stories.",
},
{
label: "Tech Writer",
value:
"A professional who writes about technology and related topics for a variety of audiences.",
},
{
label: "Professional Chef",
value:
"A skilled culinary professional who prepares meals and manages kitchen operations.",
},
{
label: "Professional Salesperson",
value:
"A professional who sells products and services to businesses and consumers.",
},
{
label: "Startup Tech Lawyer",
value:
"A legal professional who specializes in providing legal advice and services to startup technology companies.",
},
{
label: "Graphic Designer",
value:
"A professional who designs visual materials such as logos, brochures, and websites.",
},
{
label: "Academic Researcher",
value:
"A professional who conducts research and produces scholarly work in a particular academic field.",
},
{
label: "Customer Support Agent",
value:
"A professional who provides assistance and support to customers who have questions or problems with a company's products or services.",
},
{
label: "HR Consultant",
value:
"A professional who provides guidance and advice to organizations on human resource management and strategy",
},
];
export const writingTones = [
"Assertive",
"Authoritative",
"Casual",
"Confident",
"Condescending",
"Conversational",
"Diplomatic",
"Direct",
"Eloquent",
"Formal",
"Friendly",
"Humorous",
"Informative",
"Inspiring",
"Intense",
"Irritable",
"Joking",
"Polite",
"Sarcastic",
"Sincere",
"Soothing",
"Stern",
"Sympathetic",
"Tactful",
"Witty",
];
export const writingStyles = [
"Academic",
"Analytical",
"Argumentative",
"Conversational",
"Creative",
"Critical",
"Descriptive",
"Explanatory",
"Informative",
"Instructive",
"Investigative",
"Journalistic",
"Metaphorical",
"Narrative",
"Persuasive",
"Poetic",
"Satirical",
"Technical",
];
export const writingFormats = [
{ value: "Answer as concise as possible", label: "Concise" },
{ value: "Think step-by-step", label: "Step-by-step" },
{ value: "Answer in painstakingly detail", label: "Extreme Detail" },
{ value: "Explain like I'm five", label: "Explain Like I'm Five" },
];