Skip to content

Commit 1308ef1

Browse files
danny-aviladanny-avila
authored
Merge pull request #88 from wtlyu/feat-clean-after-regenerate-pr
Feat clean after regenerate pr
2 parents e11ce14 + 1513c27 commit 1308ef1

File tree

9 files changed

+77
-39
lines changed

9 files changed

+77
-39
lines changed

‎api/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@
2424
"@waylaidwanderer/chatgpt-api": "^1.28.2",
2525
"axios": "^1.3.4",
2626
"cors": "^2.8.5",
27+
"crypto": "^1.0.1",
2728
"dotenv": "^16.0.3",
2829
"express": "^4.18.2",
2930
"express-session": "^1.17.3",

‎client/src/components/Main/Footer.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22

33
export default function Footer() {
44
return (
5-
<div className="px-3 pt-2 pb-3 text-center text-xs text-black/50 dark:text-white/50 md:px-4 md:pt-3 md:pb-6">
5+
<div className="hidden md:block px-3 pt-2 pb-1 text-center text-xs text-black/50 dark:text-white/50 md:px-4 md:pt-3 md:pb-4">
66
<a
77
href="https://github.com/danny-avila/chatgpt-clone"
88
target="_blank"

‎client/src/components/Main/Landing.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export default function Landing({ title }) {
2626
};
2727

2828
return (
29-
<div className="flex h-full flex-col items-center overflow-y-auto text-sm dark:bg-gray-800">
29+
<div className="flex pt-10 md:pt-0 h-full flex-col items-center overflow-y-auto text-sm dark:bg-gray-800">
3030
<div className="w-full px-6 text-gray-800 dark:text-gray-100 md:flex md:max-w-2xl md:flex-col lg:max-w-3xl">
3131
<h1 className="mt-6 ml-auto mr-auto mb-10 flex items-center justify-center gap-2 text-center text-4xl font-semibold md:mt-[20vh] sm:mb-16">
3232
ChatGPT Clone

‎client/src/components/Main/TextChat.jsx

Lines changed: 59 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -35,15 +35,14 @@ export default function TextChat({ messages }) {
3535
const { error, latestMessage } = convo;
3636
const { ask, regenerate, stopGenerating } = useMessageHandler();
3737

38-
const isNotAppendable = (!isSubmitting && latestMessage?.submitting) || latestMessage?.error;
38+
const isNotAppendable = latestMessage?.cancelled || latestMessage?.error;
3939

4040
// auto focus to input, when enter a conversation.
4141
useEffect(() => {
4242
inputRef.current?.focus();
4343
}, [convo?.conversationId]);
4444

4545
const messageHandler = (data, currentState, currentMsg) => {
46-
4746
const { messages, _currentMsg, message, sender, isRegenerate } = currentState;
4847

4948
if (isRegenerate)
@@ -75,6 +74,38 @@ export default function TextChat({ messages }) {
7574
);
7675
};
7776

77+
const cancelHandler = (data, currentState, currentMsg) => {
78+
const { messages, _currentMsg, message, sender, isRegenerate } = currentState;
79+
80+
if (isRegenerate)
81+
dispatch(
82+
setMessages([
83+
...messages,
84+
{
85+
sender,
86+
text: data,
87+
parentMessageId: message?.overrideParentMessageId,
88+
messageId: message?.overrideParentMessageId + '_',
89+
cancelled: true
90+
}
91+
])
92+
);
93+
else
94+
dispatch(
95+
setMessages([
96+
...messages,
97+
currentMsg,
98+
{
99+
sender,
100+
text: data,
101+
parentMessageId: currentMsg?.messageId,
102+
messageId: currentMsg?.messageId + '_',
103+
cancelled: true
104+
}
105+
])
106+
);
107+
};
108+
78109
const createdHandler = (data, currentState, currentMsg) => {
79110
const { conversationId } = currentMsg;
80111
dispatch(
@@ -93,9 +124,11 @@ export default function TextChat({ messages }) {
93124
const { model, chatGptLabel, promptPrefix } = message;
94125
if (isRegenerate) dispatch(setMessages([...messages, responseMessage]));
95126
else dispatch(setMessages([...messages, requestMessage, responseMessage]));
127+
dispatch(setSubmitState(false));
96128

97129
const isBing = model === 'bingai' || model === 'sydney';
98130

131+
// refresh title
99132
if (requestMessage.parentMessageId == '00000000-0000-0000-0000-000000000000') {
100133
setTimeout(() => {
101134
dispatch(refreshConversation());
@@ -163,8 +196,6 @@ export default function TextChat({ messages }) {
163196
})
164197
);
165198
}
166-
167-
dispatch(setSubmitState(false));
168199
};
169200

170201
const errorHandler = (data, currentState, currentMsg) => {
@@ -193,7 +224,9 @@ export default function TextChat({ messages }) {
193224
}
194225

195226
const currentState = submission;
227+
196228
let currentMsg = { ...currentState.message };
229+
let latestResponseText = '';
197230

198231
const { server, payload } = createPayload(submission);
199232
const onMessage = (e) => {
@@ -216,6 +249,7 @@ export default function TextChat({ messages }) {
216249
console.log(data);
217250
}
218251
if (data.message) {
252+
latestResponseText = text;
219253
messageHandler(text, currentState, currentMsg);
220254
}
221255
// console.log('dataStream', data);
@@ -233,6 +267,10 @@ export default function TextChat({ messages }) {
233267

234268
events.onmessage = onMessage;
235269

270+
events.oncancel = (e) => {
271+
cancelHandler(latestResponseText, currentState, currentMsg);
272+
};
273+
236274
events.onerror = function (e) {
237275
console.log('error in opening conn.');
238276
events.close();
@@ -245,9 +283,13 @@ export default function TextChat({ messages }) {
245283
events.stream();
246284

247285
return () => {
248-
dispatch(setSubmitState(false));
249286
events.removeEventListener('message', onMessage);
287+
const isCancelled = events.readyState <= 1;
250288
events.close();
289+
if (isCancelled) {
290+
const e = new Event('cancel');
291+
events.dispatchEvent(e);
292+
}
251293
};
252294
}, [submission]);
253295

@@ -290,9 +332,9 @@ export default function TextChat({ messages }) {
290332
const changeHandler = (e) => {
291333
const { value } = e.target;
292334

293-
if (isSubmitting && (value === '' || value === '\n')) {
294-
return;
295-
}
335+
// if (isSubmitting && (value === '' || value === '\n')) {
336+
// return;
337+
// }
296338
dispatch(setText(value));
297339
};
298340

@@ -301,20 +343,8 @@ export default function TextChat({ messages }) {
301343
dispatch(setError(false));
302344
};
303345

304-
const placeholder = () => {
305-
if (disabled && isSubmitting) {
306-
return 'Choose another model or customize GPT again';
307-
} else if (!isSubmitting && latestMessage?.submitting) {
308-
return 'Message in progress...';
309-
// } else if (latestMessage?.error) {
310-
// return 'Error...';
311-
} else {
312-
return '';
313-
}
314-
};
315-
316346
return (
317-
<div className="input-panel md:bg-vert-light-gradient dark:md:bg-vert-dark-gradient absolute bottom-0 left-0 w-full border-t bg-white pt-2 dark:border-white/20 dark:bg-gray-800 md:border-t-0 md:border-transparent md:bg-transparent md:dark:border-transparent">
347+
<div className="input-panel md:bg-vert-light-gradient dark:md:bg-vert-dark-gradient fixed bottom-0 left-0 w-full border-t bg-white py-2 dark:border-white/20 dark:bg-gray-800 md:absolute md:border-t-0 md:border-transparent md:bg-transparent md:dark:border-transparent md:dark:bg-transparent">
318348
<form className="stretch mx-2 flex flex-row gap-3 last:mb-2 md:pt-2 md:last:mb-6 lg:mx-auto lg:max-w-3xl lg:pt-6">
319349
<div className="relative flex h-full flex-1 md:flex-col">
320350
<span className="order-last ml-1 flex justify-center gap-0 md:order-none md:m-auto md:mb-2 md:w-full md:gap-2">
@@ -352,13 +382,19 @@ export default function TextChat({ messages }) {
352382
ref={inputRef}
353383
// style={{maxHeight: '200px', height: '24px', overflowY: 'hidden'}}
354384
rows="1"
355-
value={text}
385+
value={disabled || isNotAppendable ? '' : text}
356386
onKeyUp={handleKeyUp}
357387
onKeyDown={handleKeyDown}
358388
onChange={changeHandler}
359389
onCompositionStart={handleCompositionStart}
360390
onCompositionEnd={handleCompositionEnd}
361-
placeholder={placeholder()}
391+
placeholder={
392+
disabled
393+
? 'Choose another model or customize GPT again'
394+
: isNotAppendable
395+
? 'Edit your message or Regenerate.'
396+
: ''
397+
}
362398
disabled={disabled || isNotAppendable}
363399
className="m-0 h-auto max-h-52 resize-none overflow-auto border-0 bg-transparent p-0 pl-12 pr-8 leading-6 placeholder:text-sm focus:outline-none focus:ring-0 focus-visible:ring-0 dark:bg-transparent md:pl-8"
364400
/>

‎client/src/components/Messages/index.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export default function Messages({ messages, messageTree }) {
6363

6464
return (
6565
<div
66-
className="flex-1 overflow-y-auto "
66+
className="flex-1 overflow-y-auto pt-10 md:pt-0"
6767
ref={scrollableRef}
6868
onScroll={debouncedHandleScroll}
6969
>

‎client/src/components/Models/ModelMenu.jsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,8 @@ export default function ModelMenu() {
3838
const { data, isLoading, mutate } = swr(`/api/customGpts`, (res) => {
3939
const fetchedModels = res.map((modelItem) => ({
4040
...modelItem,
41-
name: modelItem.chatGptLabel
41+
name: modelItem.chatGptLabel,
42+
model: 'chatgptCustom'
4243
}));
4344

4445
dispatch(setModels(fetchedModels));
@@ -100,7 +101,7 @@ export default function ModelMenu() {
100101
localStorage.setItem('model', JSON.stringify(model));
101102
}, [model]);
102103

103-
const filteredModels = models.filter(({model, _id }) => initial[model] || _id.length > 1 );
104+
const filteredModels = models.filter(({model, _id }) => initial[model] );
104105

105106
const onChange = (value) => {
106107
if (!value) {

‎client/src/components/Nav/MobileNav.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export default function MobileNav({ setNavVisible }) {
2323
}
2424

2525
return (
26-
<div className="sticky top-0 z-10 flex items-center border-b border-white/20 bg-gray-800 pl-1 pt-1 text-gray-200 sm:pl-3 md:hidden">
26+
<div className="fixed top-0 left-0 right-0 z-10 flex items-center border-b border-white/20 bg-gray-800 pl-1 pt-1 text-gray-200 sm:pl-3 md:hidden">
2727
<button
2828
type="button"
2929
className="-ml-0.5 -mt-0.5 inline-flex h-10 w-10 items-center justify-center rounded-md hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white dark:hover:text-white"

‎client/src/utils/handleSubmit.js

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { setNewConvo } from '~/store/convoSlice';
55
import { setMessages } from '~/store/messageSlice';
66
import { setSubmitState, setSubmission } from '~/store/submitSlice';
77
import { setText } from '~/store/textSlice';
8+
import { setError } from '~/store/convoSlice';
89

910
const useMessageHandler = () => {
1011
const dispatch = useDispatch();
@@ -40,14 +41,6 @@ const useMessageHandler = () => {
4041
const currentMsg = { sender: 'User', text, current: true, isCreatedByUser: true, parentMessageId, conversationId, messageId: fakeMessageId };
4142
const initialResponse = { sender, text: '', parentMessageId: isRegenerate?messageId:fakeMessageId, messageId: (isRegenerate?messageId:fakeMessageId) + '_', submitting: true };
4243

43-
dispatch(setSubmitState(true));
44-
if (isRegenerate) {
45-
dispatch(setMessages([...currentMessages, initialResponse]));
46-
} else {
47-
dispatch(setMessages([...currentMessages, currentMsg, initialResponse]));
48-
}
49-
dispatch(setText(''));
50-
5144
const submission = {
5245
convo,
5346
isCustomModel,
@@ -63,7 +56,16 @@ const useMessageHandler = () => {
6356
initialResponse,
6457
sender,
6558
};
59+
6660
console.log('User Input:', text);
61+
62+
if (isRegenerate) {
63+
dispatch(setMessages([...currentMessages, initialResponse]));
64+
} else {
65+
dispatch(setMessages([...currentMessages, currentMsg, initialResponse]));
66+
dispatch(setText(''));
67+
}
68+
dispatch(setSubmitState(true));
6769
dispatch(setSubmission(submission));
6870
}
6971

‎client/src/utils/index.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,6 @@ export const getIconOfModel = ({ size=30, sender, isCreatedByUser, model, chatGp
5656
chatgptCustom: `rgb(0, 163, 255${ button ? ', 0.75' : ''})`,
5757
};
5858

59-
// console.log(sender, isCreatedByUser, model, chatGptLabel, error, )
60-
6159
if (isCreatedByUser)
6260
return (
6361
<div

0 commit comments

Comments
 (0)