refactor(web): remove human input preview React.FC

web/app/components/workflow/nodes/human-input/components/__tests__/form-content-preview.spec.tsx

@@ -22,15 +22,6 @@ vi.mock('@/app/components/workflow/store/workflow/use-nodes', () => ({
   default: () => mockUseNodes(),
 }))
 
-vi.mock('@/app/components/base/action-button', () => ({
-  __esModule: true,
-  default: ({ children, onClick }: { children?: ReactNode; onClick?: () => void }) => (
-    <button type="button" aria-label="close-preview" onClick={onClick}>
-      {children}
-    </button>
-  ),
-}))
-
 vi.mock('@/app/components/base/badge', () => ({
   __esModule: true,
   default: ({ children }: { children?: ReactNode }) => <div data-testid="badge">{children}</div>,
@@ -140,7 +131,7 @@ describe('FormContentPreview', () => {
       <FormContentPreview content="content" formInputs={[]} userActions={[]} onClose={onClose} />,
     )
 
-    fireEvent.click(screen.getByRole('button', { name: 'close-preview' }))
+    fireEvent.click(screen.getByRole('button', { name: 'operation.close' }))
 
     expect(onClose).toHaveBeenCalledTimes(1)
   })

web/app/components/workflow/nodes/human-input/components/form-content-preview.tsx

@@ -1,5 +1,4 @@
 'use client'
-import type { FC } from 'react'
 import type { FormInputItem, UserAction } from '../types'
 import { Button } from '@langgenius/dify-ui/button'
 import * as React from 'react'
@@ -22,12 +21,12 @@ type FormContentPreviewProps = {
   onClose: () => void
 }
 
-const FormContentPreview: FC<FormContentPreviewProps> = ({
+const FormContentPreview = ({
   content,
   formInputs,
   userActions,
   onClose,
-}) => {
+}: FormContentPreviewProps) => {
   const { t } = useTranslation()
   const panelWidth = useStore((state) => state.panelWidth)
   const nodes = useNodes()
@@ -69,8 +68,11 @@ const FormContentPreview: FC<FormContentPreviewProps> = ({
         <Badge uppercase className="border-text-accent-secondary text-text-accent-secondary">
           {t(($) => $[`${i18nPrefix}.formContent.preview`], { ns: 'workflow' })}
         </Badge>
-        <ActionButton onClick={onClose}>
-          <span className="i-ri-close-line size-5 text-text-tertiary" />
+        <ActionButton
+          aria-label={t(($) => $['operation.close'], { ns: 'common' })}
+          onClick={onClose}
+        >
+          <span aria-hidden className="i-ri-close-line size-5 text-text-tertiary" />
         </ActionButton>
       </div>
       <div className="max-h-[calc(100vh-167px)] overflow-y-auto px-4">