mirror of
				https://github.com/langgenius/dify.git
				synced 2025-10-31 10:53:02 +00:00 
			
		
		
		
	 7709d9df20
			
		
	
	
		7709d9df20
		
			
		
	
	
	
	
		
			
			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>
		
			
				
	
	
		
			64 lines
		
	
	
		
			2.0 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			64 lines
		
	
	
		
			2.0 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
| 'use client'
 | |
| import { Group } from '@/app/components/base/icons/src/vender/other'
 | |
| import Line from './line'
 | |
| import cn from '@/utils/classnames'
 | |
| import { useMixedTranslation } from '@/app/components/plugins/marketplace/hooks'
 | |
| 
 | |
| type Props = {
 | |
|   text?: string
 | |
|   lightCard?: boolean
 | |
|   className?: string
 | |
|   locale?: string
 | |
| }
 | |
| 
 | |
| const Empty = ({
 | |
|   text,
 | |
|   lightCard,
 | |
|   className,
 | |
|   locale,
 | |
| }: Props) => {
 | |
|   const { t } = useMixedTranslation(locale)
 | |
| 
 | |
|   return (
 | |
|     <div
 | |
|       className={cn('relative flex h-0 grow flex-wrap overflow-hidden p-2', className)}
 | |
|     >
 | |
|       {
 | |
|         Array.from({ length: 16 }).map((_, index) => (
 | |
|           <div
 | |
|             key={index}
 | |
|             className={cn(
 | |
|               'mb-3 mr-3  h-[144px] w-[calc((100%-36px)/4)] rounded-xl bg-background-section-burn',
 | |
|               index % 4 === 3 && 'mr-0',
 | |
|               index > 11 && 'mb-0',
 | |
|               lightCard && 'bg-background-default-lighter opacity-75',
 | |
|             )}
 | |
|           >
 | |
|           </div>
 | |
|         ))
 | |
|       }
 | |
|       {
 | |
|         !lightCard && (
 | |
|           <div
 | |
|             className='absolute inset-0 z-[1] bg-marketplace-plugin-empty'
 | |
|           ></div>
 | |
|         )
 | |
|       }
 | |
|       <div className='absolute left-1/2 top-1/2 z-[2] flex -translate-x-1/2 -translate-y-1/2 flex-col items-center'>
 | |
|         <div className='relative mb-3 flex h-14 w-14 items-center justify-center rounded-xl border border-dashed border-divider-deep bg-components-card-bg shadow-lg'>
 | |
|           <Group className='h-5 w-5' />
 | |
|           <Line className='absolute right-[-1px] top-1/2 -translate-y-1/2' />
 | |
|           <Line className='absolute left-[-1px] top-1/2 -translate-y-1/2' />
 | |
|           <Line className='absolute left-1/2 top-0 -translate-x-1/2 -translate-y-1/2 rotate-90' />
 | |
|           <Line className='absolute left-1/2 top-full -translate-x-1/2 -translate-y-1/2 rotate-90' />
 | |
|         </div>
 | |
|         <div className='system-md-regular text-center text-text-tertiary'>
 | |
|           {text || t('plugin.marketplace.noPluginFound')}
 | |
|         </div>
 | |
|       </div>
 | |
|     </div>
 | |
|   )
 | |
| }
 | |
| 
 | |
| export default Empty
 |