yujunjun/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2025-11-12 09:25:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: replace ImagePlus icon with RiImageCircleAiLine and improve tab button styling

Browse Source
This commit is contained in:
twwu 2025-06-05 11:21:17 +08:00
parent c83370f701
commit 6286f368f1
1 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/app/components/base/app-icon-picker/index.tsx
View File

@ -5,7 +5,6 @@ import type { Area } from 'react-easy-crop'
import Modal from '../modal' import Modal from '../modal'
import Divider from '../divider' import Divider from '../divider'
import Button from '../button' import Button from '../button'
import { ImagePlus } from '../icons/src/vender/line/images'
import { useLocalFileUploader } from '../image-uploader/hooks' import { useLocalFileUploader } from '../image-uploader/hooks'
import EmojiPickerInner from '../emoji-picker/Inner' import EmojiPickerInner from '../emoji-picker/Inner'
import type { OnImageInput } from './ImageInput' import type { OnImageInput } from './ImageInput'
@ -16,6 +15,7 @@ import type { AppIconType, ImageFile } from '@/types/app'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
import { DISABLE_UPLOAD_IMAGE_AS_ICON } from '@/config' import { DISABLE_UPLOAD_IMAGE_AS_ICON } from '@/config'
import { noop } from 'lodash-es' import { noop } from 'lodash-es'
import { RiImageCircleAiLine } from '@remixicon/react'
export type AppIconEmojiSelection = { export type AppIconEmojiSelection = {
type: 'emoji' type: 'emoji'
@ -46,7 +46,7 @@ const AppIconPicker: FC<AppIconPickerProps> = ({
const tabs = [ const tabs = [
{ key: 'emoji', label: t('app.iconPicker.emoji'), icon: <span className="text-lg">🤖</span> }, { key: 'emoji', label: t('app.iconPicker.emoji'), icon: <span className="text-lg">🤖</span> },
{ key: 'image', label: t('app.iconPicker.image'), icon: <ImagePlus /> }, { key: 'image', label: t('app.iconPicker.image'), icon: <RiImageCircleAiLine className='size-4' /> },
] ]
const [activeTab, setActiveTab] = useState<AppIconType>('emoji') const [activeTab, setActiveTab] = useState<AppIconType>('emoji')
@ -119,10 +119,10 @@ const AppIconPicker: FC<AppIconPickerProps> = ({
{tabs.map(tab => ( {tabs.map(tab => (
<button <button
key={tab.key} key={tab.key}
className={` className={cn(
flex h-8 flex-1 shrink-0 items-center justify-center rounded-xl p-2 text-sm font-medium 'system-sm-medium flex h-8 flex-1 shrink-0 items-center justify-center rounded-xl p-2 text-text-tertiary',
${activeTab === tab.key && 'bg-components-main-nav-nav-button-bg-active shadow-md'} activeTab === tab.key && 'bg-components-main-nav-nav-button-bg-active text-text-accent shadow-md',
`} )}
onClick={() => setActiveTab(tab.key as AppIconType)} onClick={() => setActiveTab(tab.key as AppIconType)}
> >
{tab.icon} &nbsp; {tab.label} {tab.icon} &nbsp; {tab.label}