AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-05-25 07:38:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(workflow): Improve layout structure in VersionHistoryPanel (#19450)

Browse Source
This commit is contained in:
GuanMu 2025-05-09 16:37:32 +08:00 committed by GitHub
parent c7a8885d9d
commit 3a85f218ed
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 46 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
web/app/components/workflow/panel/version-history-panel/index.tsx
View File

@ -191,7 +191,7 @@ const VersionHistoryPanel = () => {
}, [t, updateWorkflow, resetWorkflowVersionHistory]) }, [t, updateWorkflow, resetWorkflowVersionHistory])
return ( return (
<div className='flex w-[268px] flex-col rounded-l-2xl border-y-[0.5px] border-l-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xl shadow-shadow-shadow-5'> <div className='flex h-full w-[268px] flex-col rounded-l-2xl border-y-[0.5px] border-l-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xl shadow-shadow-shadow-5'>
<div className='flex items-center gap-x-2 px-4 pt-3'> <div className='flex items-center gap-x-2 px-4 pt-3'>
<div className='system-xl-semibold flex-1 py-1 text-text-primary'>{t('workflow.versionHistory.title')}</div> <div className='system-xl-semibold flex-1 py-1 text-text-primary'>{t('workflow.versionHistory.title')}</div>
<Filter <Filter
@ -208,50 +208,51 @@ const VersionHistoryPanel = () => {
<RiCloseLine className='h-4 w-4 text-text-tertiary' /> <RiCloseLine className='h-4 w-4 text-text-tertiary' />
</div> </div>
</div> </div>
<div className="relative flex-1 overflow-y-auto px-3 py-2"> <div className="flex h-0 flex-1 flex-col">
{(isFetching && !versionHistory?.pages?.length) <div className="flex-1 overflow-y-auto px-3 py-2">
? ( {(isFetching && !versionHistory?.pages?.length)
<Loading /> ? (
) <Loading />
: ( )
<> : (
{versionHistory?.pages?.map((page, pageNumber) => ( <>
page.items?.map((item, idx) => { {versionHistory?.pages?.map((page, pageNumber) => (
const isLast = pageNumber === versionHistory.pages.length - 1 && idx === page.items.length - 1 page.items?.map((item, idx) => {
return <VersionHistoryItem const isLast = pageNumber === versionHistory.pages.length - 1 && idx === page.items.length - 1
key={item.id} return <VersionHistoryItem
item={item} key={item.id}
currentVersion={currentVersion} item={item}
latestVersionId={appDetail!.workflow!.id} currentVersion={currentVersion}
onClick={handleVersionClick} latestVersionId={appDetail!.workflow!.id}
handleClickMenuItem={handleClickMenuItem.bind(null, item)} onClick={handleVersionClick}
isLast={isLast} handleClickMenuItem={handleClickMenuItem.bind(null, item)}
/> isLast={isLast}
}) />
))} })
{hasNextPage && ( ))}
<div className='absolute bottom-2 left-2 flex p-2'> {!isFetching && (!versionHistory?.pages?.length || !versionHistory.pages[0].items.length) && (
<div <Empty onResetFilter={handleResetFilter} />
className='flex cursor-pointer items-center gap-x-1' )}
onClick={handleNextPage} </>
> )}
<div className='item-center flex justify-center p-0.5'> </div>
{ {hasNextPage && (
isFetching <div className='p-2'>
? <RiLoader2Line className='h-3.5 w-3.5 animate-spin text-text-accent' /> <div
: <RiArrowDownDoubleLine className='h-3.5 w-3.5 text-text-accent' />} className='flex cursor-pointer items-center gap-x-1'
</div> onClick={handleNextPage}
<div className='system-xs-medium-uppercase py-[1px] text-text-accent'> >
{t('workflow.common.loadMore')} <div className='item-center flex justify-center p-0.5'>
</div> {isFetching
</div> ? <RiLoader2Line className='h-3.5 w-3.5 animate-spin text-text-accent' />
</div> : <RiArrowDownDoubleLine className='h-3.5 w-3.5 text-text-accent' />}
)} </div>
{!isFetching && (!versionHistory?.pages?.length || !versionHistory.pages[0].items.length) && ( <div className='system-xs-medium-uppercase py-[1px] text-text-accent'>
<Empty onResetFilter={handleResetFilter} /> {t('workflow.common.loadMore')}
)} </div>
</> </div>
)} </div>
)}
</div> </div>
{restoreConfirmOpen && (<RestoreConfirmModal {restoreConfirmOpen && (<RestoreConfirmModal
isOpen={restoreConfirmOpen} isOpen={restoreConfirmOpen}