feat: tailwind related improvement (#6085)

web/app/components/app/annotation/batch-add-annotation-modal/csv-uploader.tsx

@@ -1,10 +1,10 @@
 'use client'
 import type { FC } from 'react'
 import React, { useEffect, useRef, useState } from 'react'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import { RiDeleteBinLine } from '@remixicon/react'
+import cn from '@/utils/classnames'
 import { Csv as CSVIcon } from '@/app/components/base/icons/src/public/files'
 import { ToastContext } from '@/app/components/base/toast'
 import Button from '@/app/components/base/button'

web/app/components/app/annotation/edit-annotation-modal/edit-item/index.tsx

@@ -3,8 +3,8 @@ import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import Textarea from 'rc-textarea'
-import cn from 'classnames'
 import { RiDeleteBinLine } from '@remixicon/react'
+import cn from '@/utils/classnames'
 import { Robot, User } from '@/app/components/base/icons/src/public/avatar'
 import { Edit04 } from '@/app/components/base/icons/src/vender/line/general'
 import { Edit04 as EditSolid } from '@/app/components/base/icons/src/vender/solid/general'

web/app/components/app/annotation/header-opts/index.tsx

@@ -2,7 +2,6 @@
 import type { FC } from 'react'
 import React, { Fragment, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import {
   RiAddLine,
 } from '@remixicon/react'
@@ -16,6 +15,7 @@ import AddAnnotationModal from '../add-annotation-modal'
 import type { AnnotationItemBasic } from '../type'
 import BatchAddModal from '../batch-add-annotation-modal'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import CustomPopover from '@/app/components/base/popover'
 import { FileDownload02, FilePlus02 } from '@/app/components/base/icons/src/vender/line/files'
 import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows'

web/app/components/app/annotation/index.tsx

@@ -4,7 +4,6 @@ import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Pagination } from 'react-headless-pagination'
 import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/24/outline'
-import cn from 'classnames'
 import Toast from '../../base/toast'
 import Filter from './filter'
 import type { QueryParam } from './filter'
@@ -14,6 +13,7 @@ import HeaderOpts from './header-opts'
 import s from './style.module.css'
 import { AnnotationEnableStatus, type AnnotationItem, type AnnotationItemBasic, JobStatus } from './type'
 import ViewAnnotationModal from './view-annotation-modal'
+import cn from '@/utils/classnames'
 import Switch from '@/app/components/base/switch'
 import { addAnnotation, delAnnotation, fetchAnnotationConfig as doFetchAnnotationConfig, editAnnotation, fetchAnnotationList, queryAnnotationJobStatus, updateAnnotationScore, updateAnnotationStatus } from '@/service/annotation'
 import Loading from '@/app/components/base/loading'

web/app/components/app/annotation/list.tsx

@@ -2,12 +2,12 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import { RiDeleteBinLine } from '@remixicon/react'
 import { Edit02 } from '../../base/icons/src/vender/line/general'
 import s from './style.module.css'
 import type { AnnotationItem } from './type'
 import RemoveAnnotationConfirmModal from './remove-annotation-confirm-modal'
+import cn from '@/utils/classnames'
 import useTimestamp from '@/hooks/use-timestamp'
 
 type Props = {

web/app/components/app/annotation/view-annotation-modal/index.tsx

@@ -2,13 +2,13 @@
 import type { FC } from 'react'
 import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import { Pagination } from 'react-headless-pagination'
 import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/24/outline'
 import EditItem, { EditItemType } from '../edit-annotation-modal/edit-item'
 import type { AnnotationItem, HitHistoryItem } from '../type'
 import s from './style.module.css'
 import HitHistoryNoData from './hit-history-no-data'
+import cn from '@/utils/classnames'
 import Drawer from '@/app/components/base/drawer-plus'
 import { MessageCheckRemove } from '@/app/components/base/icons/src/vender/line/communication'
 import DeleteConfirmModal from '@/app/components/base/modal/delete-confirm-modal'

web/app/components/app/app-publisher/suggested-action.tsx

@@ -1,5 +1,5 @@
 import type { HTMLProps, PropsWithChildren } from 'react'
-import classNames from 'classnames'
+import classNames from '@/utils/classnames'
 import { ArrowUpRight } from '@/app/components/base/icons/src/vender/line/arrows'
 
 export type SuggestedActionProps = PropsWithChildren<HTMLProps<HTMLAnchorElement> & {

web/app/components/app/configuration/base/feature-panel/index.tsx

@@ -1,7 +1,7 @@
 'use client'
 import type { FC, ReactNode } from 'react'
 import React from 'react'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 import ParamsConfig from '@/app/components/app/configuration/config-voice/param-config'
 
 export type IFeaturePanelProps = {
@@ -46,7 +46,7 @@ const FeaturePanel: FC<IFeaturePanelProps> = ({
           <div className='flex gap-2 items-center'>
             {headerRight && <div>{headerRight}</div>}
             {isShowTextToSpeech && <div className='flex items-center'>
-              <ParamsConfig/>
+              <ParamsConfig />
             </div>}
           </div>
         </div>

web/app/components/app/configuration/base/icons/remove-icon/index.tsx

@@ -1,6 +1,6 @@
 'use client'
 import React, { useState } from 'react'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 
 type IRemoveIconProps = {
   className?: string

web/app/components/app/configuration/base/operation-btn/index.tsx

@@ -3,7 +3,7 @@ import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
 import { PlusIcon } from '@heroicons/react/20/solid'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 
 export type IOperationBtnProps = {
   className?: string

web/app/components/app/configuration/config-prompt/advanced-prompt-input.tsx

@@ -2,7 +2,6 @@
 import type { FC } from 'react'
 import React from 'react'
 import copy from 'copy-to-clipboard'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import { useBoolean } from 'ahooks'
@@ -16,6 +15,7 @@ import s from './style.module.css'
 import MessageTypeSelector from './message-type-selector'
 import ConfirmAddVar from './confirm-add-var'
 import PromptEditorHeightResizeWrap from './prompt-editor-height-resize-wrap'
+import cn from '@/utils/classnames'
 import type { PromptRole, PromptVariable } from '@/models/debug'
 import {
   Clipboard,

web/app/components/app/configuration/config-prompt/message-type-selector.tsx

@@ -2,7 +2,7 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useBoolean, useClickAway } from 'ahooks'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 import { PromptRole } from '@/models/debug'
 import { ChevronSelectorVertical } from '@/app/components/base/icons/src/vender/line/arrows'
 type Props = {

web/app/components/app/configuration/config-prompt/prompt-editor-height-resize-wrap.tsx

@@ -2,7 +2,7 @@
 import React, { useCallback, useEffect, useState } from 'react'
 import type { FC } from 'react'
 import { useDebounceFn } from 'ahooks'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 
 type Props = {
   className?: string

web/app/components/app/configuration/config-prompt/simple-prompt-input.tsx

@@ -3,7 +3,6 @@ import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useBoolean } from 'ahooks'
-import cn from 'classnames'
 import {
   RiQuestionLine,
 } from '@remixicon/react'
@@ -12,6 +11,7 @@ import { useContext } from 'use-context-selector'
 import ConfirmAddVar from './confirm-add-var'
 import s from './style.module.css'
 import PromptEditorHeightResizeWrap from './prompt-editor-height-resize-wrap'
+import cn from '@/utils/classnames'
 import { type PromptVariable } from '@/models/debug'
 import Tooltip from '@/app/components/base/tooltip'
 import { AppType } from '@/types/app'

web/app/components/app/configuration/config-var/select-type-item/index.tsx

@@ -2,8 +2,8 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import type { InputVarType } from '@/app/components/workflow/types'
 import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon'
 export type ISelectTypeItemProps = {

web/app/components/app/configuration/config-var/select-var-type.tsx

@@ -1,8 +1,8 @@
 'use client'
 import type { FC } from 'react'
 import React, { useState } from 'react'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
+import cn from '@/utils/classnames'
 import OperationBtn from '@/app/components/app/configuration/base/operation-btn'
 import {
   PortalToFollowElem,

web/app/components/app/configuration/config-vision/param-config.tsx

@@ -2,8 +2,8 @@
 import type { FC } from 'react'
 import { memo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import VoiceParamConfig from './param-config-content'
+import cn from '@/utils/classnames'
 import { Settings01 } from '@/app/components/base/icons/src/vender/line/general'
 import {
   PortalToFollowElem,

web/app/components/app/configuration/config-vision/radio-group/index.tsx

@@ -1,8 +1,8 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import cn from 'classnames'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 
 type OPTION = {
   label: string

web/app/components/app/configuration/config-voice/param-config-content.tsx

@@ -3,7 +3,6 @@ import useSWR from 'swr'
 import type { FC } from 'react'
 import { useContext } from 'use-context-selector'
 import React, { Fragment } from 'react'
-import classNames from 'classnames'
 import {
   RiQuestionLine,
 } from '@remixicon/react'
@@ -11,6 +10,7 @@ import { usePathname } from 'next/navigation'
 import { useTranslation } from 'react-i18next'
 import { Listbox, Transition } from '@headlessui/react'
 import { CheckIcon, ChevronDownIcon } from '@heroicons/react/20/solid'
+import classNames from '@/utils/classnames'
 import RadioGroup from '@/app/components/app/configuration/config-vision/radio-group'
 import type { Item } from '@/app/components/base/select'
 import ConfigContext from '@/context/debug-configuration'
@@ -109,7 +109,7 @@ const VoiceParamConfig: FC = () => {
                                   'absolute inset-y-0 right-0 flex items-center pr-4 text-gray-700',
                                 )}
                               >
-                                <CheckIcon className="h-5 w-5" aria-hidden="true"/>
+                                <CheckIcon className="h-5 w-5" aria-hidden="true" />
                               </span>
                             )}
                           </>
@@ -174,7 +174,7 @@ const VoiceParamConfig: FC = () => {
                                   'absolute inset-y-0 right-0 flex items-center pr-4 text-gray-700',
                                 )}
                               >
-                                <CheckIcon className="h-5 w-5" aria-hidden="true"/>
+                                <CheckIcon className="h-5 w-5" aria-hidden="true" />
                               </span>
                             )}
                           </>

web/app/components/app/configuration/config-voice/param-config.tsx

@@ -2,8 +2,8 @@
 import type { FC } from 'react'
 import { memo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import VoiceParamConfig from './param-config-content'
+import cn from '@/utils/classnames'
 import { Settings01 } from '@/app/components/base/icons/src/vender/line/general'
 import {
   PortalToFollowElem,

web/app/components/app/configuration/config/agent/agent-setting/item-panel.tsx

@@ -1,8 +1,8 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import cn from 'classnames'
 import { RiQuestionLine } from '@remixicon/react'
+import cn from '@/utils/classnames'
 import Tooltip from '@/app/components/base/tooltip'
 type Props = {
   className?: string

web/app/components/app/configuration/config/agent/agent-tools/index.tsx

@@ -2,7 +2,6 @@
 import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import { useContext } from 'use-context-selector'
 import produce from 'immer'
 import {
@@ -12,6 +11,7 @@ import {
 } from '@remixicon/react'
 import { useFormattingChangedDispatcher } from '../../../debug/hooks'
 import SettingBuiltInTool from './setting-built-in-tool'
+import cn from '@/utils/classnames'
 import Panel from '@/app/components/app/configuration/base/feature-panel'
 import Tooltip from '@/app/components/base/tooltip'
 import { InfoCircle } from '@/app/components/base/icons/src/vender/line/general'

web/app/components/app/configuration/config/agent/agent-tools/setting-built-in-tool.tsx

@@ -3,7 +3,7 @@ import type { FC } from 'react'
 import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 import Drawer from '@/app/components/base/drawer-plus'
 import Form from '@/app/components/header/account-setting/model-provider-page/model-modal/Form'
 import { addDefaultValue, toolParametersToFormSchemas } from '@/app/components/tools/utils/to-form-schema'

web/app/components/app/configuration/config/agent/prompt-editor.tsx

@@ -2,9 +2,9 @@
 import type { FC } from 'react'
 import React from 'react'
 import copy from 'copy-to-clipboard'
-import cn from 'classnames'
 import { useContext } from 'use-context-selector'
 import { useTranslation } from 'react-i18next'
+import cn from '@/utils/classnames'
 import {
   Clipboard,
   ClipboardCheck,

web/app/components/app/configuration/config/assistant-type-picker/index.tsx

@@ -2,9 +2,9 @@
 import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import { RiArrowDownSLine } from '@remixicon/react'
 import AgentSetting from '../agent/agent-setting'
+import cn from '@/utils/classnames'
 import {
   PortalToFollowElem,
   PortalToFollowElemContent,

web/app/components/app/configuration/config/feature/choose-feature/feature-item/index.tsx

@@ -1,8 +1,8 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import cn from 'classnames'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import Switch from '@/app/components/base/switch'
 
 export type IFeatureItemProps = {

web/app/components/app/configuration/dataset-config/card-item/index.tsx

@@ -1,11 +1,11 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import TypeIcon from '../type-icon'
 import RemoveIcon from '../../base/icons/remove-icon'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import type { DataSet } from '@/models/datasets'
 import { formatNumber } from '@/utils/format'
 import Tooltip from '@/app/components/base/tooltip'

web/app/components/app/configuration/dataset-config/context-var/index.tsx

@@ -2,12 +2,12 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import {
   RiQuestionLine,
 } from '@remixicon/react'
 import type { Props } from './var-picker'
 import VarPicker from './var-picker'
+import cn from '@/utils/classnames'
 import { BracketsX } from '@/app/components/base/icons/src/vender/line/development'
 import Tooltip from '@/app/components/base/tooltip'
 
@@ -20,7 +20,7 @@ const ContextVar: FC<Props> = (props) => {
     <div className={cn(notSetVar ? 'rounded-bl-xl rounded-br-xl bg-[#FEF0C7] border-[#FEF0C7]' : 'border-gray-200', 'flex justify-between items-center h-12 px-3 border-t ')}>
       <div className='flex items-center space-x-1 shrink-0'>
         <div className='p-1'>
-          <BracketsX className='w-4 h-4 text-primary-500'/>
+          <BracketsX className='w-4 h-4 text-primary-500' />
         </div>
         <div className='mr-1 text-sm font-medium text-gray-800'>{t('appDebug.feature.dataSet.queryVariable.title')}</div>
         <Tooltip
@@ -29,7 +29,7 @@ const ContextVar: FC<Props> = (props) => {
           </div>}
           selector='context-var-tooltip'
         >
-          <RiQuestionLine className='w-3.5 h-3.5 text-gray-400'/>
+          <RiQuestionLine className='w-3.5 h-3.5 text-gray-400' />
         </Tooltip>
       </div>
 

web/app/components/app/configuration/dataset-config/context-var/var-picker.tsx

@@ -3,8 +3,8 @@ import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ChevronDownIcon } from '@heroicons/react/24/outline'
-import cn from 'classnames'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import {
   PortalToFollowElem,
   PortalToFollowElemContent,

web/app/components/app/configuration/dataset-config/params-config/index.tsx

@@ -3,8 +3,8 @@ import type { FC } from 'react'
 import { memo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
-import cn from 'classnames'
 import ConfigContent from './config-content'
+import cn from '@/utils/classnames'
 import { Settings04 } from '@/app/components/base/icons/src/vender/line/general'
 import ConfigContext from '@/context/debug-configuration'
 import Modal from '@/app/components/base/modal'

web/app/components/app/configuration/dataset-config/select-dataset/index.tsx

@@ -2,12 +2,12 @@
 import type { FC } from 'react'
 import React, { useRef, useState } from 'react'
 import { useGetState, useInfiniteScroll } from 'ahooks'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import Link from 'next/link'
 import produce from 'immer'
 import TypeIcon from '../type-icon'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import Modal from '@/app/components/base/modal'
 import type { DataSet } from '@/models/datasets'
 import Button from '@/app/components/base/button'

web/app/components/app/configuration/dataset-config/settings-modal/index.tsx

@@ -2,9 +2,9 @@ import type { FC } from 'react'
 import { useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { isEqual } from 'lodash-es'
-import cn from 'classnames'
 import { RiCloseLine } from '@remixicon/react'
 import { BookOpenIcon } from '@heroicons/react/24/outline'
+import cn from '@/utils/classnames'
 import IndexMethodRadio from '@/app/components/datasets/settings/index-method-radio'
 import Button from '@/app/components/base/button'
 import type { DataSet } from '@/models/datasets'

web/app/components/app/configuration/features/chat-group/opening-statement/index.tsx

@@ -2,7 +2,6 @@
 'use client'
 import type { FC } from 'react'
 import React, { useEffect, useRef, useState } from 'react'
-import cn from 'classnames'
 import {
   RiAddLine,
   RiDeleteBinLine,
@@ -12,6 +11,7 @@ import produce from 'immer'
 import { useTranslation } from 'react-i18next'
 import { useBoolean } from 'ahooks'
 import { ReactSortable } from 'react-sortablejs'
+import cn from '@/utils/classnames'
 import ConfigContext from '@/context/debug-configuration'
 import Panel from '@/app/components/app/configuration/base/feature-panel'
 import Button from '@/app/components/base/button'

web/app/components/app/configuration/toolbox/annotation/annotation-ctrl-btn/index.tsx

@@ -2,8 +2,8 @@
 import type { FC } from 'react'
 import React, { useRef, useState } from 'react'
 import { useHover } from 'ahooks'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
+import cn from '@/utils/classnames'
 import { MessageCheckRemove, MessageFastPlus } from '@/app/components/base/icons/src/vender/line/communication'
 import { MessageFast } from '@/app/components/base/icons/src/vender/solid/communication'
 import { Edit04 } from '@/app/components/base/icons/src/vender/line/general'

web/app/components/app/configuration/toolbox/score-slider/base-slider/index.tsx

@@ -1,6 +1,6 @@
 import ReactSlider from 'react-slider'
-import cn from 'classnames'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 
 type ISliderProps = {
   className?: string

web/app/components/app/create-app-dialog/newAppDialog.tsx

@@ -1,7 +1,7 @@
 import { Fragment, useCallback } from 'react'
 import type { ReactNode } from 'react'
 import { Dialog, Transition } from '@headlessui/react'
-import cn from 'classnames'
+import cn from '@/utils/classnames'
 
 type DialogProps = {
   className?: string

web/app/components/app/create-app-modal/index.tsx

@@ -2,7 +2,6 @@
 import type { MouseEventHandler } from 'react'
 import { useCallback, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import {
   RiCloseLine,
   RiQuestionLine,
@@ -10,6 +9,7 @@ import {
 import { useRouter } from 'next/navigation'
 import { useContext, useContextSelector } from 'use-context-selector'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import AppsContext, { useAppContext } from '@/context/app-context'
 import { useProviderContext } from '@/context/provider-context'
 import { ToastContext } from '@/app/components/base/toast'

web/app/components/app/create-from-dsl-modal/uploader.tsx

@@ -1,12 +1,12 @@
 'use client'
 import type { FC } from 'react'
 import React, { useEffect, useRef, useState } from 'react'
-import cn from 'classnames'
 import {
   RiDeleteBinLine,
 } from '@remixicon/react'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
+import cn from '@/utils/classnames'
 import { Yaml as YamlIcon } from '@/app/components/base/icons/src/public/files'
 import { ToastContext } from '@/app/components/base/toast'
 import { UploadCloud01 } from '@/app/components/base/icons/src/vender/line/general'
@@ -98,13 +98,13 @@ const Uploader: FC<Props> = ({
         {!file && (
           <div className={cn('flex items-center h-20 rounded-xl bg-gray-50 border border-dashed border-gray-200 text-sm font-normal', dragging && 'bg-[#F5F8FF] border border-[#B2CCFF]')}>
             <div className='w-full flex items-center justify-center space-x-2'>
-              <UploadCloud01 className='w-6 h-6 mr-2'/>
+              <UploadCloud01 className='w-6 h-6 mr-2' />
               <div className='text-gray-500'>
                 {t('datasetCreation.stepOne.uploader.button')}
                 <span className='pl-1 text-[#155eef] cursor-pointer' onClick={selectHandle}>{t('datasetDocuments.list.batchModal.browse')}</span>
               </div>
             </div>
-            {dragging && <div ref={dragRef} className='absolute w-full h-full top-0 left-0'/>}
+            {dragging && <div ref={dragRef} className='absolute w-full h-full top-0 left-0' />}
           </div>
         )}
         {file && (

web/app/components/app/duplicate-modal/index.tsx

@@ -1,8 +1,8 @@
 'use client'
 import React, { useState } from 'react'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import Modal from '@/app/components/base/modal'
 import Button from '@/app/components/base/button'
 import Toast from '@/app/components/base/toast'

web/app/components/app/log-annotation/index.tsx

@@ -1,9 +1,9 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import { useRouter } from 'next/navigation'
+import cn from '@/utils/classnames'
 import Log from '@/app/components/app/log'
 import WorkflowLog from '@/app/components/app/workflow-log'
 import Annotation from '@/app/components/app/annotation'

web/app/components/app/log/list.tsx

@@ -17,9 +17,9 @@ import timezone from 'dayjs/plugin/timezone'
 import { createContext, useContext } from 'use-context-selector'
 import { useShallow } from 'zustand/react/shallow'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import s from './style.module.css'
 import VarPanel from './var-panel'
+import cn from '@/utils/classnames'
 import { randomString } from '@/utils'
 import type { FeedbackFunc, Feedbacktype, IChatItem, SubmitAnnotationFunc } from '@/app/components/base/chat/chat/type'
 import type { Annotation, ChatConversationFullDetailResponse, ChatConversationGeneralDetail, ChatConversationsResponse, ChatMessage, ChatMessagesRequest, CompletionConversationFullDetailResponse, CompletionConversationGeneralDetail, CompletionConversationsResponse, LogAnnotation } from '@/models/log'

web/app/components/app/overview/apikey-info-panel/index.tsx

@@ -2,8 +2,8 @@
 import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import { RiCloseLine } from '@remixicon/react'
+import cn from '@/utils/classnames'
 import Button from '@/app/components/base/button'
 import { LinkExternal02 } from '@/app/components/base/icons/src/vender/line/general'
 import { IS_CE_EDITION } from '@/config'

web/app/components/app/overview/apikey-info-panel/progress/index.tsx

@@ -1,8 +1,8 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import cn from 'classnames'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 
 export type IProgressProps = {
   className?: string

web/app/components/app/overview/embedded/index.tsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import copy from 'copy-to-clipboard'
 import style from './style.module.css'
+import cn from '@/utils/classnames'
 import Modal from '@/app/components/base/modal'
 import copyStyle from '@/app/components/base/copy-btn/style.module.css'
 import Tooltip from '@/app/components/base/tooltip'

web/app/components/app/switch-app-modal/index.tsx

@@ -4,9 +4,9 @@ import { useEffect, useState } from 'react'
 import { useRouter } from 'next/navigation'
 import { useContext } from 'use-context-selector'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import { RiCloseLine } from '@remixicon/react'
 import s from './style.module.css'
+import cn from '@/utils/classnames'
 import Button from '@/app/components/base/button'
 import Modal from '@/app/components/base/modal'
 import Confirm from '@/app/components/base/confirm'

web/app/components/app/text-generate/item/index.tsx

@@ -2,7 +2,6 @@
 import type { FC } from 'react'
 import React, { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import {
   RiClipboardLine,
 } from '@remixicon/react'
@@ -12,6 +11,7 @@ import { HandThumbDownIcon, HandThumbUpIcon } from '@heroicons/react/24/outline'
 import { useBoolean } from 'ahooks'
 import { HashtagIcon } from '@heroicons/react/24/solid'
 import ResultTab from './result-tab'
+import cn from '@/utils/classnames'
 import { Markdown } from '@/app/components/base/markdown'
 import Loading from '@/app/components/base/loading'
 import Toast from '@/app/components/base/toast'

web/app/components/app/text-generate/item/result-tab.tsx

@@ -2,8 +2,8 @@ import {
   memo,
   useEffect,
 } from 'react'
-import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
+import cn from '@/utils/classnames'
 // import Loading from '@/app/components/base/loading'
 import { Markdown } from '@/app/components/base/markdown'
 import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'

web/app/components/app/text-generate/saved-items/index.tsx

@@ -2,9 +2,9 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import copy from 'copy-to-clipboard'
 import NoData from './no-data'
+import cn from '@/utils/classnames'
 import type { SavedMessage } from '@/models/debug'
 import { Markdown } from '@/app/components/base/markdown'
 import { SimpleBtn, copyIcon } from '@/app/components/app/text-generate/item'

web/app/components/app/type-selector/index.tsx

@@ -1,7 +1,7 @@
 import { useTranslation } from 'react-i18next'
 import React, { useState } from 'react'
-import cn from 'classnames'
 import { RiArrowDownSLine } from '@remixicon/react'
+import cn from '@/utils/classnames'
 import {
   PortalToFollowElem,
   PortalToFollowElemContent,
@@ -100,7 +100,7 @@ const AppTypeSelector = ({ value, onChange }: AppSelectorProps) => {
             }}>
               <ChatBot className='mr-2 w-4 h-4 text-[#1570EF]' />
               <div className='grow text-gray-700 text-[13px] font-medium leading-[18px]'>{t('app.typeSelector.chatbot')}</div>
-              {value === 'chatbot' && <Check className='w-4 h-4 text-primary-600'/>}
+              {value === 'chatbot' && <Check className='w-4 h-4 text-primary-600' />}
             </div>
             <div className='flex items-center pl-3 py-[6px] pr-2 rounded-lg cursor-pointer hover:bg-gray-50' onClick={() => {
               onChange('agent')
@@ -108,7 +108,7 @@ const AppTypeSelector = ({ value, onChange }: AppSelectorProps) => {
             }}>
               <CuteRobote className='mr-2 w-4 h-4 text-indigo-600' />
               <div className='grow text-gray-700 text-[13px] font-medium leading-[18px]'>{t('app.typeSelector.agent')}</div>
-              {value === 'agent' && <Check className='w-4 h-4 text-primary-600'/>}
+              {value === 'agent' && <Check className='w-4 h-4 text-primary-600' />}
             </div>
             <div className='flex items-center pl-3 py-[6px] pr-2 rounded-lg cursor-pointer hover:bg-gray-50' onClick={() => {
               onChange('workflow')
@@ -116,7 +116,7 @@ const AppTypeSelector = ({ value, onChange }: AppSelectorProps) => {
             }}>
               <Route className='mr-2 w-4 h-4 text-[#F79009]' />
               <div className='grow text-gray-700 text-[13px] font-medium leading-[18px]'>{t('app.typeSelector.workflow')}</div>
-              {value === 'workflow' && <Check className='w-4 h-4 text-primary-600'/>}
+              {value === 'workflow' && <Check className='w-4 h-4 text-primary-600' />}
             </div>
           </div>
         </PortalToFollowElemContent>

web/app/components/app/workflow-log/list.tsx

@@ -2,9 +2,9 @@
 import type { FC } from 'react'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import cn from 'classnames'
 import s from './style.module.css'
 import DetailPanel from './detail'
+import cn from '@/utils/classnames'
 import type { WorkflowAppLogDetail, WorkflowLogsResponse } from '@/models/log'
 import type { App } from '@/types/app'
 import Loading from '@/app/components/base/loading'