mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2025-12-23 18:10:26 +08:00
refactor: update icon usage and improve painting state management
* replaced InfoCircleFilled icon with Info from lucide-react for consistency * simplified painting state initialization and handling in AihubmixPage and PaintingsPage * removed unnecessary conditional logic for setting default painting
This commit is contained in:
parent
ce8b85020b
commit
a6a8324cdb
@ -1,4 +1,4 @@
|
||||
import { InfoCircleFilled, PlusOutlined, RedoOutlined } from '@ant-design/icons'
|
||||
import { PlusOutlined, RedoOutlined } from '@ant-design/icons'
|
||||
import IcImageUp from '@renderer/assets/images/paintings/ic_ImageUp.svg'
|
||||
import { Navbar, NavbarCenter, NavbarRight } from '@renderer/components/app/Navbar'
|
||||
import { HStack } from '@renderer/components/Layout'
|
||||
@ -20,6 +20,7 @@ import type { PaintingAction, PaintingsState } from '@renderer/types'
|
||||
import { getErrorMessage, uuid } from '@renderer/utils'
|
||||
import { Avatar, Button, Input, InputNumber, Radio, Segmented, Select, Slider, Switch, Tooltip, Upload } from 'antd'
|
||||
import TextArea from 'antd/es/input/TextArea'
|
||||
import { Info } from 'lucide-react'
|
||||
import type { FC } from 'react'
|
||||
import { useEffect, useMemo, useRef, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
@ -72,6 +73,7 @@ const AihubmixPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
{ label: t('paintings.mode.remix'), value: 'remix' },
|
||||
{ label: t('paintings.mode.upscale'), value: 'upscale' }
|
||||
]
|
||||
|
||||
const getNewPainting = () => {
|
||||
return {
|
||||
...DEFAULT_PAINTING,
|
||||
@ -278,14 +280,6 @@ const AihubmixPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
}
|
||||
|
||||
removePainting(mode, paintingToDelete)
|
||||
|
||||
if (filteredPaintings.length === 1) {
|
||||
const defaultPainting = {
|
||||
...DEFAULT_PAINTING,
|
||||
id: uuid()
|
||||
}
|
||||
setPainting(defaultPainting)
|
||||
}
|
||||
}
|
||||
|
||||
const translate = async () => {
|
||||
@ -334,6 +328,7 @@ const AihubmixPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
navigate('../' + providerId, { replace: true })
|
||||
}
|
||||
}
|
||||
|
||||
// 处理模式切换
|
||||
const handleModeChange = (value: string) => {
|
||||
setMode(value as keyof PaintingsState)
|
||||
@ -494,8 +489,9 @@ const AihubmixPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
|
||||
useEffect(() => {
|
||||
if (filteredPaintings.length === 0) {
|
||||
addPainting(mode, getNewPainting())
|
||||
setPainting(DEFAULT_PAINTING)
|
||||
const newPainting = getNewPainting()
|
||||
addPainting(mode, newPainting)
|
||||
setPainting(newPainting)
|
||||
}
|
||||
}, [filteredPaintings, mode, addPainting, painting])
|
||||
|
||||
@ -674,11 +670,17 @@ const ToolbarMenu = styled.div`
|
||||
gap: 6px;
|
||||
`
|
||||
|
||||
const InfoIcon = styled(InfoCircleFilled)`
|
||||
const InfoIcon = styled(Info)`
|
||||
margin-left: 5px;
|
||||
cursor: help;
|
||||
color: #8d94a6;
|
||||
font-size: 12px;
|
||||
color: var(--color-text-2);
|
||||
opacity: 0.6;
|
||||
width: 14px;
|
||||
height: 16px;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
`
|
||||
|
||||
const SliderContainer = styled.div`
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { PlusOutlined, QuestionCircleOutlined, RedoOutlined } from '@ant-design/icons'
|
||||
import { PlusOutlined, RedoOutlined } from '@ant-design/icons'
|
||||
import ImageSize1_1 from '@renderer/assets/images/paintings/image-size-1-1.svg'
|
||||
import ImageSize1_2 from '@renderer/assets/images/paintings/image-size-1-2.svg'
|
||||
import ImageSize3_2 from '@renderer/assets/images/paintings/image-size-3-2.svg'
|
||||
@ -26,6 +26,7 @@ import type { FileType, Painting } from '@renderer/types'
|
||||
import { getErrorMessage, uuid } from '@renderer/utils'
|
||||
import { Button, Input, InputNumber, Radio, Select, Slider, Switch, Tooltip } from 'antd'
|
||||
import TextArea from 'antd/es/input/TextArea'
|
||||
import { Info } from 'lucide-react'
|
||||
import type { FC } from 'react'
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
@ -90,7 +91,7 @@ const DEFAULT_PAINTING: Painting = {
|
||||
const PaintingsPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
const { t } = useTranslation()
|
||||
const { paintings, addPainting, removePainting, updatePainting } = usePaintings()
|
||||
const [painting, setPainting] = useState<Painting>(DEFAULT_PAINTING)
|
||||
const [painting, setPainting] = useState<Painting>(paintings[0] || DEFAULT_PAINTING)
|
||||
const { theme } = useTheme()
|
||||
const providers = useAllProviders()
|
||||
const providerOptions = Options.map((option) => {
|
||||
@ -260,10 +261,6 @@ const PaintingsPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
}
|
||||
|
||||
removePainting('paintings', paintingToDelete)
|
||||
|
||||
if (paintings.length === 1) {
|
||||
setPainting(getNewPainting())
|
||||
}
|
||||
}
|
||||
|
||||
const onSelectPainting = (newPainting: Painting) => {
|
||||
@ -326,8 +323,11 @@ const PaintingsPage: FC<{ Options: string[] }> = ({ Options }) => {
|
||||
|
||||
useEffect(() => {
|
||||
if (paintings.length === 0) {
|
||||
addPainting('paintings', getNewPainting())
|
||||
const newPainting = getNewPainting()
|
||||
addPainting('paintings', newPainting)
|
||||
setPainting(newPainting)
|
||||
}
|
||||
|
||||
return () => {
|
||||
if (spaceClickTimer.current) {
|
||||
clearTimeout(spaceClickTimer.current)
|
||||
@ -602,11 +602,13 @@ const RadioButton = styled(Radio.Button)`
|
||||
align-items: center;
|
||||
`
|
||||
|
||||
const InfoIcon = styled(QuestionCircleOutlined)`
|
||||
const InfoIcon = styled(Info)`
|
||||
margin-left: 5px;
|
||||
cursor: help;
|
||||
color: var(--color-text-2);
|
||||
opacity: 0.6;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user