opensource/dify
2
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-04-29 12:37:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add loading

Browse Source
This commit is contained in:
Joel 2024-11-15 10:39:57 +08:00
parent 6f5e010db5
commit 73ce8a17a5
2 changed files with 19 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/app/components/plugins/card/base/placeholder.tsx
View File

@ -4,7 +4,7 @@ import cn from '@/utils/classnames'
type Props = { type Props = {
wrapClassName: string wrapClassName: string
loadingFileName: string loadingFileName?: string
} }
export const LoadingPlaceholder = ({ className }: { className?: string }) => ( export const LoadingPlaceholder = ({ className }: { className?: string }) => (
@ -27,7 +27,11 @@ const Placeholder = ({
</div> </div>
<div className="ml-3 grow"> <div className="ml-3 grow">
<div className="flex items-center h-5"> <div className="flex items-center h-5">
<Title title={loadingFileName} /> {loadingFileName ? (
<Title title={loadingFileName} />
) : (
<LoadingPlaceholder className="w-[260px]" />
)}
</div> </div>
<div className={cn('flex items-center h-4 space-x-0.5')}> <div className={cn('flex items-center h-4 space-x-0.5')}>
<LoadingPlaceholder className="w-[41px]" /> <LoadingPlaceholder className="w-[41px]" />

15
web/app/components/plugins/install-plugin/install-bundle/item/loading.tsx
View File

@ -1,10 +1,21 @@
'use client' 'use client'
import React from 'react' import React from 'react'
import Placeholder from '../../../card/base/placeholder'
import Checkbox from '@/app/components/base/checkbox'
const Loading = () => { const Loading = () => {
return ( return (
<div> <div className='flex items-center space-x-2'>
Loading... <Checkbox
className='shrink-0'
checked={false}
disabled
/>
<div className='grow relative p-4 pb-3 border-[0.5px] border-components-panel-border bg-components-panel-on-panel-item-bg hover-bg-components-panel-on-panel-item-bg rounded-xl shadow-xs'>
<Placeholder
wrapClassName='w-full'
/>
</div>
</div> </div>
) )
} }