Skip to content

Commit

Permalink
feat: 新增插件功能&优化相关细节
Browse files Browse the repository at this point in the history
  • Loading branch information
79E committed Jul 24, 2023
1 parent eb69903 commit f0a86d6
Show file tree
Hide file tree
Showing 32 changed files with 1,183 additions and 238 deletions.
10 changes: 7 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "chatgpt-web",
"private": false,
"version": "1.3.1",
"version": "1.0.0",
"description": "ChatGPT Web",
"author": "79E",
"keywords": [
Expand All @@ -27,15 +27,16 @@
"@ant-design/icons": "^5.0.1",
"@ant-design/pro-components": "^2.4.4",
"@traptitech/markdown-it-katex": "^3.6.0",
"ace-builds": "^1.23.1",
"alipay-sdk": "^3.4.0",
"antd": "5.5.0",
"autoprefixer": "^10.4.14",
"bull": "^4.10.4",
"cors": "^2.8.5",
"emoji-picker-react": "^4.4.9",
"express": "^4.18.2",
"express-async-errors": "^3.1.1",
"form-data": "^4.0.0",
"gpt-tokens": "^1.0.8",
"gpt-tokens": "^1.1.0",
"highlight.js": "^11.7.0",
"html2canvas": "^1.4.1",
"ioredis": "^5.3.2",
Expand All @@ -49,13 +50,16 @@
"node-fetch": "^2.6.11",
"node-schedule": "^2.1.1",
"nodemailer": "^6.9.2",
"postcss": "^8.4.25",
"react": "^18.2.0",
"react-ace": "^10.1.0",
"react-dom": "^18.2.0",
"react-quill": "^2.0.0",
"react-router-dom": "^6.10.0",
"sequelize": "^6.31.1",
"ts-node-dev": "^2.0.0",
"tslib": "^2.5.1",
"vm2": "^3.9.19",
"zustand": "^4.3.7"
},
"devDependencies": {
Expand Down
Empty file.
57 changes: 57 additions & 0 deletions src/components/CodeEditor/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import AceEditor from 'react-ace'

import 'ace-builds/src-noconflict/mode-json'
import 'ace-builds/src-noconflict/mode-javascript'
import 'ace-builds/src-noconflict/theme-solarized_dark'
import 'ace-builds/src-noconflict/ext-language_tools'

import styles from './index.module.less'
import { useRef } from 'react'

type Props = {
onLoad?: () => void;
onChange?: (value: string) => void;
value?: string;
defaultValue?: string;
mode: 'json' | 'javascript',
placeholder?: string
}

function CodeEditor(props: Props) {
const editorRef = useRef<HTMLDivElement>(null)

return (
<div className={styles.jsonEditor}>
<div className={styles.jsonEditor_content} ref={editorRef}>
<AceEditor
style={{
borderRadius: 8
}}
width="100%"
height="300px"
value={props.value ? props.value : undefined}
defaultValue={props.defaultValue}
placeholder={props.placeholder}
mode={props.mode}
theme="solarized_dark"
name="codeEditor"
onLoad={props?.onLoad}
onChange={props?.onChange}
fontSize={14}
showPrintMargin
showGutter
highlightActiveLine
setOptions={{
enableBasicAutocompletion: false,
enableLiveAutocompletion: true,
enableSnippets: false,
showLineNumbers: true,
tabSize: 2
}}
/>
</div>
</div>
)
}

export default CodeEditor
2 changes: 1 addition & 1 deletion src/components/MenuList/index.module.less
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
height: 100%;
display: flex;
flex-direction: column;
align-items: start;
align-items: flex-start;
}
}

Expand Down
30 changes: 30 additions & 0 deletions src/components/PluginCard/index.module.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
.pluginCard{
display: flex;
flex: 1;
margin: 10px 0;
align-items: center;
img{
width: 46px;
height: 46px;
object-fit: contain;
border: 1px solid #ddd;
border-radius: 12px;
margin-right: 12px;
}
&_info{
p {
font-size: 14px;
font-weight: 500;
color: #333;
}
span{
font-size: 12px;
color: #999;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
}
}
19 changes: 19 additions & 0 deletions src/components/PluginCard/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import styles from './index.module.less'

function PluginCard(info: {
avatar: string,
name: string,
description?: string,
}) {
return (
<div className={styles.pluginCard}>
<img src={info.avatar} alt="" />
<div className={styles.pluginCard_info}>
<p>{info.name}</p>
<span>{info.description}</span>
</div>
</div>
)
}

export default PluginCard;
10 changes: 5 additions & 5 deletions src/components/Reminder/index.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { chatStore, configStore } from '@/store'
import styles from './index.module.less'
import { Emoji } from 'emoji-picker-react'
import { Avatar } from 'antd'

function Reminder() {
const { random_personas, website_logo } = configStore()
Expand All @@ -25,12 +25,12 @@ function Reminder() {
className={styles.reminder_question_item}
onClick={() => {
addChat({
persona_id: item.id,
name: item?.title
})
persona_id: item.id,
name: item?.title
})
}}
>
<Emoji unified={item.emoji} size={24} />
{item.avatar && <Avatar shape="square" size={24} src={item.avatar} />}
<h3>{item.title}</h3>
</div>
)
Expand Down
105 changes: 105 additions & 0 deletions src/components/appCard/index.module.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,105 @@
.appCard{
box-sizing: border-box;
padding: 8px 12px;
border: 1px solid #dedede;
max-height: 132px;
min-height: 132px;
border-radius: 12px;
display: flex;
flex-direction: column;

&_header{
display: flex;
align-items: center;
}
&_icon{
height: 36px;
min-height: 36px;
width: 36px;
min-width: 36px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #dedede;
box-shadow: 0px 2px 4px 0px rgba(0,0,0,.05);
border-radius: 12px;
img {
width: 100%;
height: auto;
}
}
&_text{
margin-left: 12px;
display: flex;
justify-content: center;
flex-direction: column;
p{
font-weight: 500;
font-size: 14px;
color: #333;
line-height: 1;
}
span {
width: 100%;
max-width: 500px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-top: 4px;
font-size: 12px;
color: #999;
line-height: 1;
}
}
&_description{
margin: 8px 0;
font-size: 12px;
color: #999;
display: -webkit-box;
-webkit-line-clamp: 2; /* 设置最大显示行数为 2 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis; /* 超出部分显示省略号 */
}
&_button{
display: flex;
align-items: center;
gap: 8px;
margin-left: auto;
p {
border: 1px solid #bbb;
padding: 0px 10px 0px 6px;
cursor: pointer;
background-color: rgba(255, 255, 255, 0);
font-size: 12px;
border-radius: 50px;
transition: background-color 0.3s ease-in-out;
&:hover{
background-color: #ddd;
}
span{
margin-left: 4px;
}
}
}
&_footer{
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
&_userInfo{
display: flex;
align-items: center;
img{
width: 20px;
height: 20px;
border-radius: 50px;
}
span{
margin-left: 4px;
font-size: 12px;
color: #333;
}
}
}
}
47 changes: 47 additions & 0 deletions src/components/appCard/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
import { Badge } from 'antd'
import styles from './index.module.less'
import { UserInfo } from '@/types'
import { getEmailPre } from '@/utils'
import React from 'react'

type Props = {
id: string | number
avatar: string
title: string
message?: string
description?: string
status?: number
userInfo?: UserInfo
buttons: Array<React.ReactNode>
}

function AppCard(props: Props) {
return (
<div className={styles.appCard} key={props.id}>
<div className={styles.appCard_header}>
<Badge
dot
color={props.status === 1 ? 'transparent' : props.status === 4 ? 'orange' : 'red'}
>
<div className={styles.appCard_icon}>
{props.avatar && <img src={props.avatar} alt="" />}
</div>
</Badge>
<div className={styles.appCard_text}>
<p>{props.title}</p>
<span>{props.message}</span>
</div>
</div>
<p className={styles.appCard_description}>{props.description}</p>
<div className={styles.appCard_footer}>
<div className={styles.appCard_footer_userInfo}>
{props.userInfo?.avatar && <img src={props.userInfo?.avatar} alt="" />}
<span>{getEmailPre(props.userInfo?.account)}</span>
</div>
<div className={styles.appCard_button}>{props.buttons.map((dom) => dom)}</div>
</div>
</div>
)
}

export default AppCard
Loading

0 comments on commit f0a86d6

Please sign in to comment.