hz/ebiz-dify-ai
1
0
Fork 0
mirror of http://112.124.100.131/huang.ze/ebiz-dify-ai.git synced 2025-12-22 17:26:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

Chore: frontend infrastructure upgrade (#16420)

Browse Source 
Co-authored-by: NFish <douxc512@gmail.com>
Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: jZonG <jzongcode@gmail.com>
This commit is contained in:
Joel
2025-03-21 17:41:03 +08:00
committed by GitHub
parent e61415223b
commit 7709d9df20
1435 changed files with 13372 additions and 11612 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
web/app/components/share/text-generation/index.tsx
View File

@@ -474,21 +474,21 @@ const TextGeneration: FC<IMainProps> = ({
const renderResWrap = (
<div
className={cn(
'relative flex flex-col h-full',
'relative flex h-full flex-col',
!isPC && 'h-[calc(100vh_-_36px)] rounded-t-2xl shadow-lg backdrop-blur-sm',
!isPC
? isShowResultPanel
? 'bg-background-default-burn'
: 'bg-components-panel-bg border-t-[0.5px] border-divider-regular'
: 'border-t-[0.5px] border-divider-regular bg-components-panel-bg'
: 'bg-chatbot-bg',
)}
>
{isCallBatchAPI && (
<div className={cn(
'shrink-0 px-14 pt-9 pb-2 flex items-center justify-between',
!isPC && 'px-4 pt-3 pb-1',
'flex shrink-0 items-center justify-between px-14 pb-2 pt-9',
!isPC && 'px-4 pb-1 pt-3',
)}>
<div className='text-text-primary system-md-semibold-uppercase'>{t('share.generation.executions', { num: allTaskList.length })}</div>
<div className='system-md-semibold-uppercase text-text-primary'>{t('share.generation.executions', { num: allTaskList.length })}</div>
{allSuccessTaskList.length > 0 && (
<ResDownload
isMobile={!isPC}
@@ -498,7 +498,7 @@ const TextGeneration: FC<IMainProps> = ({
</div>
)}
<div className={cn(
'grow flex flex-col h-0 overflow-y-auto',
'flex h-0 grow flex-col overflow-y-auto',
isPC && 'px-14 py-8',
isPC && isCallBatchAPI && 'pt-0',
!isPC && 'p-0 pb-2',
@@ -511,11 +511,11 @@ const TextGeneration: FC<IMainProps> = ({
)}
</div>
{isCallBatchAPI && allFailedTaskList.length > 0 && (
<div className='z-10 absolute bottom-6 left-1/2 -translate-x-1/2 flex items-center gap-2 p-3 rounded-xl bg-components-panel-bg-blur backdrop-blur-sm border border-components-panel-border shadow-lg'>
<RiErrorWarningFill className='w-4 h-4 text-text-destructive' />
<div className='text-text-secondary system-sm-medium'>{t('share.generation.batchFailed.info', { num: allFailedTaskList.length })}</div>
<div className='w-px h-3.5 bg-divider-regular'></div>
<div onClick={handleRetryAllFailedTask} className='text-text-accent system-sm-semibold-uppercase cursor-pointer'>{t('share.generation.batchFailed.retry')}</div>
<div className='absolute bottom-6 left-1/2 z-10 flex -translate-x-1/2 items-center gap-2 rounded-xl border border-components-panel-border bg-components-panel-bg-blur p-3 shadow-lg backdrop-blur-sm'>
<RiErrorWarningFill className='h-4 w-4 text-text-destructive' />
<div className='system-sm-medium text-text-secondary'>{t('share.generation.batchFailed.info', { num: allFailedTaskList.length })}</div>
<div className='h-3.5 w-px bg-divider-regular'></div>
<div onClick={handleRetryAllFailedTask} className='system-sm-semibold-uppercase cursor-pointer text-text-accent'>{t('share.generation.batchFailed.retry')}</div>
</div>
)}
</div>
@@ -523,7 +523,7 @@ const TextGeneration: FC<IMainProps> = ({
if (!appId || !siteInfo || !promptConfig) {
return (
<div className='flex items-center h-screen'>
<div className='flex h-screen items-center'>
<Loading type='app' />
</div>)
}
@@ -537,12 +537,12 @@ const TextGeneration: FC<IMainProps> = ({
)}>
{/* Left */}
<div className={cn(
'shrink-0 relative flex flex-col h-full',
'relative flex h-full shrink-0 flex-col',
isPC ? 'w-[600px] max-w-[50%]' : resultExisted ? 'h-[calc(100%_-_64px)]' : '',
isInstalledApp && 'rounded-l-2xl',
)}>
{/* header */}
<div className={cn('shrink-0 space-y-4 border-b border-divider-subtle', isPC ? 'p-8 pb-0 bg-components-panel-bg' : 'p-4 pb-0')}>
<div className={cn('shrink-0 space-y-4 border-b border-divider-subtle', isPC ? 'bg-components-panel-bg p-8 pb-0' : 'p-4 pb-0')}>
<div className='flex items-center gap-3'>
<AppIcon
size={isPC ? 'large' : 'small'}
@@ -551,7 +551,7 @@ const TextGeneration: FC<IMainProps> = ({
background={siteInfo.icon_background || appDefaultIconBackground}
imageUrl={siteInfo.icon_url}
/>
<div className='grow text-text-secondary system-md-semibold truncate'>{siteInfo.title}</div>
<div className='system-md-semibold grow truncate text-text-secondary'>{siteInfo.title}</div>
<MenuDropdown data={siteInfo} />
</div>
{siteInfo.description && (
@@ -566,7 +566,7 @@ const TextGeneration: FC<IMainProps> = ({
id: 'saved',
name: t('share.generation.tabs.saved'),
isRight: true,
icon: <RiBookmark3Line className='w-4 h-4' />,
icon: <RiBookmark3Line className='h-4 w-4' />,
extra: savedMessages.length > 0
? (
<Badge className='ml-1'>
@@ -583,7 +583,7 @@ const TextGeneration: FC<IMainProps> = ({
</div>
{/* form */}
<div className={cn(
'grow h-0 bg-components-panel-bg overflow-y-auto',
'h-0 grow overflow-y-auto bg-components-panel-bg',
isPC ? 'px-8' : 'px-4',
!isPC && resultExisted && customConfig?.remove_webapp_brand && 'rounded-b-2xl border-b-[0.5px] border-divider-regular',
)}>
@@ -619,13 +619,13 @@ const TextGeneration: FC<IMainProps> = ({
{/* powered by */}
{!customConfig?.remove_webapp_brand && (
<div className={cn(
'shrink-0 py-3 flex items-center gap-1.5 bg-components-panel-bg',
'flex shrink-0 items-center gap-1.5 bg-components-panel-bg py-3',
isPC ? 'px-8' : 'px-4',
!isPC && resultExisted && 'rounded-b-2xl border-b-[0.5px] border-divider-regular',
)}>
<div className='text-text-tertiary system-2xs-medium-uppercase'>{t('share.chat.poweredBy')}</div>
<div className='system-2xs-medium-uppercase text-text-tertiary'>{t('share.chat.poweredBy')}</div>
{customConfig?.replace_webapp_logo && (
<img src={customConfig?.replace_webapp_logo} alt='logo' className='block w-auto h-5' />
<img src={customConfig?.replace_webapp_logo} alt='logo' className='block h-5 w-auto' />
)}
{!customConfig?.replace_webapp_logo && (
<LogoSite className='!h-5' />
@@ -636,19 +636,19 @@ const TextGeneration: FC<IMainProps> = ({
{/* Result */}
<div className={cn(
isPC
? 'grow h-full'
? 'h-full grow'
: isShowResultPanel
? 'fixed z-50 inset-0 bg-background-overlay backdrop-blur-sm'
? 'fixed inset-0 z-50 bg-background-overlay backdrop-blur-sm'
: resultExisted
? 'relative shrink-0 h-16 pt-2.5 bg-background-default-burn overflow-hidden'
? 'relative h-16 shrink-0 overflow-hidden bg-background-default-burn pt-2.5'
: '',
)}>
{!isPC && (
<div
className={cn(
isShowResultPanel
? 'p-2 pt-6 flex items-center justify-center'
: 'z-10 absolute top-0 left-0 w-full px-2 pt-[3px] pb-[57px] flex items-center justify-center',
? 'flex items-center justify-center p-2 pt-6'
: 'absolute left-0 top-0 z-10 flex w-full items-center justify-center px-2 pb-[57px] pt-[3px]',
)}
onClick={() => {
if (isShowResultPanel)
@@ -657,7 +657,7 @@ const TextGeneration: FC<IMainProps> = ({
showResultPanel()
}}
>
<div className='w-8 h-1 rounded bg-divider-solid cursor-grab'/>
<div className='h-1 w-8 cursor-grab rounded bg-divider-solid'/>
</div>
)}
{renderResWrap}

8
web/app/components/share/text-generation/info-modal.tsx
View File

@@ -20,10 +20,10 @@ const InfoModal = ({
<Modal
isShow={isShow}
onClose={onClose}
className='!p-0 min-w-[400px] max-w-[400px]'
className='min-w-[400px] max-w-[400px] !p-0'
closable
>
<div className={cn('pt-10 px-4 pb-8 flex flex-col items-center gap-4')}>
<div className={cn('flex flex-col items-center gap-4 px-4 pb-8 pt-10')}>
<AppIcon
size='xxl'
iconType={data?.icon_type}
@@ -31,8 +31,8 @@ const InfoModal = ({
background={data?.icon_background || appDefaultIconBackground}
imageUrl={data?.icon_url}
/>
<div className='text-text-secondary system-xl-semibold'>{data?.title}</div>
<div className='text-text-tertiary system-xs-regular'>
<div className='system-xl-semibold text-text-secondary'>{data?.title}</div>
<div className='system-xs-regular text-text-tertiary'>
{/* copyright */}
{data?.copyright && (
<div>© {(new Date()).getFullYear()} {data?.copyright}</div>

8
web/app/components/share/text-generation/menu-dropdown.tsx
View File

@@ -53,15 +53,15 @@ const MenuDropdown: FC<Props> = ({
<PortalToFollowElemTrigger onClick={handleTrigger}>
<div>
<ActionButton size='l' className={cn(open && 'bg-state-base-hover')}>
<RiEqualizer2Line className='w-[18px] h-[18px]' />
<RiEqualizer2Line className='h-[18px] w-[18px]' />
</ActionButton>
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent className='z-50'>
<div className='w-[224px] bg-components-panel-bg-blur backdrop-blur-sm rounded-xl border-[0.5px] border-components-panel-border shadow-lg'>
<div className='w-[224px] rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadow-lg backdrop-blur-sm'>
<div className='p-1'>
{data?.privacy_policy && (
<a href={data.privacy_policy} target='_blank' className='flex items-center px-3 py-1.5 rounded-lg text-text-secondary system-md-regular cursor-pointer hover:bg-state-base-hover'>
<a href={data.privacy_policy} target='_blank' className='system-md-regular flex cursor-pointer items-center rounded-lg px-3 py-1.5 text-text-secondary hover:bg-state-base-hover'>
<span className='grow'>{t('share.chat.privacyPolicyMiddle')}</span>
</a>
)}
@@ -70,7 +70,7 @@ const MenuDropdown: FC<Props> = ({
handleTrigger()
setShow(true)
}}
className='px-3 py-1.5 rounded-lg text-text-secondary system-md-regular cursor-pointer hover:bg-state-base-hover'
className='system-md-regular cursor-pointer rounded-lg px-3 py-1.5 text-text-secondary hover:bg-state-base-hover'
>{t('common.userProfile.about')}</div>
</div>
</div>

6
web/app/components/share/text-generation/no-data/index.tsx
View File

@@ -9,10 +9,10 @@ export type INoDataProps = {}
const NoData: FC<INoDataProps> = () => {
const { t } = useTranslation()
return (
<div className='flex flex-col h-full w-full justify-center items-center'>
<RiSparklingFill className='w-12 h-12 text-text-empty-state-icon' />
<div className='flex h-full w-full flex-col items-center justify-center'>
<RiSparklingFill className='h-12 w-12 text-text-empty-state-icon' />
<div
className='mt-2 text-text-quaternary system-sm-regular'
className='system-sm-regular mt-2 text-text-quaternary'
>
{t('share.generation.noData')}
</div>

4
web/app/components/share/text-generation/result/content.tsx
View File

@@ -17,10 +17,10 @@ const Result: FC<IResultProps> = ({
onFeedback,
}) => {
return (
<div className='basis-3/4 h-max'>
<div className='h-max basis-3/4'>
<Header result={content} showFeedback={showFeedback} feedback={feedback} onFeedback={onFeedback} />
<div
className='mt-4 w-full flex text-sm leading-5 overflow-scroll font-normal text-gray-900'
className='mt-4 flex w-full overflow-scroll text-sm font-normal leading-5 text-gray-900'
style={{
maxHeight: '70vh',
}}

18
web/app/components/share/text-generation/result/header.tsx
View File

@@ -24,8 +24,8 @@ const Header: FC<IResultHeaderProps> = ({
}) => {
const { t } = useTranslation()
return (
<div className='flex w-full justify-between items-center '>
<div className='text-gray-800 text-2xl leading-4 font-normal'>{t('share.generation.resultTitle')}</div>
<div className='flex w-full items-center justify-between '>
<div className='text-2xl font-normal leading-4 text-gray-800'>{t('share.generation.resultTitle')}</div>
<div className='flex items-center space-x-2'>
<Button
className='h-7 p-[2px] pr-2'
@@ -35,8 +35,8 @@ const Header: FC<IResultHeaderProps> = ({
}}
>
<>
<ClipboardDocumentIcon className='text-gray-500 w-4 h-3 mr-1' />
<span className='text-gray-500 text-xs leading-3'>{t('share.generation.copy')}</span>
<ClipboardDocumentIcon className='mr-1 h-3 w-4 text-gray-500' />
<span className='text-xs leading-3 text-gray-500'>{t('share.generation.copy')}</span>
</>
</Button>
@@ -50,7 +50,7 @@ const Header: FC<IResultHeaderProps> = ({
rating: null,
})
}}
className='flex w-7 h-7 items-center justify-center rounded-md cursor-pointer !text-primary-600 border border-primary-200 bg-primary-100 hover:border-primary-300 hover:bg-primary-200'>
className='flex h-7 w-7 cursor-pointer items-center justify-center rounded-md border border-primary-200 bg-primary-100 !text-primary-600 hover:border-primary-300 hover:bg-primary-200'>
<HandThumbUpIcon width={16} height={16} />
</div>
</Tooltip>
@@ -66,14 +66,14 @@ const Header: FC<IResultHeaderProps> = ({
rating: null,
})
}}
className='flex w-7 h-7 items-center justify-center rounded-md cursor-pointer !text-red-600 border border-red-200 bg-red-100 hover:border-red-300 hover:bg-red-200'>
className='flex h-7 w-7 cursor-pointer items-center justify-center rounded-md border border-red-200 bg-red-100 !text-red-600 hover:border-red-300 hover:bg-red-200'>
<HandThumbDownIcon width={16} height={16} />
</div>
</Tooltip>
)}
{showFeedback && !feedback.rating && (
<div className='flex rounded-lg border border-gray-200 p-[1px] space-x-1'>
<div className='flex space-x-1 rounded-lg border border-gray-200 p-[1px]'>
<Tooltip
popupContent="Great Rating"
needsDelay={false}
@@ -84,7 +84,7 @@ const Header: FC<IResultHeaderProps> = ({
rating: 'like',
})
}}
className='flex w-6 h-6 items-center justify-center rounded-md cursor-pointer hover:bg-gray-100'>
className='flex h-6 w-6 cursor-pointer items-center justify-center rounded-md hover:bg-gray-100'>
<HandThumbUpIcon width={16} height={16} />
</div>
</Tooltip>
@@ -98,7 +98,7 @@ const Header: FC<IResultHeaderProps> = ({
rating: 'dislike',
})
}}
className='flex w-6 h-6 items-center justify-center rounded-md cursor-pointer hover:bg-gray-100'>
className='flex h-6 w-6 cursor-pointer items-center justify-center rounded-md hover:bg-gray-100'>
<HandThumbDownIcon width={16} height={16} />
</div>
</Tooltip>

4
web/app/components/share/text-generation/result/index.tsx
View File

@@ -436,7 +436,7 @@ const Result: FC<IResultProps> = ({
{!isCallBatchAPI && !isWorkflow && (
(isResponding && !completionRes)
? (
<div className='flex h-full w-full justify-center items-center'>
<div className='flex h-full w-full items-center justify-center'>
<Loading type='area' />
</div>)
: (
@@ -451,7 +451,7 @@ const Result: FC<IResultProps> = ({
{!isCallBatchAPI && isWorkflow && (
(isResponding && !workflowProcessData)
? (
<div className='flex h-full w-full justify-center items-center'>
<div className='flex h-full w-full items-center justify-center'>
<Loading type='area' />
</div>
)

10
web/app/components/share/text-generation/run-batch/csv-download/index.tsx
View File

@@ -29,11 +29,11 @@ const CSVDownload: FC<ICSVDownloadProps> = ({
<div className='mt-6'>
<div className='system-sm-medium text-text-primary'>{t('share.generation.csvStructureTitle')}</div>
<div className='mt-2 max-h-[500px] overflow-auto'>
<table className='table-fixed w-full border-separate border-spacing-0 border border-divider-regular rounded-lg text-xs'>
<table className='w-full table-fixed border-separate border-spacing-0 rounded-lg border border-divider-regular text-xs'>
<thead className='text-text-tertiary'>
<tr>
{addQueryContentVars.map((item, i) => (
<td key={i} className='h-9 pl-3 pr-2 border-b border-divider-regular'>{item.name}</td>
<td key={i} className='h-9 border-b border-divider-regular pl-3 pr-2'>{item.name}</td>
))}
</tr>
</thead>
@@ -47,7 +47,7 @@ const CSVDownload: FC<ICSVDownloadProps> = ({
</table>
</div>
<CSVDownloader
className="block mt-2 cursor-pointer"
className="mt-2 block cursor-pointer"
type={Type.Link}
filename={'template'}
bom={true}
@@ -58,8 +58,8 @@ const CSVDownload: FC<ICSVDownloadProps> = ({
template,
]}
>
<div className='flex items-center h-[18px] space-x-1 text-text-accent system-xs-medium'>
<DownloadIcon className='w-3 h-3' />
<div className='system-xs-medium flex h-[18px] items-center space-x-1 text-text-accent'>
<DownloadIcon className='h-3 w-3' />
<span>{t('share.generation.downloadTemplate')}</span>
</div>
</CSVDownloader>

12
web/app/components/share/text-generation/run-batch/csv-reader/index.tsx
View File

@@ -41,15 +41,15 @@ const CSVReader: FC<Props> = ({
<div
{...getRootProps()}
className={cn(
'flex items-center h-20 rounded-xl bg-components-dropzone-bg border border-dashed border-components-dropzone-border system-sm-regular',
acceptedFile && 'px-6 bg-components-panel-on-panel-item-bg border-solid border-components-panel-border hover:bg-components-panel-on-panel-item-bg-hover hover:border-components-panel-bg-blur',
zoneHover && 'bg-components-dropzone-bg-accent border border-components-dropzone-border-accent',
'system-sm-regular flex h-20 items-center rounded-xl border border-dashed border-components-dropzone-border bg-components-dropzone-bg',
acceptedFile && 'border-solid border-components-panel-border bg-components-panel-on-panel-item-bg px-6 hover:border-components-panel-bg-blur hover:bg-components-panel-on-panel-item-bg-hover',
zoneHover && 'border border-components-dropzone-border-accent bg-components-dropzone-bg-accent',
)}
>
{
acceptedFile
? (
<div className='w-full flex items-center space-x-2'>
<div className='flex w-full items-center space-x-2'>
<CSVIcon className="shrink-0" />
<div className='flex w-0 grow'>
<span className='max-w-[calc(100%_-_30px)] truncate text-text-secondary'>{acceptedFile.name.replace(/.csv$/, '')}</span>
@@ -58,9 +58,9 @@ const CSVReader: FC<Props> = ({
</div>
)
: (
<div className='w-full flex items-center justify-center space-x-2'>
<div className='flex w-full items-center justify-center space-x-2'>
<CSVIcon className="shrink-0" />
<div className='text-text-tertiary'>{t('share.generation.csvUploadTitle')}<span className='text-text-accent cursor-pointer'>{t('share.generation.browse')}</span></div>
<div className='text-text-tertiary'>{t('share.generation.csvUploadTitle')}<span className='cursor-pointer text-text-accent'>{t('share.generation.browse')}</span></div>
</div>
)}
</div>

4
web/app/components/share/text-generation/run-batch/index.tsx
View File

@@ -49,8 +49,8 @@ const RunBatch: FC<IRunBatchProps> = ({
onClick={handleSend}
disabled={!isParsed || !isAllFinished}
>
<Icon className={cn(!isAllFinished && 'animate-spin', 'shrink-0 w-4 h-4 mr-1')} aria-hidden="true" />
<span className='uppercase text-[13px]'>{t('share.generation.run')}</span>
<Icon className={cn(!isAllFinished && 'animate-spin', 'mr-1 h-4 w-4 shrink-0')} aria-hidden="true" />
<span className='text-[13px] uppercase'>{t('share.generation.run')}</span>
</Button>
</div>
</div>

4
web/app/components/share/text-generation/run-batch/res-download/index.tsx
View File

@@ -35,12 +35,12 @@ const ResDownload: FC<IResDownloadProps> = ({
>
{isMobile && (
<ActionButton>
<RiDownloadLine className='w-4 h-4' />
<RiDownloadLine className='h-4 w-4' />
</ActionButton>
)}
{!isMobile && (
<Button className={cn('space-x-1')}>
<RiDownloadLine className='w-4 h-4' />
<RiDownloadLine className='h-4 w-4' />
<span>{t('common.operation.download')}</span>
</Button>
)}

12
web/app/components/share/text-generation/run-once/index.tsx
View File

@@ -65,8 +65,8 @@ const RunOnce: FC<IRunOnceProps> = ({
{/* input form */}
<form onSubmit={onSubmit}>
{promptConfig.prompt_variables.map(item => (
<div className='w-full mt-4' key={item.key}>
<label className='h-6 flex items-center text-text-secondary system-md-semibold'>{item.name}</label>
<div className='mt-4 w-full' key={item.key}>
<label className='system-md-semibold flex h-6 items-center text-text-secondary'>{item.name}</label>
<div className='mt-1'>
{item.type === 'select' && (
<Select
@@ -125,8 +125,8 @@ const RunOnce: FC<IRunOnceProps> = ({
))}
{
visionConfig?.enabled && (
<div className="w-full mt-4">
<div className="h-6 flex items-center text-text-secondary system-md-semibold">{t('common.imageUploader.imageUpload')}</div>
<div className="mt-4 w-full">
<div className="system-md-semibold flex h-6 items-center text-text-secondary">{t('common.imageUploader.imageUpload')}</div>
<div className='mt-1'>
<TextGenerationImageUploader
settings={visionConfig}
@@ -141,7 +141,7 @@ const RunOnce: FC<IRunOnceProps> = ({
</div>
)
}
<div className='w-full mt-6 mb-3'>
<div className='mb-3 mt-6 w-full'>
<div className="flex items-center justify-between gap-2">
<Button
onClick={onClear}
@@ -155,7 +155,7 @@ const RunOnce: FC<IRunOnceProps> = ({
variant="primary"
disabled={false}
>
<RiPlayLargeLine className="shrink-0 w-4 h-4 mr-1" aria-hidden="true" />
<RiPlayLargeLine className="mr-1 h-4 w-4 shrink-0" aria-hidden="true" />
<span className='text-[13px]'>{t('share.generation.run')}</span>
</Button>
</div>