estel/dify
1
0
Fork 0
Code Issues Pull Requests Actions 1 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

32
web/app/components/base/pagination/index.tsx
View File

@@ -62,7 +62,7 @@ const CustomizedPagination: FC<Props> = ({
return (
<Pagination
className={cn('flex items-center w-full px-6 py-3 select-none', className)}
className={cn('flex w-full select-none items-center px-6 py-3', className)}
currentPage={current}
edgePageCount={2}
middlePagesSiblingCount={1}
@@ -71,14 +71,14 @@ const CustomizedPagination: FC<Props> = ({
truncableClassName='flex items-center justify-center w-8 px-1 py-2 system-sm-medium text-text-tertiary'
truncableText='...'
>
<div className='flex items-center gap-0.5 p-0.5 rounded-[10px] bg-background-section-burn'>
<div className='flex items-center gap-0.5 rounded-[10px] bg-background-section-burn p-0.5'>
<Pagination.PrevButton
as={<div></div>}
disabled={current === 0}
>
<Button
variant='secondary'
className='w-7 h-7 px-1.5'
className='h-7 w-7 px-1.5'
disabled={current === 0}
>
<RiArrowLeftLine className='h-4 w-4' />
@@ -87,7 +87,7 @@ const CustomizedPagination: FC<Props> = ({
{!showInput && (
<div
ref={inputRef}
className='flex items-center gap-0.5 px-2 py-1.5 rounded-lg hover:bg-state-base-hover-alt hover:cursor-text'
className='flex items-center gap-0.5 rounded-lg px-2 py-1.5 hover:cursor-text hover:bg-state-base-hover-alt'
onClick={() => setShowInput(true)}
>
<div className='system-xs-medium text-text-secondary'>{current + 1}</div>
@@ -114,46 +114,46 @@ const CustomizedPagination: FC<Props> = ({
>
<Button
variant='secondary'
className='w-7 h-7 px-1.5'
className='h-7 w-7 px-1.5'
disabled={current === totalPages - 1}
>
<RiArrowRightLine className='h-4 w-4' />
</Button>
</Pagination.NextButton>
</div>
<div className={cn('grow flex items-center justify-center gap-1 list-none')}>
<div className={cn('flex grow list-none items-center justify-center gap-1')}>
<Pagination.PageButton
className='flex items-center justify-center min-w-8 px-1 py-2 rounded-lg system-sm-medium cursor-pointer hover:bg-components-button-ghost-bg-hover'
className='system-sm-medium flex min-w-8 cursor-pointer items-center justify-center rounded-lg px-1 py-2 hover:bg-components-button-ghost-bg-hover'
activeClassName='bg-components-button-tertiary-bg text-components-button-tertiary-text hover:bg-components-button-ghost-bg-hover'
inactiveClassName='text-text-tertiary'
/>
</div>
{onLimitChange && (
<div className='shrink-0 flex items-center gap-2'>
<div className='shrink-0 w-[51px] text-end text-text-tertiary system-2xs-regular-uppercase'>{showPerPageTip ? t('common.pagination.perPage') : ''}</div>
<div className='flex shrink-0 items-center gap-2'>
<div className='system-2xs-regular-uppercase w-[51px] shrink-0 text-end text-text-tertiary'>{showPerPageTip ? t('common.pagination.perPage') : ''}</div>
<div
className='flex items-center gap-[1px] p-0.5 rounded-[10px] bg-components-segmented-control-bg-normal'
className='flex items-center gap-[1px] rounded-[10px] bg-components-segmented-control-bg-normal p-0.5'
onMouseEnter={() => setShowPerPageTip(true)}
onMouseLeave={() => setShowPerPageTip(false)}
>
<div
className={cn(
'px-2.5 py-1.5 rounded-lg border-[0.5px] border-transparent system-sm-medium text-text-tertiary cursor-pointer hover:bg-state-base-hover hover:text-text-secondary',
limit === 10 && 'shadow-xs border-components-segmented-control-item-active-border bg-components-segmented-control-item-active-bg text-text-secondary hover:bg-components-segmented-control-item-active-bg',
'system-sm-medium cursor-pointer rounded-lg border-[0.5px] border-transparent px-2.5 py-1.5 text-text-tertiary hover:bg-state-base-hover hover:text-text-secondary',
limit === 10 && 'border-components-segmented-control-item-active-border bg-components-segmented-control-item-active-bg text-text-secondary shadow-xs hover:bg-components-segmented-control-item-active-bg',
)}
onClick={() => onLimitChange?.(10)}
>10</div>
<div
className={cn(
'px-2.5 py-1.5 rounded-lg border-[0.5px] border-transparent system-sm-medium text-text-tertiary cursor-pointer hover:bg-state-base-hover hover:text-text-secondary',
limit === 25 && 'shadow-xs border-components-segmented-control-item-active-border bg-components-segmented-control-item-active-bg text-text-secondary hover:bg-components-segmented-control-item-active-bg',
'system-sm-medium cursor-pointer rounded-lg border-[0.5px] border-transparent px-2.5 py-1.5 text-text-tertiary hover:bg-state-base-hover hover:text-text-secondary',
limit === 25 && 'border-components-segmented-control-item-active-border bg-components-segmented-control-item-active-bg text-text-secondary shadow-xs hover:bg-components-segmented-control-item-active-bg',
)}
onClick={() => onLimitChange?.(25)}
>25</div>
<div
className={cn(
'px-2.5 py-1.5 rounded-lg border-[0.5px] border-transparent system-sm-medium text-text-tertiary cursor-pointer hover:bg-state-base-hover hover:text-text-secondary',
limit === 50 && 'shadow-xs border-components-segmented-control-item-active-border bg-components-segmented-control-item-active-bg text-text-secondary hover:bg-components-segmented-control-item-active-bg',
'system-sm-medium cursor-pointer rounded-lg border-[0.5px] border-transparent px-2.5 py-1.5 text-text-tertiary hover:bg-state-base-hover hover:text-text-secondary',
limit === 50 && 'border-components-segmented-control-item-active-border bg-components-segmented-control-item-active-bg text-text-secondary shadow-xs hover:bg-components-segmented-control-item-active-bg',
)}
onClick={() => onLimitChange?.(50)}
>50</div>

6
web/app/components/base/pagination/type.ts
View File

@@ -31,7 +31,7 @@ type IPagination = IUsePagination & {
}
type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
as?: React.ReactElement
as?: React.ReactNode
children?: string | React.ReactNode
className?: string
dataTestId?: string
@@ -39,9 +39,9 @@ type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
type PageButtonProps = ButtonProps & {
/**
* Provide a custom ReactElement (e.g. Next/Link)
* Provide a custom ReactNode (e.g. Next/Link)
*/
as?: React.ReactElement
as?: React.ReactNode
activeClassName?: string
inactiveClassName?: string
dataTestIdActive?: string