Commit 90d0c62f by HoMeTown

chore: 更新nextui to heroui

parent 941f8201
public-hoist-pattern[]=*@nextui-org/* public-hoist-pattern[]=*@heroui/*
...@@ -39,8 +39,7 @@ ...@@ -39,8 +39,7 @@
} }
}, },
"dependencies": { "dependencies": {
"@heroui/popover": "^2.3.10", "@heroui/react": "2.6.14",
"@nextui-org/react": "^2.4.6",
"@reduxjs/toolkit": "^2.2.7", "@reduxjs/toolkit": "^2.2.7",
"@rsbuild/plugin-image-compress": "^1.1.0", "@rsbuild/plugin-image-compress": "^1.1.0",
"ahooks": "^3.8.0", "ahooks": "^3.8.0",
......
...@@ -107,7 +107,7 @@ export default defineConfig({ ...@@ -107,7 +107,7 @@ export default defineConfig({
reactJoyride: '/node_modules[\\/].pnpm[\\/]react-joyride/', reactJoyride: '/node_modules[\\/].pnpm[\\/]react-joyride/',
reactMarkdown: '/node_modules[\\/]react-markdown/', reactMarkdown: '/node_modules[\\/]react-markdown/',
reactHotToast: '/node_modules[\\/]react-hot-toast/', reactHotToast: '/node_modules[\\/]react-hot-toast/',
nextUi: /node_modules[\\/]@nextui-org/, nextUi: /node_modules[\\/]@heroui/,
}, },
}, },
}, },
......
import React, { useEffect, useRef, useState } from 'react' import React, { useEffect, useRef, useState } from 'react'
import { AnimatePresence, motion } from 'framer-motion' import { AnimatePresence, motion } from 'framer-motion'
import { Button, Tooltip } from '@nextui-org/react' import { Button, Tooltip } from '@heroui/react'
import { useLocalStorageState, useToggle } from 'ahooks' import { useLocalStorageState, useToggle } from 'ahooks'
import { LoginModal } from '../LoginModal' import { LoginModal } from '../LoginModal'
import type { RootState } from '@/store' import type { RootState } from '@/store'
......
import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow, getKeyValue } from '@nextui-org/react' import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow, getKeyValue } from '@heroui/react'
import React from 'react' import React from 'react'
import { useAppDispatch, useAppSelector } from '@/store/hook' import { useAppDispatch, useAppSelector } from '@/store/hook'
import { deleteConversations } from '@/store/conversationSlice' import { deleteConversations } from '@/store/conversationSlice'
......
import React from 'react' import React from 'react'
import { Button, Checkbox, Link, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader } from '@nextui-org/react' import { Button, Checkbox, Link, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader } from '@heroui/react'
import { useNavigate } from 'react-router-dom' import { useNavigate } from 'react-router-dom'
import { useAuth } from '@/auth/AuthContext' import { useAuth } from '@/auth/AuthContext'
......
...@@ -4,7 +4,7 @@ import rehypeRaw from 'rehype-raw' ...@@ -4,7 +4,7 @@ import rehypeRaw from 'rehype-raw'
import rehypeSanitize from 'rehype-sanitize' import rehypeSanitize from 'rehype-sanitize'
import remarkGfm from 'remark-gfm' import remarkGfm from 'remark-gfm'
import { PhotoProvider, PhotoView } from 'react-photo-view' import { PhotoProvider, PhotoView } from 'react-photo-view'
import { Image } from '@nextui-org/react' import { Image } from '@heroui/react'
interface MarkdownDetailProps { interface MarkdownDetailProps {
children: ReactNode children: ReactNode
......
import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader } from '@nextui-org/react' import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader } from '@heroui/react'
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import { fetchGetFeedbackConfig, fetchSubmitFeedback } from '@/api/chat' import { fetchGetFeedbackConfig, fetchSubmitFeedback } from '@/api/chat'
import type { Answer } from '@/types/chat' import type { Answer } from '@/types/chat'
...@@ -48,47 +48,51 @@ export const UnLikeModal: React.FC<UnLikeModalProps> = ({ isOpen, onClose, answe ...@@ -48,47 +48,51 @@ export const UnLikeModal: React.FC<UnLikeModalProps> = ({ isOpen, onClose, answe
// getConfig() // getConfig()
}, [isOpen]) }, [isOpen])
return ( return (
<Modal backdrop="blur" size="2xl" isOpen={isOpen} onClose={onClose}> (
<ModalContent> <Modal backdrop="blur" size="2xl" isOpen={isOpen} onClose={onClose}>
{onClose => ( <ModalContent>
<> {onClose => (
<ModalHeader className="flex flex-col gap-1">你的反馈将帮助 晓得 优化进步</ModalHeader> <>
<ModalBody className="text-[#27353C]"> <ModalHeader className="flex flex-col gap-1">你的反馈将帮助 晓得 优化进步</ModalHeader>
<div className="flex flex-wrap gap-[6px]"> <ModalBody className="text-[#27353C]">
{feedbackConfig && feedbackConfig.questionList[0].answerList.map((item: any, index: number) => ( <div className="flex flex-wrap gap-[6px]">
{feedbackConfig && feedbackConfig.questionList[0].answerList.map((item: any, index: number) => (
// <div className="w-1/2" key={item.answerCode}>{item.answerName}</div> // <div className="w-1/2" key={item.answerCode}>{item.answerName}</div>
<Button (
key={item.answerCode} <Button
color="primary" key={item.answerCode}
variant="light" color="primary"
className={`bg-[#F8F8F8] text-left text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary ${item.answerValue === '1' ? 'bg-[#E5F6FF] text-primary' : ''}`} variant="light"
onClick={() => handleClick(item, index)} className={`bg-[#F8F8F8] text-left text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary ${item.answerValue === '1' ? 'bg-[#E5F6FF] text-primary' : ''}`}
> onClick={() => handleClick(item, index)}
<div className="w-full text-nowrap text-ellipsis overflow-hidden"> >
<span>{item.answerName}</span> <div className="w-full text-nowrap text-ellipsis overflow-hidden">
</div> <span>{item.answerName}</span>
</Button> </div>
))} </Button>
{/* <Textarea )
))}
{/* <Textarea
value={answerValue} value={answerValue}
onValueChange={setAnswerValue} onValueChange={setAnswerValue}
label="留下更多反馈" label="留下更多反馈"
placeholder="" placeholder=""
className="w-full mt-[10px]" className="w-full mt-[10px]"
/> */} /> */}
</div> </div>
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>
<Button onPress={onClose}> <Button onPress={onClose}>
取消 取消
</Button> </Button>
<Button onClick={onSubmit} color="primary"> <Button onClick={onSubmit} color="primary">
提交 提交
</Button> </Button>
</ModalFooter> </ModalFooter>
</> </>
)} )}
</ModalContent> </ModalContent>
</Modal> </Modal>
)
) )
} }
import type { NextUIPluginConfig } from '@nextui-org/react' import type { NextUIPluginConfig } from '@heroui/react'
export const theme: NextUIPluginConfig = { export const theme: NextUIPluginConfig = {
prefix: 'sdream', prefix: 'sdream',
......
import React from 'react' import React from 'react'
import ReactDOM from 'react-dom/client' import ReactDOM from 'react-dom/client'
import { NextUIProvider } from '@nextui-org/react' import { HeroUIProvider } from '@heroui/react'
import App from './App' import App from './App'
import './styles/index.less' import './styles/index.less'
import 'github-markdown-css/github-markdown.css' import 'github-markdown-css/github-markdown.css'
...@@ -17,9 +17,9 @@ if (rootEl) { ...@@ -17,9 +17,9 @@ if (rootEl) {
const root = ReactDOM.createRoot(rootEl) const root = ReactDOM.createRoot(rootEl)
root.render( root.render(
<React.StrictMode> <React.StrictMode>
<NextUIProvider className="h-full"> <HeroUIProvider className="h-full">
<App /> <App />
</NextUIProvider> </HeroUIProvider>
</React.StrictMode>, </React.StrictMode>,
) )
} }
import { AnimatePresence, motion } from 'framer-motion' import { AnimatePresence, motion } from 'framer-motion'
import { Button, Input } from '@nextui-org/react' import { Button, Input } from '@heroui/react'
import React, { useState } from 'react' import React, { useState } from 'react'
import { variants } from './motionAnimate' import { variants } from './motionAnimate'
import { HistoryBarList } from './components/HistoryBarList' import { HistoryBarList } from './components/HistoryBarList'
......
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { Button } from '@nextui-org/react' import { Button } from '@heroui/react'
import { useNavigate } from 'react-router-dom' import { useNavigate } from 'react-router-dom'
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import { useDebounceFn } from 'ahooks' import { useDebounceFn } from 'ahooks'
......
import React from 'react' import React from 'react'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { Button, Tooltip } from '@nextui-org/react' import { Button, Tooltip } from '@heroui/react'
import { useLocation, useNavigate } from 'react-router-dom' import { useLocation, useNavigate } from 'react-router-dom'
import { NavBarDivider } from '../NavBarDivider' import { NavBarDivider } from '../NavBarDivider'
import styles from './NavBarItem.module.less' import styles from './NavBarItem.module.less'
......
import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Tooltip } from '@nextui-org/react' import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Tooltip } from '@heroui/react'
import { useNavigate } from 'react-router-dom' import { useNavigate } from 'react-router-dom'
import { useSessionStorageState, useTimeout } from 'ahooks' import { useSessionStorageState } from 'ahooks'
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import { withAuth } from '@/auth/withAuth' import { withAuth } from '@/auth/withAuth'
import type { WithAuthProps } from '@/auth/withAuth' import type { WithAuthProps } from '@/auth/withAuth'
......
import React, { useCallback, useEffect, useRef, useState } from 'react' import React, { useCallback, useEffect, useRef, useState } from 'react'
import { useParams } from 'react-router-dom' import { useParams } from 'react-router-dom'
import { Button } from '@nextui-org/react' import { Button } from '@heroui/react'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { useScroll } from 'ahooks' import { useScroll } from 'ahooks'
import { toast } from 'react-hot-toast' import { toast } from 'react-hot-toast'
......
import { Button, Link } from '@nextui-org/react' import { Button, Link } from '@heroui/react'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import type { Answer, Attachment } from '@/types/chat' import type { Answer, Attachment } from '@/types/chat'
import AnswerProDetailIcon from '@/assets/svg/answerProDetail.svg?react' import AnswerProDetailIcon from '@/assets/svg/answerProDetail.svg?react'
...@@ -38,82 +38,85 @@ export const ChatAnswerAttachment: React.FC<ChatAnswerAttachmentProps> = ({ from ...@@ -38,82 +38,85 @@ export const ChatAnswerAttachment: React.FC<ChatAnswerAttachmentProps> = ({ from
} }
} }
return ( return (
<div className="cardList flex flex-col gap-[20px]"> (
{answer.cardList && answer.cardList.map((attachment, index) => { <div className="cardList flex flex-col gap-[20px]">
if (attachment?.type) { {answer.cardList && answer.cardList.map((attachment, index) => {
return ( if (attachment?.type) {
<div key={`${attachment.type}_${index}`}> return (
{/* 附件:product-detail */} (
{attachment.type === 'product-detail' && ( <div key={`${attachment.type}_${index}`}>
<div className="bg-[#29B6FD0A] text-[14px] text-primary py-[4px] px-[16px] w-fit flex items-center"> {/* 附件:product-detail */}
<AnswerProDetailIcon /> {attachment.type === 'product-detail' && (
{/* <span className="ml-[6px]">{attachment.name}</span> */} <div className="bg-[#29B6FD0A] text-[14px] text-primary py-[4px] px-[16px] w-fit flex items-center">
<div className="ml-[6px] max-w-full sm:w-full text-nowrap text-ellipsis overflow-hidden"> <AnswerProDetailIcon />
{attachment.name} {/* <span className="ml-[6px]">{attachment.name}</span> */}
</div> <div className="ml-[6px] max-w-full sm:w-full text-nowrap text-ellipsis overflow-hidden">
</div> {attachment.name}
)} </div>
</div>
{/* 附件:引用文件 */} )}
{attachment.type === 'reference' && attachment.content.docList.length !== 0 && ( {/* 附件:引用文件 */}
<div> {attachment.type === 'reference' && attachment.content.docList.length !== 0 && (
<p className="text-[14px] text-[#8D9795] mb-[12px]"> <div>
已为您找到 <p className="text-[14px] text-[#8D9795] mb-[12px]">
{attachment.content.docList.length} 已为您找到
篇资料作为参考: {attachment.content.docList.length}
</p> 篇资料作为参考:
<div className="flex flex-col gap-[9px]"> </p>
{ attachment.content.docList.map(doc => ( <div className="flex flex-col gap-[9px]">
<Link className="cursor-pointer" onPress={() => handleClickDocLink(doc.documentStoreKey)} size="sm" key={doc.documentStoreKey} isExternal showAnchorIcon underline="hover"> { attachment.content.docList.map(doc => (
{doc.documentAlias} <Link className="cursor-pointer" onPress={() => handleClickDocLink(doc.documentStoreKey)} size="sm" key={doc.documentStoreKey} isExternal showAnchorIcon underline="hover">
</Link> {doc.documentAlias}
))} </Link>
</div> ))}
</div> </div>
</div>
)} )}
{/* 附件:选择 box */}
{/* 附件:选择 box */} {
{ attachment.type === 'box' && attachment.content.productList.length !== 0 && (
attachment.type === 'box' && attachment.content.productList.length !== 0 && ( <div>
<div> <div className="mb-[12px]">{attachment.description}</div>
<div className="mb-[12px]">{attachment.description}</div> <ul
<ul className="flex flex-col gap-[8px]"
className="flex flex-col gap-[8px]"
>
{attachment.content.productList.map(product => (
// <div key={product.productCode}>{product.productName}</div>
<motion.li
key={product.productCode}
> >
<Button onClick={() => handleClickBoxItem(product.productName, product.productCode)} isDisabled={!isLastAnswer} color="primary" variant="light" className="text-left bg-[#F7FCFF] w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary"> {attachment.content.productList.map(product => (
<div className="w-full text-nowrap text-ellipsis overflow-hidden"> // <div key={product.productCode}>{product.productName}</div>
<span className="ml-[8px]">{product.productName}</span> (
</div> <motion.li
</Button> key={product.productCode}
</motion.li> >
))} <Button onClick={() => handleClickBoxItem(product.productName, product.productCode)} isDisabled={!isLastAnswer} color="primary" variant="light" className="text-left bg-[#F7FCFF] w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary">
</ul> <div className="w-full text-nowrap text-ellipsis overflow-hidden">
</div> <span className="ml-[8px]">{product.productName}</span>
) </div>
} </Button>
</motion.li>
{ )
attachment.type?.includes('card-') && ( ))}
<div onClick={() => handleClickCard(attachment)}> </ul>
{attachment.type === 'card-nav' && <img className="w-full max-w-[400px] cursor-pointer" src={CardNavImg} alt="" />} </div>
{attachment.type === 'card-detail' && <img className="w-full max-w-[400px] cursor-pointer" src={CardDetailImg} alt="" />} )
{attachment.type === 'card-calculation' && <img className="w-full max-w-[400px] cursor-pointer" src={CardCalculation} alt="" />} }
{attachment.type === 'card-product-compare' && <img className="w-full max-w-[400px] cursor-pointer" src={CardProductCompareImg} alt="" />} {
{attachment.type === 'card-plans' && <img className="w-full max-w-[400px] cursor-pointer" src={CardPlansImg} alt="" />} attachment.type?.includes('card-') && (
</div> <div onClick={() => handleClickCard(attachment)}>
) {attachment.type === 'card-nav' && <img className="w-full max-w-[400px] cursor-pointer" src={CardNavImg} alt="" />}
} {attachment.type === 'card-detail' && <img className="w-full max-w-[400px] cursor-pointer" src={CardDetailImg} alt="" />}
</div> {attachment.type === 'card-calculation' && <img className="w-full max-w-[400px] cursor-pointer" src={CardCalculation} alt="" />}
) {attachment.type === 'card-product-compare' && <img className="w-full max-w-[400px] cursor-pointer" src={CardProductCompareImg} alt="" />}
} {attachment.type === 'card-plans' && <img className="w-full max-w-[400px] cursor-pointer" src={CardPlansImg} alt="" />}
return null </div>
})} )
</div> }
</div>
)
)
}
return null
})}
</div>
)
) )
} }
import { Avatar, Button } from '@nextui-org/react' import { Avatar, Button } from '@heroui/react'
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import { ChatAnswerShower } from './ChatAnswerShower' import { ChatAnswerShower } from './ChatAnswerShower'
import { ChatAnswerParser } from './ChatAnswerParser' import { ChatAnswerParser } from './ChatAnswerParser'
......
import { Button, Tooltip } from '@nextui-org/react' import { Button, Tooltip } from '@heroui/react'
import { useState } from 'react' import { useState } from 'react'
import { useDebounceFn } from 'ahooks' import { useDebounceFn } from 'ahooks'
import type { Answer } from '@/types/chat' import type { Answer } from '@/types/chat'
......
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from 'react'
import { Chip } from '@nextui-org/react' import { Chip } from '@heroui/react'
import { ChatAnswerAttachment } from './ChatAnswerAttchment' import { ChatAnswerAttachment } from './ChatAnswerAttchment'
import { ChatAnswerOperate } from './ChatAnswerOperate' import { ChatAnswerOperate } from './ChatAnswerOperate'
import { formatMarkdown } from './markdownFormatter' import { formatMarkdown } from './markdownFormatter'
......
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import { Button, Skeleton } from '@nextui-org/react' import { Button, Skeleton } from '@heroui/react'
import type { Answer } from '@/types/chat' import type { Answer } from '@/types/chat'
import { fetchQueryRecommendQuestion } from '@/api/chat' import { fetchQueryRecommendQuestion } from '@/api/chat'
import SendIcon from '@/assets/svg/sendBlack.svg?react' import SendIcon from '@/assets/svg/sendBlack.svg?react'
......
import { Avatar } from '@nextui-org/react' import { Avatar } from '@heroui/react'
import AvatarUser from '@/assets/avatarUser.png' import AvatarUser from '@/assets/avatarUser.png'
import type { ChatRecord } from '@/types/chat' import type { ChatRecord } from '@/types/chat'
......
export const ChatMaxCount: React.FC = () => {
return (
<div>
<div className="flex items-center">
<p className="text-[14px] mr-[12px]">⚠️ 超过最大轮数上限!请您新建对话~</p>
</div>
</div>
)
}
import { Avatar } from '@nextui-org/react' import { Avatar } from '@heroui/react'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import AvatarBot from '@/assets/avatarBot.png' import AvatarBot from '@/assets/avatarBot.png'
......
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Tooltip } from '@nextui-org/react' import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Tooltip } from '@heroui/react'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { ChatMaskBar } from '../Chat/components/ChatMaskBar' import { ChatMaskBar } from '../Chat/components/ChatMaskBar'
import { ChatSlogan } from '../Chat/components/ChatSlogan' import { ChatSlogan } from '../Chat/components/ChatSlogan'
......
import { Button } from '@nextui-org/react' import { Button } from '@heroui/react'
import type React from 'react' import type React from 'react'
import { Image } from '@nextui-org/image' import { Image } from '@heroui/image'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { useCallback, useEffect, useState } from 'react' import { useCallback, useEffect, useState } from 'react'
import Refresh from '@/assets/svg/refresh.svg?react' import Refresh from '@/assets/svg/refresh.svg?react'
......
import { Button } from '@nextui-org/react' import { Button } from '@heroui/react'
import type React from 'react' import type React from 'react'
import { motion, useAnimation } from 'framer-motion' import { motion, useAnimation } from 'framer-motion'
import { useEffect } from 'react' import { useEffect } from 'react'
......
...@@ -4,13 +4,13 @@ const { ...@@ -4,13 +4,13 @@ const {
default: flattenColorPalette, default: flattenColorPalette,
} = require('tailwindcss/lib/util/flattenColorPalette') } = require('tailwindcss/lib/util/flattenColorPalette')
const { nextui } = require ('@nextui-org/react') const { heroui } = require ('@heroui/react')
/** @type {import('tailwindcss').Config} */ /** @type {import('tailwindcss').Config} */
module.exports = { module.exports = {
content: [ content: [
'./src/**/*.{html,js,ts,jsx,tsx}', './src/**/*.{html,js,ts,jsx,tsx}',
'./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}', './node_modules/@heroui/theme/dist/**/*.{js,ts,jsx,tsx}',
], ],
theme: { theme: {
screens: { screens: {
...@@ -36,7 +36,7 @@ module.exports = { ...@@ -36,7 +36,7 @@ module.exports = {
}, },
darkMode: 'class', darkMode: 'class',
plugins: [ plugins: [
nextui(theme), heroui(theme),
addVariablesForColors, addVariablesForColors,
], ],
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment