From f3953693fdc175c664b1521f4fe1bf8b2647c08f Mon Sep 17 00:00:00 2001 From: heimoshuiyu Date: Sat, 11 Nov 2023 13:16:55 +0800 Subject: [PATCH] save whisper / tts / image gen api --- src/addImage.tsx | 2 +- src/app.tsx | 3 + src/chatbox.tsx | 158 ++++++++++++++++++++++++++-------------- src/chatgpt.ts | 5 +- src/listAPIs.tsx | 81 ++++++++++++++++++++ src/setAPIsTemplate.tsx | 39 ++++++++++ src/settings.tsx | 69 +++++++++++++----- 7 files changed, 280 insertions(+), 77 deletions(-) create mode 100644 src/listAPIs.tsx create mode 100644 src/setAPIsTemplate.tsx diff --git a/src/addImage.tsx b/src/addImage.tsx index ca17057..8ad8a31 100644 --- a/src/addImage.tsx +++ b/src/addImage.tsx @@ -24,7 +24,7 @@ export function AddImage({ }: Props) { const [enableHighResolution, setEnableHighResolution] = useState(true); const [imageGenPrompt, setImageGenPrompt] = useState(""); - const [imageGenModel, setImageGenModel] = useState("dall-e-2"); + const [imageGenModel, setImageGenModel] = useState("dall-e-3"); const [imageGenN, setImageGenN] = useState(1); const [imageGenQuality, setImageGEnQuality] = useState("standard"); const [imageGenResponseFormat, setImageGenResponseFormat] = diff --git a/src/app.tsx b/src/app.tsx index 34e385f..b00c96d 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -118,6 +118,9 @@ const STORAGE_NAME_INDEXES = `${STORAGE_NAME}-indexes`; const STORAGE_NAME_TOTALCOST = `${STORAGE_NAME}-totalcost`; export const STORAGE_NAME_TEMPLATE = `${STORAGE_NAME}-template`; export const STORAGE_NAME_TEMPLATE_API = `${STORAGE_NAME_TEMPLATE}-api`; +export const STORAGE_NAME_TEMPLATE_API_WHISPER = `${STORAGE_NAME_TEMPLATE}-api-whisper`; +export const STORAGE_NAME_TEMPLATE_API_TTS = `${STORAGE_NAME_TEMPLATE}-api-tts`; +export const STORAGE_NAME_TEMPLATE_API_IMAGE_GEN = `${STORAGE_NAME_TEMPLATE}-api-image-gen`; export function addTotalCost(cost: number) { let totalCost = getTotalCost(); diff --git a/src/chatbox.tsx b/src/chatbox.tsx index 20cceef..3708c0d 100644 --- a/src/chatbox.tsx +++ b/src/chatbox.tsx @@ -7,6 +7,9 @@ import { ChatStoreMessage, STORAGE_NAME_TEMPLATE, STORAGE_NAME_TEMPLATE_API, + STORAGE_NAME_TEMPLATE_API_IMAGE_GEN, + STORAGE_NAME_TEMPLATE_API_TTS, + STORAGE_NAME_TEMPLATE_API_WHISPER, TemplateAPI, addTotalCost, } from "./app"; @@ -23,6 +26,7 @@ import models from "./models"; import Settings from "./settings"; import getDefaultParams from "./getDefaultParam"; import { AddImage } from "./addImage"; +import { ListAPIs } from "./listAPIs"; export interface TemplateChatStore extends ChatStore { name: string; @@ -319,6 +323,21 @@ export default function ChatBOX(props: { localStorage.getItem(STORAGE_NAME_TEMPLATE_API) || "[]" ) as TemplateAPI[] ); + const [templateAPIsWhisper, _setTemplateAPIsWhisper] = useState( + JSON.parse( + localStorage.getItem(STORAGE_NAME_TEMPLATE_API_WHISPER) || "[]" + ) as TemplateAPI[] + ); + const [templateAPIsTTS, _setTemplateAPIsTTS] = useState( + JSON.parse( + localStorage.getItem(STORAGE_NAME_TEMPLATE_API_TTS) || "[]" + ) as TemplateAPI[] + ); + const [templateAPIsImageGen, _setTemplateAPIsImageGen] = useState( + JSON.parse( + localStorage.getItem(STORAGE_NAME_TEMPLATE_API_IMAGE_GEN) || "[]" + ) as TemplateAPI[] + ); const setTemplates = (templates: TemplateChatStore[]) => { localStorage.setItem(STORAGE_NAME_TEMPLATE, JSON.stringify(templates)); _setTemplates(templates); @@ -330,6 +349,27 @@ export default function ChatBOX(props: { ); _setTemplateAPIs(templateAPIs); }; + const setTemplateAPIsWhisper = (templateAPIWhisper: TemplateAPI[]) => { + localStorage.setItem( + STORAGE_NAME_TEMPLATE_API_WHISPER, + JSON.stringify(templateAPIWhisper) + ); + _setTemplateAPIsWhisper(templateAPIWhisper); + }; + const setTemplateAPIsTTS = (templateAPITTS: TemplateAPI[]) => { + localStorage.setItem( + STORAGE_NAME_TEMPLATE_API_TTS, + JSON.stringify(templateAPITTS) + ); + _setTemplateAPIsTTS(templateAPITTS); + }; + const setTemplateAPIsImageGen = (templateAPIImageGen: TemplateAPI[]) => { + localStorage.setItem( + STORAGE_NAME_TEMPLATE_API_IMAGE_GEN, + JSON.stringify(templateAPIImageGen) + ); + _setTemplateAPIsImageGen(templateAPIImageGen); + }; return (
@@ -343,6 +383,12 @@ export default function ChatBOX(props: { setTemplates={setTemplates} templateAPIs={templateAPIs} setTemplateAPIs={setTemplateAPIs} + templateAPIsWhisper={templateAPIsWhisper} + setTemplateAPIsWhisper={setTemplateAPIsWhisper} + templateAPIsTTS={templateAPIsTTS} + setTemplateAPIsTTS={setTemplateAPIsTTS} + templateAPIsImageGen={templateAPIsImageGen} + setTemplateAPIsImageGen={setTemplateAPIsImageGen} /> )}
!msg.example).length == 0 || !chatStore.apiEndpoint || !chatStore.apiKey) && ( -
-

{Tr("Saved API templates")}

-
-
- {templateAPIs.map((t, index) => ( -
{ - chatStore.apiEndpoint = t.endpoint; - chatStore.apiKey = t.key; - setChatStore({ ...chatStore }); - }} - > - {t.name} -
- - - - -
- ))} -
-
+ )} + + {templateAPIsWhisper.length > 0 && + (chatStore.develop_mode || + chatStore.history.filter((msg) => !msg.example).length == 0 || + !chatStore.whisper_api || + !chatStore.whisper_key) && ( + + )} + + {templateAPIsTTS.length > 0 && + (chatStore.develop_mode || + chatStore.history.filter((msg) => !msg.example).length == 0 || + !chatStore.tts_api || + !chatStore.tts_key) && ( + + )} + + {templateAPIsImageGen.length > 0 && + (chatStore.develop_mode || + chatStore.history.filter((msg) => !msg.example).length == 0 || + !chatStore.image_gen_api || + !chatStore.image_gen_key) && ( + + )} + {chatStore.history.filter((msg) => !msg.example).length == 0 && (

@@ -722,6 +773,7 @@ export default function ChatBOX(props: { {Tr("Send")} {chatStore.whisper_api && + chatStore.whisper_key && (chatStore.whisper_key || chatStore.apiKey) && ( + + +

+ ))} +
+
+ ); +} diff --git a/src/setAPIsTemplate.tsx b/src/setAPIsTemplate.tsx new file mode 100644 index 0000000..98254af --- /dev/null +++ b/src/setAPIsTemplate.tsx @@ -0,0 +1,39 @@ +import { TemplateAPI } from "./app"; +import { Tr } from "./translate"; + +interface Props { + tmps: TemplateAPI[]; + setTmps: (tmps: TemplateAPI[]) => void; + label: string; + endpoint: string; + APIkey: string; +} +export function SetAPIsTemplate({ + endpoint, + APIkey, + tmps, + setTmps, + label, +}: Props) { + return ( + + ); +} diff --git a/src/settings.tsx b/src/settings.tsx index 01d74fa..c461157 100644 --- a/src/settings.tsx +++ b/src/settings.tsx @@ -6,6 +6,7 @@ import { TemplateChatStore } from "./chatbox"; import { tr, Tr, langCodeContext, LANG_OPTIONS } from "./translate"; import p from "preact-markdown"; import { isVailedJSON } from "./message"; +import { SetAPIsTemplate } from "./setAPIsTemplate"; const TTS_VOICES: string[] = [ "alloy", @@ -267,6 +268,12 @@ export default (props: { setTemplates: (templates: TemplateChatStore[]) => void; templateAPIs: TemplateAPI[]; setTemplateAPIs: (templateAPIs: TemplateAPI[]) => void; + templateAPIsWhisper: TemplateAPI[]; + setTemplateAPIsWhisper: (templateAPIs: TemplateAPI[]) => void; + templateAPIsTTS: TemplateAPI[]; + setTemplateAPIsTTS: (templateAPIs: TemplateAPI[]) => void; + templateAPIsImageGen: TemplateAPI[]; + setTemplateAPIsImageGen: (templateAPIs: TemplateAPI[]) => void; }) => { let link = location.protocol + @@ -519,6 +526,43 @@ export default (props: { {Tr("Reset")} + +
+ + {props.chatStore.whisper_api && props.chatStore.whisper_key && ( + + )} + {props.chatStore.tts_api && props.chatStore.tts_key && ( + + )} + {props.chatStore.image_gen_api && props.chatStore.image_gen_key && ( + + )} +

-