Skip to content

Administrator / chatgpt.ai-pro.org

Go to a project
Toggle navigation
Toggle navigation pinning
4e4163e2 by RSA
Options

pull latest

2 parents b8c46df5 5d77d99f
Inline Side-by-side
Showing 6 changed files with 203 additions and 37 deletions
client/src/App.css
......@@ -210,6 +210,62 @@
background:#066d55;
}
.suggested {
display: block;
z-index: 99999999;
color: #000;
position: absolute;
text-align: center;
padding: 25px;
top: 0;
right: 0;
bottom: 89px;
left: 0;
overflow-y: scroll;
}
.suggestedcol {
width: 30%;
display: inline-block;
margin: 0;
text-align: center;
vertical-align: top;
}
.suggestedcol ul {
list-style: none;
padding: 0 25px;
}
.suggestedrow.title {
padding: 4vw 20px;
}
.suggestedcol ul li {
background: #5c6aa529;
padding: 10px;
border-radius: 5px;
margin: 0 0 10px;
}
ul.suggested-options {
cursor: pointer;
overflow-x: hidden;
height: 200px;
padding-right: 5px !important;
}
@media (max-width: 991px) {
.suggestedcol {
width: 100%;
}
.suggestedrow.title {
padding: 10px 10px 0 10px;
}
}
.message .error_msg {
background: rgb(18 0 255 / 20%);
padding: 10px;
......@@ -235,4 +291,4 @@
margin: 0 10px;
font-style: italic;
width: 80%;
}
\ No newline at end of file
}
......
client/src/App.js
......@@ -23,6 +23,8 @@ function App() {
// clear chats
function clearChat(){
setChatLog([]);
setChatInput("");
setStartedInteraction(false);
}
function getEngines(){
......@@ -43,7 +45,7 @@ function App() {
async function handleSubmit(e){
e.preventDefault();
// console.log(chatInput)
const userInput = ['what', 'why', 'when', 'where' , 'which', 'did', 'do', 'how', 'can', 'are', 'who', 'hey'];
const userInput = ['what', 'why', 'when', 'where' , 'which', 'did', 'do', 'how', 'can', 'are', 'who'];
const userInputRegex = new RegExp(`\\b(${userInput.join('|')})\\b`, 'gi');
const inputMatches = chatInput.match(userInputRegex);
......@@ -113,7 +115,7 @@ function App() {
}
}
const [startedInteraction, setStartedInteraction] = useState(false);
return (
<div className="App">
<SideMenu
......@@ -124,10 +126,13 @@ function App() {
temperature={temperature}
clearChat={clearChat}
/>
<ChatBox
chatInput={chatInput}
chatLog={chatLog}
setChatInput={setChatInput}
startedInteraction={startedInteraction}
setStartedInteraction={setStartedInteraction}
handleSubmit={handleSubmit} />
</div>
);
......
client/src/ChatBox.js
// import OpenAISVGLogo from './OpenAISVGLogo'
import React, { useState } from "react";
import SuggestedOptions from './suggestedOptions'
// Primary Chat Window
const ChatBox = ({chatLog, setChatInput, handleSubmit, chatInput}) =>
<section className="chatbox">
<div className="chat-log">
{chatLog.map((message, index) => (
<ChatMessage key={index} message={message} />
))}
</div>
<div className="chat-input-holder">
<form className="form" onSubmit={handleSubmit}>
<input
rows="1"
value={chatInput}
onChange={(e)=> setChatInput(e.target.value)}
className="chat-input-textarea" ></input>
<button className="submit" type="submit">Submit</button>
</form>
const ChatBox = ({chatLog, setChatInput, handleSubmit, chatInput, startedInteraction, setStartedInteraction}) => {
return (
<section className="chatbox">
{!startedInteraction ? (
<SuggestedOptions setChatInput={setChatInput}/>
) : (
<>
<div className="chat-log">
{chatLog.map((message, index) => (
<ChatMessage key={index} message={message} />
))}
</div>
</section>
// Individual Chat Message
</>
)}
<div className="chat-input-holder">
<form className="form" onSubmit={handleSubmit }>
<input
rows="1"
value={chatInput}
onChange={(e)=> {
setChatInput(e.target.value);
}}
className="chat-input-textarea" >
</input>
<button className="submit" type="submit" onClick={(e)=> {
setStartedInteraction(true);
}}>Submit</button>
</form>
</div>
</section>
)
}
const ChatMessage = ({ message }) => {
return (
<div className={`chat-message ${message.user === "gpt" && "chatgpt"}`}>
......
client/src/color_theme_1.css
......@@ -172,6 +172,37 @@ span.info {
margin: 15px 5px;
}
.suggested::-webkit-scrollbar {
display: none;
}
ul.suggested-options::-webkit-scrollbar{
/*display: none;*/
}
/* Let's get this party started */
ul.suggested-options::-webkit-scrollbar {
width: 8px;
}
/* Track */
ul.suggested-options::-webkit-scrollbar-track {
-webkit-border-radius: 0px;
border-radius: 0px;
}
/* Handle */
ul.suggested-options::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: #48b0e9;
}
ul.suggested-options::-webkit-scrollbar-thumb:window-inactive {
background: #4291bd;
}
code br:nth-child(-n+2) {
display: none;
}
......
client/src/suggestedOptions.js 0 → 100644
const SuggestedOptions = ({ setChatInput }) => {
const examples = [
"Write an email requesting a 3-day vacation leave to my manager.",
"Compose a song about nationalism and love for the country.",
"Give me 3 easy-to-cook food recipes that I can prepare for a date night at home.",
"Give me 5 of the best dog shampoos and conditioners I can find on Amazon.",
"Write a business pitch for a food truck that serves European-Asian food fusion called EAT Express.",
"Write a Youtube script about how to file taxes as a social media influencer in the US.",
"Write a resume for an architect with 3 years of experience with green technology and sustainability.",
"Give me 7 motivational quotes for start-up businesses to be used in social media posts.",
"Write an article outline about the comparison of DC and Marvel movies.",
"Give me a one-week itinerary for a trip to Hawaii.",
"Write a short children's story about a dolphin that wanted to fly.",
"Explain the difference between a samurai and a ninja.",
"Explain how to create a blue button in html that turns to yellow on mouse hover."
];
const handleExampleClick = (example) => {
setChatInput(example);
};
return (
<div className="suggested">
<div className="suggestedrow title">
<h1>Welcome to AI-PRO</h1>
<p>This chatbot is capable of answering questions and generating text based on the input you provide.</p>
</div>
<div className="suggestedcol rack1">
<h2>Examples</h2>
<ul className="suggested-options">
{examples.map((example, index) => (
<li key={index}
onClick={() => handleExampleClick(example)}>
{example}
</li>
))}
</ul>
</div>
<div className="suggestedcol rack2">
<h2>Capabilities</h2>
<ul>
<li>Remembers the user's earlier statement in the ongoing discussion.</li>
<li>Allows the user to add more information or correct errors.</li>
<li>Trained to deny requests that are not appropriate.</li>
</ul>
</div>
<div className="suggestedcol rack3">
<h2>Limitations</h2>
<ul>
<li>May sometimes give wrong or incorrect information.</li>
<li>May at times produce harmful instructions or biased content.</li>
<li>Limited knowledge of what's been happening in the world since 2021.</li>
</ul>
</div>
</div>
);
};
export default SuggestedOptions;
\ No newline at end of file
index.js
......@@ -34,10 +34,13 @@ app.use(rateLimiter)
app.post('/api', async (req, res) => {
const { message, currentModel, temperature } = req.body;
let query_prompt = `${message}`;
let greetingPrompt = 'Hello, how can I assist you?'
const greetings = ['hi', 'hello', 'hey']
if (greetings.some((greeting) => message.toLowerCase().includes(greeting))) {
greetingPrompt = 'Hello, how can I help you today?'
}
let query_prompt = `${greetingPrompt}\n${message}`;
str_length = req.body.message.split(' ').length;
if (str_length>=800){
arr_body = req.body.message.split("\n");
if (arr_body.length>=4){
......@@ -48,31 +51,28 @@ app.post('/api', async (req, res) => {
query_prompt = arr_body.join("\n")
}
}
try {
try {
const response = await openai.createCompletion({
model: `${currentModel}`,// "text-davinci-003",
prompt: query_prompt,
max_tokens: 3000,
temperature,
});
res.json({
message: response.data.choices[0].text,
})
} catch (e) {
} catch (e) {
let error_msg = e.response.data.error.message ? e.response.data.error.message : '';
if (error_msg.indexOf('maximum context length')>=0){
res.json({
message: "The output for your prompt is too long for us to process. Please reduce your prompt and try again.",
})
}else{
console.log(e.response);
}
} finally {
// console.log('We do cleanup here');
}
}else{
console.log(e.response);
}
} finally {
// console.log('We do cleanup here');
}
});
// Get Models Route
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!