+
+ {locale === 'zh-Hans' ? form.label['zh-Hans'] : form.label['en-US']}
+
+ {
+ form.type === 'text-input' && (
+
handleFormChange(form.variable, e.target.value)}
+ />
+ )
+ }
+ {
+ form.type === 'paragraph' && (
+
+
+ )
+ }
+ {
+ form.type === 'select' && (
+
{
+ return {
+ name: option.label[locale === 'zh-Hans' ? 'zh-Hans' : 'en-US'],
+ value: option.value,
+ }
+ })}
+ onSelect={item => handleFormChange(form.variable, item.value as string)}
+ popupClassName='w-[576px] !z-[102]'
+ />
+ )
+ }
+
+ ))
+ }
+ >
+ )
+}
+
+export default FormGeneration
diff --git a/web/app/components/app/configuration/toolbox/moderation/index.tsx b/web/app/components/app/configuration/toolbox/moderation/index.tsx
new file mode 100644
index 0000000000..9eb14e98d2
--- /dev/null
+++ b/web/app/components/app/configuration/toolbox/moderation/index.tsx
@@ -0,0 +1,80 @@
+import { useTranslation } from 'react-i18next'
+import useSWR from 'swr'
+import { useContext } from 'use-context-selector'
+import { FileSearch02 } from '@/app/components/base/icons/src/vender/solid/files'
+import { Settings01 } from '@/app/components/base/icons/src/vender/line/general'
+import { useModalContext } from '@/context/modal-context'
+import ConfigContext from '@/context/debug-configuration'
+import { fetchCodeBasedExtensionList } from '@/service/common'
+import I18n from '@/context/i18n'
+const Moderation = () => {
+ const { t } = useTranslation()
+ const { setShowModerationSettingModal } = useModalContext()
+ const { locale } = useContext(I18n)
+ const {
+ moderationConfig,
+ setModerationConfig,
+ } = useContext(ConfigContext)
+ const { data: codeBasedExtensionList } = useSWR(
+ '/code-based-extension?module=moderation',
+ fetchCodeBasedExtensionList,
+ )
+
+ const handleOpenModerationSettingModal = () => {
+ setShowModerationSettingModal({
+ payload: moderationConfig,
+ onSaveCallback: setModerationConfig,
+ })
+ }
+
+ const renderInfo = () => {
+ let prefix = ''
+ let suffix = ''
+ if (moderationConfig.type === 'openai_moderation')
+ prefix = t('appDebug.feature.moderation.modal.provider.openai')
+ else if (moderationConfig.type === 'keywords')
+ prefix = t('appDebug.feature.moderation.modal.provider.keywords')
+ else if (moderationConfig.type === 'api')
+ prefix = t('common.apiBasedExtension.selector.title')
+ else
+ prefix = codeBasedExtensionList?.data.find(item => item.name === moderationConfig.type)?.label[locale] || ''
+
+ if (moderationConfig.config?.inputs_config?.enabled && moderationConfig.config?.outputs_config?.enabled)
+ suffix = t('appDebug.feature.moderation.allEnabled')
+ else if (moderationConfig.config?.inputs_config?.enabled)
+ suffix = t('appDebug.feature.moderation.inputEnabled')
+ else if (moderationConfig.config?.outputs_config?.enabled)
+ suffix = t('appDebug.feature.moderation.outputEnabled')
+
+ return `${prefix} · ${suffix}`
+ }
+
+ return (
+