Merge branch 'main' into dano/react-query-typescript

This commit is contained in:
Daniel Avila 2023-04-07 22:11:15 -04:00
commit 285351bb53
13 changed files with 153 additions and 125 deletions

View file

@ -1,5 +1,5 @@
import React from 'react';
import EndpointItem from './EndpointItem';
import EndpointItem from './EndpointItem.jsx';
export default function EndpointItems({ endpoints, onSelect }) {
return (

View file

@ -1,7 +1,7 @@
import React from 'react';
import { DropdownMenuRadioItem } from '../../ui/DropdownMenu.tsx';
import EditIcon from '../../svg/EditIcon';
import TrashIcon from '../../svg/TrashIcon';
import EditIcon from '../../svg/EditIcon.jsx';
import TrashIcon from '../../svg/TrashIcon.jsx';
import getIcon from '~/utils/getIcon';
export default function PresetItem({ preset = {}, value, onSelect, onChangePreset, onDeletePreset }) {
@ -47,7 +47,7 @@ export default function PresetItem({ preset = {}, value, onSelect, onChangePrese
<small className="ml-2">({getPresetTitle()})</small>
<div className="flex w-4 flex-1" />
<button
className="invisible m-0 p-2 mr-1 rounded-md text-gray-400 hover:text-gray-700 group-hover:visible dark:text-gray-400 dark:hover:text-gray-200 "
className="invisible m-0 mr-1 rounded-md p-2 text-gray-400 hover:text-gray-700 group-hover:visible dark:text-gray-400 dark:hover:text-gray-200 "
onClick={e => {
e.preventDefault();
onChangePreset(preset);

View file

@ -1,5 +1,5 @@
import React from 'react';
import PresetItem from './PresetItem';
import PresetItem from './PresetItem.jsx';
export default function PresetItems({ presets, onSelect, onChangePreset, onDeletePreset }) {
return (

View file

@ -1,11 +1,12 @@
import { useState, useEffect } from 'react';
import React, { useState, useEffect } from 'react';
import { useRecoilValue, useRecoilState } from 'recoil';
import EditPresetDialog from '../../Endpoints/EditPresetDialog';
import EndpointItems from './EndpointItems';
import PresetItems from './PresetItems';
import FileUpload from './FileUpload';
import EditPresetDialog from '../../Endpoints/EditPresetDialog.jsx';
import EndpointItems from './EndpointItems.jsx';
import PresetItems from './PresetItems.jsx';
import FileUpload from './FileUpload.jsx';
import getIcon from '~/utils/getIcon';
import { useDeletePresetMutation, useCreatePresetMutation } from '~/data-provider';
import manualSWR, { handleFileSelected } from '~/utils/fetchers';
import { Button } from '../../ui/Button.tsx';
import {
DropdownMenu,
@ -16,34 +17,33 @@ import {
DropdownMenuTrigger
} from '../../ui/DropdownMenu.tsx';
import { Dialog, DialogTrigger } from '../../ui/Dialog.tsx';
import DialogTemplate from '../../ui/DialogTemplate';
import DialogTemplate from '../../ui/DialogTemplate.jsx';
import store from '~/store';
export default function NewConversationMenu() {
// const [modelSave, setModelSave] = useState(false);
const [menuOpen, setMenuOpen] = useState(false);
const [presetModelVisible, setPresetModelVisible] = useState(false);
const [preset, setPreset] = useState(false);
// const models = useRecoilValue(store.models);
const availableEndpoints = useRecoilValue(store.availableEndpoints);
// const setCustomGPTModels = useSetRecoilState(store.customGPTModels);
const [presets, setPresets] = useRecoilState(store.presets);
const conversation = useRecoilValue(store.conversation) || {};
const { endpoint, conversationId } = conversation;
// const { model, promptPrefix, chatGptLabel, conversationId } = conversation;
const { newConversation } = store.useConversation();
const deletePresetsMutation = useDeletePresetMutation();
const createPresetMutation = useCreatePresetMutation();
const { trigger: clearPresetsTrigger } = manualSWR(`/api/presets/delete`, 'post', res => {
console.log(res);
setPresets(res.data);
});
const importPreset = jsonData => {
createPresetMutation.mutate({...jsonData}, {
onSuccess: (data) => {
setPresets(data);
},
onError: (error) => {
console.error('Error uploading the preset:', error);
}
})
handleFileSelected(jsonData).then(setPresets);
};
// update the default model when availableModels changes
@ -65,6 +65,7 @@ export default function NewConversationMenu() {
setMenuOpen(false);
if (!newEndpoint) return;
// else if (newEndpoint === endpoint) return;
else {
newConversation({}, { endpoint: newEndpoint });
}
@ -74,6 +75,7 @@ export default function NewConversationMenu() {
const onSelectPreset = newPreset => {
setMenuOpen(false);
if (!newPreset) return;
// else if (newEndpoint === endpoint) return;
else {
newConversation({}, newPreset);
}
@ -84,12 +86,8 @@ export default function NewConversationMenu() {
setPreset(preset);
};
const clearAllPresets = () => {
deletePresetsMutation.mutate({arg: {}});
};
const onDeletePreset = preset => {
deletePresetsMutation.mutate({arg: preset});
const clearPreset = () => {
clearPresetsTrigger({});
};
const icon = getIcon({
@ -101,7 +99,9 @@ export default function NewConversationMenu() {
});
return (
<Dialog>
<Dialog
// onOpenChange={onOpenChange}
>
<DropdownMenu
open={menuOpen}
onOpenChange={setMenuOpen}
@ -109,9 +109,13 @@ export default function NewConversationMenu() {
<DropdownMenuTrigger asChild>
<Button
variant="outline"
className={`absolute top-[0.25px] mb-0 ml-1 items-center rounded-md border-0 p-1 outline-none focus:ring-0 focus:ring-offset-0 disabled:top-[0.25px] dark:data-[state=open]:bg-opacity-50 md:top-1 md:left-1 md:ml-0 md:pl-1 md:disabled:top-1`}
// style={{backgroundColor: 'rgb(16, 163, 127)'}}
className={`group relative mt-[-8px] mb-[-12px] ml-0 items-center rounded-md border-0 p-1 outline-none focus:ring-0 focus:ring-offset-0 dark:data-[state=open]:bg-opacity-50 md:left-1 md:ml-[-12px] md:pl-1`}
>
{icon}
<span className="max-w-0 overflow-hidden whitespace-nowrap px-0 text-slate-600 transition-all group-hover:max-w-[80px] group-hover:px-2 group-data-[state=open]:max-w-[80px] group-data-[state=open]:px-2 dark:text-slate-300">
New Topic
</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent
@ -146,6 +150,7 @@ export default function NewConversationMenu() {
<Button
type="button"
className="h-auto bg-transparent px-2 py-1 text-xs font-medium font-normal text-red-700 hover:bg-slate-200 hover:text-red-700 dark:bg-transparent dark:text-red-400 dark:hover:bg-gray-800 dark:hover:text-red-400"
// onClick={clearPreset}
>
Clear All
</Button>
@ -154,7 +159,7 @@ export default function NewConversationMenu() {
title="Clear presets"
description="Are you sure you want to clear all presets? This is irreversible."
selection={{
selectHandler: clearAllPresets,
selectHandler: clearPreset,
selectClasses: 'bg-red-600 hover:bg-red-700 dark:hover:bg-red-800 text-white',
selectText: 'Clear'
}}
@ -171,7 +176,7 @@ export default function NewConversationMenu() {
presets={presets}
onSelect={onSelectPreset}
onChangePreset={onChangePreset}
onDeletePreset={onDeletePreset}
onDeletePreset={clearPresetsTrigger}
/>
) : (
<DropdownMenuLabel className="dark:text-gray-300">No preset yet.</DropdownMenuLabel>

View file

@ -5,7 +5,7 @@ import OpenAIOptions from './OpenAIOptions';
import ChatGPTOptions from './ChatGPTOptions';
import BingAIOptions from './BingAIOptions';
// import BingStyles from './BingStyles';
import NewConversationMenu from './Endpoints/NewConversationMenu';
import NewConversationMenu from './NewConversationMenu';
import Footer from './Footer';
import TextareaAutosize from 'react-textarea-autosize';
import { useMessageHandler } from '../../utils/handleSubmit';
@ -139,7 +139,7 @@ export default function TextChat({ isSearchView = false }) {
<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">
<div className="relative flex h-full flex-1 md:flex-col">
<div
className={`relative flex flex-grow flex-col rounded-md border border-black/10 ${
className={`relative flex flex-grow flex-row rounded-md border border-black/10 ${
disabled ? 'bg-gray-100' : 'bg-white'
} py-2 shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:border-gray-900/50 ${
disabled ? 'dark:bg-gray-900' : 'dark:bg-gray-700'
@ -160,7 +160,7 @@ export default function TextChat({ isSearchView = false }) {
onCompositionEnd={handleCompositionEnd}
placeholder={getPlaceholderText()}
disabled={disabled || isNotAppendable}
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 placeholder:text-gray-600 focus:outline-none focus:ring-0 focus-visible:ring-0 dark:bg-transparent dark:placeholder:text-gray-500 md:pl-8"
className="m-0 flex h-auto max-h-52 flex-1 resize-none overflow-auto border-0 bg-transparent p-0 pl-2 pr-12 leading-6 placeholder:text-sm placeholder:text-gray-600 focus:outline-none focus:ring-0 focus-visible:ring-0 dark:bg-transparent dark:placeholder:text-gray-500 md:pl-2"
/>
<SubmitButton
submitMessage={submitMessage}