render api templates if exitst
This commit is contained in:
115
src/chatbox.tsx
115
src/chatbox.tsx
@@ -316,63 +316,64 @@ export default function ChatBOX(props: {
|
|||||||
请先在上方设置 API Endpoint
|
请先在上方设置 API Endpoint
|
||||||
</p>
|
</p>
|
||||||
)}
|
)}
|
||||||
{(chatStore.history.filter((msg) => !msg.example).length == 0 ||
|
{templateAPIs.length > 0 &&
|
||||||
!chatStore.apiEndpoint ||
|
(chatStore.history.filter((msg) => !msg.example).length == 0 ||
|
||||||
!chatStore.apiKey) && (
|
!chatStore.apiEndpoint ||
|
||||||
<p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">
|
!chatStore.apiKey) && (
|
||||||
<h2>已保存的 API 模板</h2>
|
<p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">
|
||||||
<hr className="my-2" />
|
<h2>已保存的 API 模板</h2>
|
||||||
<div className="flex flex-wrap">
|
<hr className="my-2" />
|
||||||
{templateAPIs.map((t, index) => (
|
<div className="flex flex-wrap">
|
||||||
<div
|
{templateAPIs.map((t, index) => (
|
||||||
className={`cursor-pointer rounded ${
|
<div
|
||||||
chatStore.apiEndpoint === t.endpoint &&
|
className={`cursor-pointer rounded ${
|
||||||
chatStore.apiKey === t.key
|
chatStore.apiEndpoint === t.endpoint &&
|
||||||
? "bg-red-600"
|
chatStore.apiKey === t.key
|
||||||
: "bg-red-400"
|
? "bg-red-600"
|
||||||
} w-fit p-2 m-1 flex flex-col`}
|
: "bg-red-400"
|
||||||
onClick={() => {
|
} w-fit p-2 m-1 flex flex-col`}
|
||||||
chatStore.apiEndpoint = t.endpoint;
|
onClick={() => {
|
||||||
chatStore.apiKey = t.key;
|
chatStore.apiEndpoint = t.endpoint;
|
||||||
setChatStore({ ...chatStore });
|
chatStore.apiKey = t.key;
|
||||||
}}
|
setChatStore({ ...chatStore });
|
||||||
>
|
}}
|
||||||
<span className="w-full text-center">{t.name}</span>
|
>
|
||||||
<hr className="mt-2" />
|
<span className="w-full text-center">{t.name}</span>
|
||||||
<span className="flex justify-between">
|
<hr className="mt-2" />
|
||||||
<button
|
<span className="flex justify-between">
|
||||||
onClick={() => {
|
<button
|
||||||
const name = prompt("Give **API** template a name");
|
onClick={() => {
|
||||||
if (!name) {
|
const name = prompt("Give **API** template a name");
|
||||||
return;
|
if (!name) {
|
||||||
}
|
return;
|
||||||
t.name = name;
|
}
|
||||||
setTemplateAPIs(structuredClone(templateAPIs));
|
t.name = name;
|
||||||
}}
|
setTemplateAPIs(structuredClone(templateAPIs));
|
||||||
>
|
}}
|
||||||
🖋
|
>
|
||||||
</button>
|
🖋
|
||||||
<button
|
</button>
|
||||||
onClick={() => {
|
<button
|
||||||
if (
|
onClick={() => {
|
||||||
!confirm(
|
if (
|
||||||
"Are you sure to delete this **API** template?"
|
!confirm(
|
||||||
)
|
"Are you sure to delete this **API** template?"
|
||||||
) {
|
)
|
||||||
return;
|
) {
|
||||||
}
|
return;
|
||||||
templateAPIs.splice(index, 1);
|
}
|
||||||
setTemplateAPIs(structuredClone(templateAPIs));
|
templateAPIs.splice(index, 1);
|
||||||
}}
|
setTemplateAPIs(structuredClone(templateAPIs));
|
||||||
>
|
}}
|
||||||
❌
|
>
|
||||||
</button>
|
❌
|
||||||
</span>
|
</button>
|
||||||
</div>
|
</span>
|
||||||
))}
|
</div>
|
||||||
</div>
|
))}
|
||||||
</p>
|
</div>
|
||||||
)}
|
</p>
|
||||||
|
)}
|
||||||
{templates.length > 0 &&
|
{templates.length > 0 &&
|
||||||
chatStore.history.filter((msg) => !msg.example).length == 0 && (
|
chatStore.history.filter((msg) => !msg.example).length == 0 && (
|
||||||
<p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">
|
<p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">
|
||||||
|
|||||||
Reference in New Issue
Block a user