From 538093855b3ca179e42dacc5a2e86d0b2242030b Mon Sep 17 00:00:00 2001 From: yyh <92089059+lyzno1@users.noreply.github.com> Date: Wed, 15 Apr 2026 23:47:59 +0800 Subject: [PATCH] refactor(web): align Switch API with Base UI naming convention (#35269) Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> --- .../[appId]/overview/tracing/config-popup.tsx | 4 +- web/app/components/app/annotation/index.tsx | 4 +- .../app/configuration/config-vision/index.tsx | 4 +- .../config/agent/agent-tools/index.tsx | 4 +- .../app/configuration/config/config-audio.tsx | 10 +-- .../configuration/config/config-document.tsx | 10 +-- .../params-config/config-content.tsx | 4 +- .../overview/__tests__/trigger-card.spec.tsx | 6 +- web/app/components/app/overview/app-card.tsx | 4 +- .../app/overview/settings/index.tsx | 14 ++-- .../components/app/overview/trigger-card.tsx | 16 ++-- .../new-feature-panel/feature-card.tsx | 8 +- .../moderation/moderation-content.tsx | 8 +- .../text-to-speech/param-config-content.tsx | 4 +- web/app/components/base/param-item/index.tsx | 6 +- .../base/switch/__tests__/index.spec.tsx | 76 +++++++++---------- .../components/base/switch/index.stories.tsx | 56 +++++++------- web/app/components/base/switch/index.tsx | 14 ++-- .../plan-switcher/plan-range-switcher.tsx | 6 +- .../custom/custom-web-app-brand/index.tsx | 4 +- .../__tests__/index.spec.tsx | 6 +- .../common/retrieval-param-config/index.tsx | 4 +- .../documents/components/operations.tsx | 6 +- .../detail/completed/segment-card/index.tsx | 4 +- .../datasets/documents/status-item/index.tsx | 2 +- .../datasets/extra-info/api-access/card.tsx | 4 +- .../dataset-metadata-drawer.tsx | 4 +- .../settings/summary-index-setting.tsx | 34 ++++----- .../explore/create-app-modal/index.tsx | 4 +- .../model-parameter-modal/parameter-item.tsx | 4 +- .../provider-added-card/model-list-item.tsx | 6 +- .../model-load-balancing-configs.tsx | 8 +- .../plugin-detail-panel/endpoint-card.tsx | 4 +- .../__tests__/reasoning-config-form.spec.tsx | 6 +- .../components/reasoning-config-form.tsx | 4 +- .../tool-selector/components/tool-item.tsx | 4 +- .../components/tools/mcp/mcp-service-card.tsx | 2 +- .../mcp/sections/authentication-section.tsx | 4 +- .../nodes/_base/components/config-vision.tsx | 2 +- .../nodes/_base/components/memory-config.tsx | 8 +- .../nodes/_base/components/prompt/editor.tsx | 4 +- .../_base/components/retry/retry-on-panel.tsx | 10 +-- .../components/workflow/nodes/http/panel.tsx | 4 +- .../delivery-method/email-configure-modal.tsx | 4 +- .../delivery-method/method-item.tsx | 4 +- .../recipient/__tests__/index.spec.tsx | 6 +- .../delivery-method/recipient/index.tsx | 4 +- .../workflow/nodes/iteration/panel.tsx | 10 +-- .../search-method-option.tsx | 4 +- .../top-k-and-score-threshold.tsx | 8 +- .../list-operator/__tests__/panel.spec.tsx | 8 +- .../__tests__/limit-config.spec.tsx | 8 +- .../list-operator/components/limit-config.tsx | 4 +- .../workflow/nodes/list-operator/panel.tsx | 12 +-- .../edit-card/required-switch.tsx | 2 +- .../llm/components/panel-output-section.tsx | 4 +- .../components/reasoning-format-config.tsx | 4 +- .../components/extract-parameter/update.tsx | 2 +- .../nodes/variable-assigner/panel.tsx | 4 +- .../note-editor/toolbar/operator.tsx | 4 +- .../filter/filter-switch.tsx | 6 +- web/eslint-suppressions.json | 45 ----------- 62 files changed, 249 insertions(+), 294 deletions(-) diff --git a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/config-popup.tsx b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/config-popup.tsx index 15b81e1ad6..3efd58ac40 100644 --- a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/config-popup.tsx +++ b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/config-popup.tsx @@ -94,8 +94,8 @@ const ConfigPopup: FC = ({ const switchContent = ( ) diff --git a/web/app/components/app/annotation/index.tsx b/web/app/components/app/annotation/index.tsx index b922421849..419aaba25d 100644 --- a/web/app/components/app/annotation/index.tsx +++ b/web/app/components/app/annotation/index.tsx @@ -155,9 +155,9 @@ const Annotation: FC = (props) => {
{t('name', { ns: 'appAnnotation' })}
{ + onCheckedChange={async (value) => { if (value) { if (isAnnotationFull) { setIsShowAnnotationFullModal(true) diff --git a/web/app/components/app/configuration/config-vision/index.tsx b/web/app/components/app/configuration/config-vision/index.tsx index aec8d808c1..e1fd88eb3f 100644 --- a/web/app/components/app/configuration/config-vision/index.tsx +++ b/web/app/components/app/configuration/config-vision/index.tsx @@ -121,8 +121,8 @@ const ConfigVision: FC = () => {
diff --git a/web/app/components/app/configuration/config/agent/agent-tools/index.tsx b/web/app/components/app/configuration/config/agent/agent-tools/index.tsx index 87546b94b4..4f60bc9310 100644 --- a/web/app/components/app/configuration/config/agent/agent-tools/index.tsx +++ b/web/app/components/app/configuration/config/agent/agent-tools/index.tsx @@ -298,10 +298,10 @@ const AgentTools: FC = () => {
{!item.notAuthor && ( { + onCheckedChange={(enabled) => { const newModelConfig = produce(modelConfig, (draft) => { (draft.agentConfig.tools[index] as any).enabled = enabled }) diff --git a/web/app/components/app/configuration/config/config-audio.tsx b/web/app/components/app/configuration/config/config-audio.tsx index 6303a00748..15a52610e6 100644 --- a/web/app/components/app/configuration/config/config-audio.tsx +++ b/web/app/components/app/configuration/config/config-audio.tsx @@ -49,14 +49,14 @@ const ConfigAudio: FC = () => { return null return ( -
+
-
{t('feature.audioUpload.title', { ns: 'appDebug' })}
+
{t('feature.audioUpload.title', { ns: 'appDebug' })}
@@ -67,10 +67,10 @@ const ConfigAudio: FC = () => {
{!readonly && (
-
+
diff --git a/web/app/components/app/configuration/config/config-document.tsx b/web/app/components/app/configuration/config/config-document.tsx index 3cfeaa2710..859fd39426 100644 --- a/web/app/components/app/configuration/config/config-document.tsx +++ b/web/app/components/app/configuration/config/config-document.tsx @@ -49,14 +49,14 @@ const ConfigDocument: FC = () => { return null return ( -
+
-
{t('feature.documentUpload.title', { ns: 'appDebug' })}
+
{t('feature.documentUpload.title', { ns: 'appDebug' })}
@@ -67,10 +67,10 @@ const ConfigDocument: FC = () => {
{!readonly && (
-
+
diff --git a/web/app/components/app/configuration/dataset-config/params-config/config-content.tsx b/web/app/components/app/configuration/dataset-config/params-config/config-content.tsx index 47ece57eb0..f712d7017a 100644 --- a/web/app/components/app/configuration/dataset-config/params-config/config-content.tsx +++ b/web/app/components/app/configuration/dataset-config/params-config/config-content.tsx @@ -267,8 +267,8 @@ const ConfigContent: FC = ({ canManuallyToggleRerank && ( ) } diff --git a/web/app/components/app/overview/__tests__/trigger-card.spec.tsx b/web/app/components/app/overview/__tests__/trigger-card.spec.tsx index 2a1cd6d43b..d51a23bb05 100644 --- a/web/app/components/app/overview/__tests__/trigger-card.spec.tsx +++ b/web/app/components/app/overview/__tests__/trigger-card.spec.tsx @@ -74,12 +74,12 @@ vi.mock('@/app/components/workflow/block-icon', () => ({ })) vi.mock('@/app/components/base/switch', () => ({ - default: ({ defaultValue, onChange, disabled }: { defaultValue: boolean, onChange: (v: boolean) => void, disabled: boolean }) => ( + default: ({ checked, onCheckedChange, disabled }: { checked: boolean, onCheckedChange: (v: boolean) => void, disabled: boolean }) => ( diff --git a/web/app/components/app/overview/app-card.tsx b/web/app/components/app/overview/app-card.tsx index 1b2fa2a6e8..f02929c823 100644 --- a/web/app/components/app/overview/app-card.tsx +++ b/web/app/components/app/overview/app-card.tsx @@ -180,7 +180,7 @@ function AppCard({ return (
{triggerModeDisabled && ( @@ -247,7 +247,7 @@ function AppCard({ offset={24} >
- +
diff --git a/web/app/components/app/overview/settings/index.tsx b/web/app/components/app/overview/settings/index.tsx index e94977ed9f..d719d035e0 100644 --- a/web/app/components/app/overview/settings/index.tsx +++ b/web/app/components/app/overview/settings/index.tsx @@ -293,8 +293,8 @@ const SettingsModal: FC = ({
{t('answerIcon.title', { ns: 'app' })}
setInputInfo({ ...inputInfo, use_icon_as_answer_icon: v })} + checked={inputInfo.use_icon_as_answer_icon} + onCheckedChange={v => setInputInfo({ ...inputInfo, use_icon_as_answer_icon: v })} />

{t('answerIcon.description', { ns: 'app' })}

@@ -327,7 +327,7 @@ const SettingsModal: FC = ({ />

{t(`${prefixSettings}.chatColorThemeInverted`, { ns: 'appOverview' })}

- setInputInfo({ ...inputInfo, chatColorThemeInverted: v })}> + setInputInfo({ ...inputInfo, chatColorThemeInverted: v })}>
@@ -338,8 +338,8 @@ const SettingsModal: FC = ({
{t(`${prefixSettings}.workflow.subTitle`, { ns: 'appOverview' })}
setInputInfo({ ...inputInfo, show_workflow_steps: v })} + checked={inputInfo.show_workflow_steps} + onCheckedChange={v => setInputInfo({ ...inputInfo, show_workflow_steps: v })} />

{t(`${prefixSettings}.workflow.showDesc`, { ns: 'appOverview' })}

@@ -392,8 +392,8 @@ const SettingsModal: FC = ({ > setInputInfo({ ...inputInfo, copyrightSwitchValue: v })} + checked={inputInfo.copyrightSwitchValue} + onCheckedChange={v => setInputInfo({ ...inputInfo, copyrightSwitchValue: v })} />
diff --git a/web/app/components/app/overview/trigger-card.tsx b/web/app/components/app/overview/trigger-card.tsx index 53301a353a..aa1190cde3 100644 --- a/web/app/components/app/overview/trigger-card.tsx +++ b/web/app/components/app/overview/trigger-card.tsx @@ -34,12 +34,12 @@ const getTriggerIcon = (trigger: AppTrigger, triggerPlugins: any[]) => { const getStatusDot = () => { if (status === 'enabled') { return ( -
+
) } else { return ( -
+
) } } @@ -141,7 +141,7 @@ function TriggerCard({ appInfo, onToggleResult }: ITriggerCardProps) { if (isLoading) { return ( -
+
@@ -152,7 +152,7 @@ function TriggerCard({ appInfo, onToggleResult }: ITriggerCardProps) { } return ( -
+
@@ -161,7 +161,7 @@ function TriggerCard({ appInfo, onToggleResult }: ITriggerCardProps) {
-
+
{triggerCount > 0 ? t('overview.triggerInfo.triggersAdded', { ns: 'appOverview', count: triggerCount }) : t('overview.triggerInfo.noTriggerAdded', { ns: 'appOverview' })} @@ -179,7 +179,7 @@ function TriggerCard({ appInfo, onToggleResult }: ITriggerCardProps) {
{getTriggerIcon(trigger, triggerPlugins || [])}
-
+
{trigger.title}
@@ -192,8 +192,8 @@ function TriggerCard({ appInfo, onToggleResult }: ITriggerCardProps) {
onToggleTrigger(trigger, enabled)} + checked={trigger.status === 'enabled'} + onCheckedChange={enabled => onToggleTrigger(trigger, enabled)} disabled={!isCurrentWorkspaceEditor} />
diff --git a/web/app/components/base/features/new-feature-panel/feature-card.tsx b/web/app/components/base/features/new-feature-panel/feature-card.tsx index 23f140ba54..adc33011d9 100644 --- a/web/app/components/base/features/new-feature-panel/feature-card.tsx +++ b/web/app/components/base/features/new-feature-panel/feature-card.tsx @@ -32,13 +32,13 @@ const FeatureCard = ({ }: Props) => { return (
{icon} -
+
{title} {tooltip && ( )}
- onChange?.(state)} value={value} /> + onChange?.(state)} checked={value} />
{description && ( -
{description}
+
{description}
)} {children}
diff --git a/web/app/components/base/features/new-feature-panel/moderation/moderation-content.tsx b/web/app/components/base/features/new-feature-panel/moderation/moderation-content.tsx index 5374611330..39cc8d88db 100644 --- a/web/app/components/base/features/new-feature-panel/moderation/moderation-content.tsx +++ b/web/app/components/base/features/new-feature-panel/moderation/moderation-content.tsx @@ -38,14 +38,14 @@ const ModerationContent: FC = ({ } handleConfigChange('enabled', v)} + checked={config.enabled} + onCheckedChange={v => handleConfigChange('enabled', v)} />
{ config.enabled && showPreset && ( -
+
{t('feature.moderation.modal.content.preset', { ns: 'appDebug' })} {t('feature.moderation.modal.content.supportMarkdown', { ns: 'appDebug' })} @@ -57,7 +57,7 @@ const ModerationContent: FC = ({ placeholder={t('feature.moderation.modal.content.placeholder', { ns: 'appDebug' }) || ''} onChange={e => handleConfigChange('preset_response', e.target.value)} /> -
+
{(config.preset_response || '').length} / 100 diff --git a/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx b/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx index 3bc41b23cc..0b22e7c12f 100644 --- a/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx +++ b/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx @@ -238,8 +238,8 @@ const VoiceParamConfig = ({
{ + checked={text2speech?.autoPlay === TtsAutoPlay.enabled} + onCheckedChange={(value: boolean) => { handleChange({ autoPlay: value ? TtsAutoPlay.enabled : TtsAutoPlay.disabled, }) diff --git a/web/app/components/base/param-item/index.tsx b/web/app/components/base/param-item/index.tsx index 56999fc6ea..fcd0517630 100644 --- a/web/app/components/base/param-item/index.tsx +++ b/web/app/components/base/param-item/index.tsx @@ -37,13 +37,13 @@ const ParamItem: FC = ({ className, id, name, noTooltip, tip, step = 0.1, { + checked={enable} + onCheckedChange={async (val) => { onSwitchChange?.(id, val) }} /> )} - {name} + {name} {!noTooltip && ( switchElement.querySelector('span') describe('Switch', () => { - it('should render in unchecked state when value is false', () => { - render() + it('should render in unchecked state when checked is false', () => { + render() const switchElement = screen.getByRole('switch') expect(switchElement).toBeInTheDocument() expect(switchElement).toHaveAttribute('aria-checked', 'false') expect(switchElement).not.toHaveAttribute('data-checked') }) - it('should render in checked state when value is true', () => { - render() + it('should render in checked state when checked is true', () => { + render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveAttribute('aria-checked', 'true') expect(switchElement).toHaveAttribute('data-checked', '') }) - it('should call onChange with next value when clicked', async () => { - const onChange = vi.fn() + it('should call onCheckedChange with next value when clicked', async () => { + const onCheckedChange = vi.fn() const user = userEvent.setup() - render() + render() const switchElement = screen.getByRole('switch') await user.click(switchElement) - expect(onChange).toHaveBeenCalledWith(true) - expect(onChange).toHaveBeenCalledTimes(1) + expect(onCheckedChange).toHaveBeenCalledWith(true) + expect(onCheckedChange).toHaveBeenCalledTimes(1) expect(switchElement).toHaveAttribute('aria-checked', 'false') }) - it('should work in controlled mode with value prop', async () => { - const onChange = vi.fn() + it('should work in controlled mode with checked prop', async () => { + const onCheckedChange = vi.fn() const user = userEvent.setup() - const { rerender } = render() + const { rerender } = render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveAttribute('aria-checked', 'false') await user.click(switchElement) - expect(onChange).toHaveBeenCalledWith(true) + expect(onCheckedChange).toHaveBeenCalledWith(true) expect(switchElement).toHaveAttribute('aria-checked', 'false') - rerender() + rerender() expect(switchElement).toHaveAttribute('aria-checked', 'true') }) - it('should not call onChange when disabled', async () => { - const onChange = vi.fn() + it('should not call onCheckedChange when disabled', async () => { + const onCheckedChange = vi.fn() const user = userEvent.setup() - render() + render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveClass('data-disabled:cursor-not-allowed') expect(switchElement).toHaveAttribute('data-disabled', '') await user.click(switchElement) - expect(onChange).not.toHaveBeenCalled() + expect(onCheckedChange).not.toHaveBeenCalled() }) it('should apply correct size classes', () => { - const { rerender } = render() + const { rerender } = render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveClass('h-2.5', 'w-3.5', 'rounded-xs') - rerender() + rerender() expect(switchElement).toHaveClass('h-3', 'w-5') - rerender() + rerender() expect(switchElement).toHaveClass('h-4', 'w-7') - rerender() + rerender() expect(switchElement).toHaveClass('h-5', 'w-9') }) it('should apply custom className', () => { - render() + render() expect(screen.getByRole('switch')).toHaveClass('custom-test-class') }) it('should expose checked state styling hooks on the root and thumb', () => { - const { rerender } = render() + const { rerender } = render() const switchElement = screen.getByRole('switch') const thumb = getThumb(switchElement) @@ -94,13 +94,13 @@ describe('Switch', () => { expect(thumb).toHaveClass('data-checked:translate-x-[14px]') expect(thumb).not.toHaveAttribute('data-checked') - rerender() + rerender() expect(switchElement).toHaveAttribute('data-checked', '') expect(thumb).toHaveAttribute('data-checked', '') }) it('should expose disabled state styling hooks instead of relying on opacity', () => { - const { rerender } = render() + const { rerender } = render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveClass( @@ -109,28 +109,28 @@ describe('Switch', () => { ) expect(switchElement).toHaveAttribute('data-disabled', '') - rerender() + rerender() expect(switchElement).toHaveAttribute('data-disabled', '') expect(switchElement).toHaveAttribute('data-checked', '') }) it('should have focus-visible ring-3 styles', () => { - render() + render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveClass('focus-visible:ring-2') }) it('should respect prefers-reduced-motion', () => { - render() + render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveClass('motion-reduce:transition-none') }) describe('loading state', () => { it('should render as disabled when loading', async () => { - const onChange = vi.fn() + const onCheckedChange = vi.fn() const user = userEvent.setup() - render() + render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveClass('data-disabled:cursor-not-allowed') @@ -138,32 +138,32 @@ describe('Switch', () => { expect(switchElement).toHaveAttribute('data-disabled', '') await user.click(switchElement) - expect(onChange).not.toHaveBeenCalled() + expect(onCheckedChange).not.toHaveBeenCalled() }) it('should show spinner icon for md and lg sizes', () => { - const { rerender, container } = render() + const { rerender, container } = render() expect(container.querySelector('span[aria-hidden="true"] i')).toBeInTheDocument() - rerender() + rerender() expect(container.querySelector('span[aria-hidden="true"] i')).toBeInTheDocument() }) it('should not show spinner for xs and sm sizes', () => { - const { rerender, container } = render() + const { rerender, container } = render() expect(container.querySelector('span[aria-hidden="true"] i')).not.toBeInTheDocument() - rerender() + rerender() expect(container.querySelector('span[aria-hidden="true"] i')).not.toBeInTheDocument() }) it('should apply disabled data-state hooks when loading', () => { - const { rerender } = render() + const { rerender } = render() const switchElement = screen.getByRole('switch') expect(switchElement).toHaveAttribute('data-disabled', '') - rerender() + rerender() expect(switchElement).toHaveAttribute('data-disabled', '') expect(switchElement).toHaveAttribute('data-checked', '') }) diff --git a/web/app/components/base/switch/index.stories.tsx b/web/app/components/base/switch/index.stories.tsx index 141b815ab1..1b3a52dcc4 100644 --- a/web/app/components/base/switch/index.stories.tsx +++ b/web/app/components/base/switch/index.stories.tsx @@ -16,7 +16,7 @@ const meta = { }, tags: ['autodocs'], args: { - value: false, + checked: false, }, argTypes: { size: { @@ -24,7 +24,7 @@ const meta = { options: ['xs', 'sm', 'md', 'lg'], description: 'Switch size', }, - value: { + checked: { control: 'boolean', description: 'Checked state (controlled)', }, @@ -43,14 +43,14 @@ export default meta type Story = StoryObj const SwitchDemo = (args: any) => { - const [enabled, setEnabled] = useState(args.value ?? false) + const [enabled, setEnabled] = useState(args.checked ?? false) return (
{enabled ? 'On' : 'Off'} @@ -63,7 +63,7 @@ export const Default: Story = { render: args => , args: { size: 'md', - value: false, + checked: false, disabled: false, }, } @@ -72,7 +72,7 @@ export const DefaultOn: Story = { render: args => , args: { size: 'md', - value: true, + checked: true, disabled: false, }, } @@ -81,7 +81,7 @@ export const DisabledOff: Story = { render: args => , args: { size: 'md', - value: false, + checked: false, disabled: true, }, } @@ -90,7 +90,7 @@ export const DisabledOn: Story = { render: args => , args: { size: 'md', - value: true, + checked: true, disabled: true, }, } @@ -116,20 +116,20 @@ const AllStatesDemo = () => { {size}
- {}} /> - {}} /> + {}} /> + {}} />
- - + +
- - + +
@@ -165,19 +165,19 @@ const SizeComparisonDemo = () => { return (
- setStates({ ...states, xs: v })} /> + setStates({ ...states, xs: v })} /> Extra Small (xs) — 14×10
- setStates({ ...states, sm: v })} /> + setStates({ ...states, sm: v })} /> Small (sm) — 20×12
- setStates({ ...states, md: v })} /> + setStates({ ...states, md: v })} /> Regular (md) — 28×16
- setStates({ ...states, lg: v })} /> + setStates({ ...states, lg: v })} /> Large (lg) — 36×20
@@ -201,27 +201,27 @@ const LoadingDemo = () => {
- + Large unchecked
- + Large checked
- + Regular unchecked
- + Regular checked
- + Small (no spinner)
- + Extra Small (no spinner)
@@ -280,9 +280,9 @@ const MutationLoadingDemo = () => {
@@ -348,7 +348,7 @@ export const Playground: Story = { render: args => , args: { size: 'md', - value: false, + checked: false, disabled: false, loading: false, }, diff --git a/web/app/components/base/switch/index.tsx b/web/app/components/base/switch/index.tsx index 80f7c23817..942a2291d0 100644 --- a/web/app/components/base/switch/index.tsx +++ b/web/app/components/base/switch/index.tsx @@ -62,8 +62,8 @@ const spinnerSizeConfig: Partial void + 'checked': boolean + 'onCheckedChange'?: (checked: boolean) => void 'size'?: SwitchSize 'disabled'?: boolean 'loading'?: boolean @@ -75,8 +75,8 @@ type SwitchProps = { const Switch = ({ ref, - value, - onChange, + checked, + onCheckedChange, size = 'md', disabled = false, loading = false, @@ -93,8 +93,8 @@ const Switch = ({ return ( onChange?.(checked)} + checked={checked} + onCheckedChange={value => onCheckedChange?.(value)} disabled={isDisabled} aria-busy={loading || undefined} aria-label={ariaLabel} @@ -111,7 +111,7 @@ const Switch = ({ className={cn( 'absolute top-1/2 -translate-x-1/2 -translate-y-1/2', spinner.icon, - value ? spinner.checkedPosition : spinner.uncheckedPosition, + checked ? spinner.checkedPosition : spinner.uncheckedPosition, )} aria-hidden="true" > diff --git a/web/app/components/billing/pricing/plan-switcher/plan-range-switcher.tsx b/web/app/components/billing/pricing/plan-switcher/plan-range-switcher.tsx index b2a1ae3bf5..55700385d9 100644 --- a/web/app/components/billing/pricing/plan-switcher/plan-range-switcher.tsx +++ b/web/app/components/billing/pricing/plan-switcher/plan-range-switcher.tsx @@ -24,12 +24,12 @@ const PlanRangeSwitcher: FC = ({
{ + checked={value === PlanRange.yearly} + onCheckedChange={(v) => { onChange(v ? PlanRange.yearly : PlanRange.monthly) }} /> - + {t('plansCommon.annualBilling', { ns: 'billing', percent: 17 })}
diff --git a/web/app/components/custom/custom-web-app-brand/index.tsx b/web/app/components/custom/custom-web-app-brand/index.tsx index fecc630422..5dbb76f8c6 100644 --- a/web/app/components/custom/custom-web-app-brand/index.tsx +++ b/web/app/components/custom/custom-web-app-brand/index.tsx @@ -35,9 +35,9 @@ const CustomWebAppBrand = () => { {t('webapp.removeBrand', { ns: 'custom' })}
diff --git a/web/app/components/datasets/common/retrieval-param-config/__tests__/index.spec.tsx b/web/app/components/datasets/common/retrieval-param-config/__tests__/index.spec.tsx index db6086ca34..f5c85b518e 100644 --- a/web/app/components/datasets/common/retrieval-param-config/__tests__/index.spec.tsx +++ b/web/app/components/datasets/common/retrieval-param-config/__tests__/index.spec.tsx @@ -123,11 +123,11 @@ vi.mock('@/app/components/base/radio-card', () => ({ })) vi.mock('@/app/components/base/switch', () => ({ - default: ({ value, onChange }: { value: boolean, onChange?: (v: boolean) => void }) => ( + default: ({ checked, onCheckedChange }: { checked: boolean, onCheckedChange?: (v: boolean) => void }) => ( diff --git a/web/app/components/datasets/common/retrieval-param-config/index.tsx b/web/app/components/datasets/common/retrieval-param-config/index.tsx index c0cfe186a1..5fbe1db5b1 100644 --- a/web/app/components/datasets/common/retrieval-param-config/index.tsx +++ b/web/app/components/datasets/common/retrieval-param-config/index.tsx @@ -121,8 +121,8 @@ const RetrievalParamConfig: FC = ({ {canToggleRerankModalEnable && ( )}
diff --git a/web/app/components/datasets/documents/components/operations.tsx b/web/app/components/datasets/documents/components/operations.tsx index f585ab4654..e2bd6f7c92 100644 --- a/web/app/components/datasets/documents/components/operations.tsx +++ b/web/app/components/datasets/documents/components/operations.tsx @@ -154,18 +154,18 @@ const Operations = ({ embeddingAvailable, datasetId, detail, selectedIds, onSele }, [datasetId, downloadDocument, id, isDownloading, name, t]) return (
e.stopPropagation()}> - {isListScene && !embeddingAvailable && ()} + {isListScene && !embeddingAvailable && ()} {isListScene && embeddingAvailable && ( <> {archived ? (
- +
) - : handleSwitch(v ? 'enable' : 'disable')} size="md" />} + : handleSwitch(v ? 'enable' : 'disable')} size="md" />} )} diff --git a/web/app/components/datasets/documents/detail/completed/segment-card/index.tsx b/web/app/components/datasets/documents/detail/completed/segment-card/index.tsx index 31d894f109..c39c8ba10f 100644 --- a/web/app/components/datasets/documents/detail/completed/segment-card/index.tsx +++ b/web/app/components/datasets/documents/detail/completed/segment-card/index.tsx @@ -223,8 +223,8 @@ const SegmentCard: FC = ({ { + checked={enabled} + onCheckedChange={async (val) => { await onChangeSwitch?.(val, id) }} /> diff --git a/web/app/components/datasets/documents/status-item/index.tsx b/web/app/components/datasets/documents/status-item/index.tsx index aac7d1e4cf..362db58a90 100644 --- a/web/app/components/datasets/documents/status-item/index.tsx +++ b/web/app/components/datasets/documents/status-item/index.tsx @@ -85,7 +85,7 @@ const StatusItem = ({ status, reverse = false, scene = 'list', textCls = '', err {scene === 'detail' && (
- !archived && handleSwitch(v ? 'enable' : 'disable')} disabled={embedding || archived} size="md" /> + !archived && handleSwitch(v ? 'enable' : 'disable')} disabled={embedding || archived} size="md" />
)} diff --git a/web/app/components/datasets/extra-info/api-access/card.tsx b/web/app/components/datasets/extra-info/api-access/card.tsx index 9679efefda..0229922848 100644 --- a/web/app/components/datasets/extra-info/api-access/card.tsx +++ b/web/app/components/datasets/extra-info/api-access/card.tsx @@ -60,8 +60,8 @@ const Card = ({
diff --git a/web/app/components/datasets/metadata/metadata-dataset/dataset-metadata-drawer.tsx b/web/app/components/datasets/metadata/metadata-dataset/dataset-metadata-drawer.tsx index 0b0fc20ffe..421babfb91 100644 --- a/web/app/components/datasets/metadata/metadata-dataset/dataset-metadata-drawer.tsx +++ b/web/app/components/datasets/metadata/metadata-dataset/dataset-metadata-drawer.tsx @@ -211,8 +211,8 @@ const DatasetMetadataDrawer: FC = ({
{t(`${i18nPrefix}.builtIn`, { ns: 'dataset' })}
{t(`${i18nPrefix}.builtInDescription`, { ns: 'dataset' })}
} /> diff --git a/web/app/components/datasets/settings/summary-index-setting.tsx b/web/app/components/datasets/settings/summary-index-setting.tsx index 8ddae1d1fc..0a25f820c5 100644 --- a/web/app/components/datasets/settings/summary-index-setting.tsx +++ b/web/app/components/datasets/settings/summary-index-setting.tsx @@ -63,7 +63,7 @@ const SummaryIndexSetting = ({ return (
-
+
{t('form.summaryAutoGen', { ns: 'datasetSettings' })}
{ summaryIndexSetting?.enable && (
-
+
{t('form.summaryModel', { ns: 'datasetSettings' })}
-
+
{t('form.summaryInstructions', { ns: 'datasetSettings' })}