7x31/ChatGPT-Next-Web
1
0
Fork 0
mirror of https://github.com/Yidadaa/ChatGPT-Next-Web.git synced 2025-08-08 23:20:28 +08:00
Code Issues Packages Projects Releases Wiki Activity

plugin add auth config

Browse Source
This commit is contained in:
lloydzhou
2024-09-02 18:11:19 +08:00
parent b2965e1deb
commit f652f73260
8 changed files with 237 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

133
app/components/plugin.tsx
View File

@@ -14,10 +14,12 @@ import CloseIcon from "../icons/close.svg";
import DeleteIcon from "../icons/delete.svg";
import EyeIcon from "../icons/eye.svg";
import CopyIcon from "../icons/copy.svg";
import ConfirmIcon from "../icons/confirm.svg";
import { Plugin, usePluginStore, FunctionToolService } from "../store/plugin";
import {
Input,
PasswordInput,
List,
ListItem,
Modal,
@@ -191,55 +193,102 @@ export function PluginPage() {
onClose={closePluginModal}
actions={[
<IconButton
icon={<DownloadIcon />}
text={Locale.Plugin.EditModal.Download}
icon={<ConfirmIcon />}
text={Locale.UI.Confirm}
key="export"
bordered
onClick={() =>
downloadAs(
JSON.stringify(editingPlugin),
`${editingPlugin.title}@${editingPlugin.version}.json`,
)
}
onClick={() => setEditingPluginId("")}
/>,
]}
>
<div className={styles["mask-page"]}>
<div className={pluginStyles["plugin-title"]}>
{Locale.Plugin.EditModal.Content}
</div>
<div
className={`markdown-body ${pluginStyles["plugin-content"]}`}
dir="auto"
<List>
<ListItem title={Locale.Plugin.EditModal.Auth}>
<select
value={editingPlugin?.authType}
onChange={(e) => {
pluginStore.updatePlugin(editingPlugin.id, (plugin) => {
plugin.authType = e.target.value;
});
}}
>
<option value="">{Locale.Plugin.Auth.None}</option>
<option value="bearer">{Locale.Plugin.Auth.Bearer}</option>
<option value="basic">{Locale.Plugin.Auth.Basic}</option>
<option value="custom">{Locale.Plugin.Auth.Custom}</option>
</select>
</ListItem>
{editingPlugin.authType == "custom" && (
<ListItem title={Locale.Plugin.Auth.CustomHeader}>
<input
type="text"
value={editingPlugin?.authHeader}
onChange={(e) => {
pluginStore.updatePlugin(editingPlugin.id, (plugin) => {
plugin.authHeader = e.target.value;
});
}}
></input>
</ListItem>
)}
{["bearer", "basic", "custom"].includes(
editingPlugin.authType as string,
) && (
<ListItem title={Locale.Plugin.Auth.Token}>
<PasswordInput
type="text"
value={editingPlugin?.authToken}
onChange={(e) => {
pluginStore.updatePlugin(editingPlugin.id, (plugin) => {
plugin.authToken = e.currentTarget.value;
});
}}
></PasswordInput>
</ListItem>
)}
<ListItem
title={Locale.Plugin.Auth.Proxy}
subTitle={Locale.Plugin.Auth.ProxyDescription}
>
<pre>
<code
contentEditable={true}
dangerouslySetInnerHTML={{ __html: editingPlugin.content }}
onBlur={onChangePlugin}
></code>
</pre>
</div>
<div className={pluginStyles["plugin-title"]}>
{Locale.Plugin.EditModal.Method}
</div>
<div className={styles["mask-page-body"]} style={{ padding: 0 }}>
{editingPluginTool?.tools.map((tool, index) => (
<div className={styles["mask-item"]} key={index}>
<div className={styles["mask-header"]}>
<div className={styles["mask-title"]}>
<div className={styles["mask-name"]}>
{tool?.function?.name}
</div>
<div className={styles["mask-info"] + " one-line"}>
{tool?.function?.description}
</div>
</div>
</div>
<input
type="checkbox"
checked={editingPlugin?.usingProxy}
style={{ minWidth: 16 }}
onChange={(e) => {
pluginStore.updatePlugin(editingPlugin.id, (plugin) => {
plugin.usingProxy = e.currentTarget.checked;
});
}}
></input>
</ListItem>
</List>
<List>
<ListItem
title={Locale.Plugin.EditModal.Content}
subTitle={
<div
className={`markdown-body ${pluginStyles["plugin-content"]}`}
dir="auto"
>
<pre>
<code
contentEditable={true}
dangerouslySetInnerHTML={{
__html: editingPlugin.content,
}}
onBlur={onChangePlugin}
></code>
</pre>
</div>
))}
</div>
</div>
}
></ListItem>
{editingPluginTool?.tools.map((tool, index) => (
<ListItem
key={index}
title={tool?.function?.name}
subTitle={tool?.function?.description}
/>
))}
</List>
</Modal>
</div>
)}

2
app/components/ui-lib.tsx
View File

@@ -51,7 +51,7 @@ export function Card(props: { children: JSX.Element[]; className?: string }) {
export function ListItem(props: {
title: string;
subTitle?: string;
subTitle?: string | JSX.Element;
children?: JSX.Element | JSX.Element[];
icon?: JSX.Element;
className?: string;