Skip to content

Commit

Permalink
Song/feat/ai plugin (#1714)
Browse files Browse the repository at this point in the history 
* feat: yak ai 插件输出回答展示ai类型、模型名称&新增ComateAi类型

* del
  • Loading branch information
@song-xiao-lin
song-xiao-lin authored Jun 7, 2024
1 parent 94a693a commit d2c3755
Show file tree
Hide file tree
Showing 4 changed files with 129 additions and 112 deletions.
165 changes: 78 additions & 87 deletions app/renderer/src/main/src/components/configNetwork/ConfigNetworkPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ import {KVPair} from "@/models/kv"
import {getLocalValue, getRemoteValue, setLocalValue, setRemoteValue} from "@/utils/kv"
import {LocalGVS} from "@/enums/localGlobal"
import {RemoteGV} from "@/yakitGV"
import { DragDropContext, Draggable, DropResult, Droppable } from "@hello-pangea/dnd"
import {DragDropContext, Draggable, DropResult, Droppable} from "@hello-pangea/dnd"

export interface ConfigNetworkPageProp {}

Expand Down Expand Up @@ -137,11 +137,11 @@ export const defaultParams: GlobalNetworkConfig = {
EnableSystemProxyFromEnv: false,
SkipSaveHTTPFlow: false,
AppConfigs: [],
AiApiPriority:[],
AiApiPriority: [],
AuthInfos: [],
SynScanNetInterface: "",
ExcludePluginScanURIs: [],
IncludePluginScanURIs: [],
IncludePluginScanURIs: []
}

export const ConfigNetworkPage: React.FC<ConfigNetworkPageProp> = (props) => {
Expand Down Expand Up @@ -614,7 +614,7 @@ export const ConfigNetworkPage: React.FC<ConfigNetworkPageProp> = (props) => {
}
)
})
setTimeout(()=>submit(),100)
setTimeout(() => submit(), 100)
m.destroy()
}}
onCancel={() => m.destroy()}
Expand Down Expand Up @@ -664,7 +664,7 @@ export const ConfigNetworkPage: React.FC<ConfigNetworkPageProp> = (props) => {
existedResult.push(e)
}
setParams({...params, AppConfigs: existedResult})
setTimeout(()=>submit(),100)
setTimeout(() => submit(), 100)
m.destroy()
}}
onCancel={() => m.destroy()}
Expand All @@ -678,12 +678,14 @@ export const ConfigNetworkPage: React.FC<ConfigNetworkPageProp> = (props) => {
</YakitButton>
</Form.Item>
<Form.Item label={"AI使用优先级"}>
<div className={styles['ai-sort-box']}>
<AISortContent AiApiPriority={params.AiApiPriority} onUpdate={(AiApiPriority)=>{
setParams({...params, AiApiPriority})
}}/>
<div className={styles["ai-sort-box"]}>
<AISortContent
AiApiPriority={params.AiApiPriority}
onUpdate={(AiApiPriority) => {
setParams({...params, AiApiPriority})
}}
/>
</div>

</Form.Item>
<Divider orientation={"left"} style={{marginTop: "0px"}}>
其他配置
Expand Down Expand Up @@ -1276,7 +1278,7 @@ interface SortDataProps {
value: string
}
interface AISortContentProps {
onUpdate:(v:string[])=>void
onUpdate: (v: string[]) => void
AiApiPriority: string[]
}

Expand All @@ -1289,11 +1291,8 @@ const getItemStyle = (isDragging, draggableStyle) => {
if (match) {
// 提取匹配到的两个值，并将它们转换为数字
const [value1, value2] = match.slice(1).map(Number)
const modifiedString = transform.replace(
/translate\((-?\d+)px, (-?\d+)px\)/,
`translate(0px, ${value2}px)`
)
transform = modifiedString
const modifiedString = transform.replace(/translate\((-?\d+)px, (-?\d+)px\)/, `translate(0px, ${value2}px)`)
transform = modifiedString
}
}

Expand All @@ -1303,95 +1302,87 @@ const getItemStyle = (isDragging, draggableStyle) => {
}
}

const defaultAiApiPriority:SortDataProps[] = [{label: "OpenAI", value: "openai"},
{label: "Chatglm", value: "chatglm"},
{label: "Moonshot", value: "moonshot"}]
const defaultAiApiPriority: SortDataProps[] = [
{label: "OpenAI", value: "openai"},
{label: "Chatglm", value: "chatglm"},
{label: "Moonshot", value: "moonshot"},
{label: "Comate", value: "comate"},
]

export const AISortContent: React.FC<AISortContentProps> = (props) => {
const {onUpdate,AiApiPriority} = props
const [sortData, setSortData] = useState<SortDataProps[]>([]);
const {onUpdate, AiApiPriority} = props
const [sortData, setSortData] = useState<SortDataProps[]>([])

useEffect(()=>{
if(AiApiPriority.length>0){
useEffect(() => {
if (AiApiPriority.length > 0) {
const sortedData = defaultAiApiPriority.sort((a, b) => {
return AiApiPriority.indexOf(a.value) - AiApiPriority.indexOf(b.value);
});
return AiApiPriority.indexOf(a.value) - AiApiPriority.indexOf(b.value)
})
setSortData(sortedData)
}
else{
} else {
setSortData(defaultAiApiPriority)
}
},[AiApiPriority])
}, [AiApiPriority])

const onDragEnd = useMemoizedFn((result: DropResult) => {
const {source, destination, draggableId} = result
if(destination){
if (destination) {
const newItems: SortDataProps[] = JSON.parse(JSON.stringify(sortData))
const [removed] = newItems.splice(source.index, 1)
newItems.splice(destination.index, 0, removed)
setSortData([...newItems])
onUpdate(newItems.map((item)=>item.value))
setSortData([...newItems])
onUpdate(newItems.map((item) => item.value))
}
})

return(<div className={styles['ai-sort-content']}>
<div>优先级为从上到下</div>
<div className={styles['menu-list']}>
<DragDropContext
onDragEnd={onDragEnd}
>
<Droppable droppableId='droppable-payload' direction='vertical'
>
{(provided) => (
<div ref={provided.innerRef} {...provided.droppableProps}>
{sortData.map((item, index) => {
return (
<Draggable
key={item.value}
draggableId={item.value}
index={index}
>
{(provided, snapshot) => (
<div
ref={provided.innerRef}
{...provided.draggableProps}
{...provided.dragHandleProps}
style={{
...getItemStyle(snapshot.isDragging, provided.draggableProps.style)
}}
>
<div
className={classNames(styles["menu-list-item"], {
[styles["menu-list-item-drag"]]: snapshot.isDragging
})}
>
<div
className={styles["menu-list-item-info"]}
>
<DragSortIcon
className={styles["drag-sort-icon"]}
/>
<div className={styles["title"]}>
{item.label}
</div>
</div>
</div>



{/* <div className={styles['sort-item-box']}>
return (
<div className={styles["ai-sort-content"]}>
<div>优先级为从上到下</div>
<div className={styles["menu-list"]}>
<DragDropContext onDragEnd={onDragEnd}>
<Droppable droppableId='droppable-payload' direction='vertical'>
{(provided) => (
<div ref={provided.innerRef} {...provided.droppableProps}>
{sortData.map((item, index) => {
return (
<Draggable key={item.value} draggableId={item.value} index={index}>
{(provided, snapshot) => (
<div
ref={provided.innerRef}
{...provided.draggableProps}
{...provided.dragHandleProps}
style={{
...getItemStyle(
snapshot.isDragging,
provided.draggableProps.style
)
}}
>
<div
className={classNames(styles["menu-list-item"], {
[styles["menu-list-item-drag"]]: snapshot.isDragging
})}
>
<div className={styles["menu-list-item-info"]}>
<DragSortIcon className={styles["drag-sort-icon"]} />
<div className={styles["title"]}>{item.label}</div>
</div>
</div>

{/* <div className={styles['sort-item-box']}>
<div className={classNames(styles["sort-item"]) } key={item.value}>{item.label}</div>
</div> */}
</div>
)}
</Draggable>
)
})}
{provided.placeholder}
</div>
)}
</Draggable>
)
})}
{provided.placeholder}
</div>
)}
</Droppable>
</DragDropContext>
</Droppable>
</DragDropContext>
</div>
</div>
</div>)
}
)
}
39 changes: 21 additions & 18 deletions app/renderer/src/main/src/components/configNetwork/ThirdPartyApplicationConfig.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {KVPair} from "@/models/kv"
import {SelectOptionsProps} from "@/demoComponents/itemSelect/ItemSelectType"
import {DefaultOptionType} from "antd/lib/select"
import {YakitAutoComplete} from "../yakitUI/YakitAutoComplete/YakitAutoComplete"
import { warn } from "@/utils/notification"
import {warn} from "@/utils/notification"

export interface ThirdPartyApplicationConfigProp {
data?: ThirdPartyApplicationConfig
Expand All @@ -28,12 +28,11 @@ export function getThirdPartyAppExtraParams(type: string) {
case "hunter":
case "quake":
case "fofa":
return [
{label: "请求域名", key: "domain"}
]
return [{label: "请求域名", key: "domain"}]
case "openai":
case "chatglm":
case "moonshot":
case "comate":
return [
{label: "模型名称", key: "model"},
{label: "第三方加速域名", key: "domain"},
Expand All @@ -59,7 +58,7 @@ export function setThirdPartyAppExtraParamValue(
}

export const ThirdPartyApplicationConfigForm: React.FC<ThirdPartyApplicationConfigProp> = (props) => {
const {isCanInput = true,showOptions} = props
const {isCanInput = true, showOptions} = props
const [existed, setExisted] = useState(props.data !== undefined)
const [params, setParams] = useState<ThirdPartyApplicationConfig>(
props?.data || {
Expand All @@ -83,14 +82,15 @@ export const ThirdPartyApplicationConfigForm: React.FC<ThirdPartyApplicationConf
{label: "OpenAI", value: "openai"},
{label: "Chatglm", value: "chatglm"},
{label: "Moonshot", value: "moonshot"},
{label: "Comate", value: "comate"},
])

useEffect(()=>{
if(showOptions){
const newOptions = (options as unknown as any).filter((item)=>showOptions.includes(item.value))
setOptions(newOptions)
useEffect(() => {
if (showOptions) {
const newOptions = (options as unknown as any).filter((item) => showOptions.includes(item.value))
setOptions(newOptions)
}
},[showOptions])
}, [showOptions])
return (
<Form
layout={"horizontal"}
Expand Down Expand Up @@ -124,7 +124,7 @@ export const ThirdPartyApplicationConfigForm: React.FC<ThirdPartyApplicationConf
value={params.APIKey}
setValue={(val) => setParams({...params, APIKey: val})}
help={"APIKey / Token"}
required={true}
required={params.Type === "comate" ? false : true}
/>
<InputItem
label={"用户信息"}
Expand Down Expand Up @@ -152,13 +152,16 @@ export const ThirdPartyApplicationConfigForm: React.FC<ThirdPartyApplicationConf
<YakitButton type='outline2' onClick={() => props.onCancel()}>
取消
</YakitButton>
<YakitButton type={"primary"} onClick={() => {
if(params.Type.length===0 || params.APIKey.length === 0){
warn(`请填入必要参数`)
return
}
props.onAdd(params)
}}>
<YakitButton
type={"primary"}
onClick={() => {
if (params.Type.length === 0 || (params.Type != "comate" && params.APIKey.length === 0)) {
warn(`请填入必要参数`)
return
}
props.onAdd(params)
}}
>
确定添加
</YakitButton>
</div>
Expand Down
4 changes: 2 additions & 2 deletions app/renderer/src/main/src/components/layout/UILayout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1032,7 +1032,7 @@ const UILayout: React.FC<UILayoutProp> = (props) => {
if (val.isAiPlugin) {
apiGetGlobalNetworkConfig().then((obj: GlobalNetworkConfig) => {
const configType = obj.AppConfigs.map((item) => item.Type).filter((item) =>
["openai", "chatglm", "moonshot"].includes(item)
["openai", "chatglm", "moonshot", "comate"].includes(item)
)
// 如若已配置 则打开执行框
if (configType.length > 0) {
Expand Down Expand Up @@ -1070,7 +1070,7 @@ const UILayout: React.FC<UILayoutProp> = (props) => {
})
}}
onCancel={() => m.destroy()}
showOptions = {["openai","chatglm","moonshot"]}
showOptions = {["openai","chatglm","moonshot","comate"]}
/>
</div>
</>
Expand Down
Loading

0 comments on commit d2c3755

Please sign in to comment.