feat: finish card components

This commit is contained in:
Joel
2024-10-10 17:47:04 +08:00
parent 19f5684960
commit 946068967b
28 changed files with 297 additions and 28 deletions

View File

@ -0,0 +1,9 @@
'use server'
import { revalidatePath } from 'next/cache'
// Server Actions
export async function handleDelete() {
// revalidatePath only invalidates the cache when the included path is next visited.
revalidatePath('/')
}

View File

@ -1,18 +1,21 @@
import { handleDelete } from './actions'
import Card from '@/app/components/plugins/card'
import { extensionDallE, modelGPT4, toolNotion } from '@/app/components/plugins/card/card-mock'
import PluginItem from '@/app/components/plugins/plugin-item'
import CardMoreInfo from '@/app/components/plugins/card/card-more-info'
import InstallModelItem from '@/app/components/plugins/install-model-item'
const PluginList = async () => {
const pluginList = [toolNotion, extensionDallE, modelGPT4, toolNotion, toolNotion]
return (
<div className='pb-3 bg-white'>
<div className='mx-3 '>
<h2 className='my-3'>Dify Plugin list</h2>
<div className='grid grid-cols-2 gap-3'>
<PluginItem payload={toolNotion as any} />
<PluginItem payload={extensionDallE as any} />
<PluginItem payload={modelGPT4 as any} />
<PluginItem payload={toolNotion as any} />
<PluginItem payload={toolNotion as any} />
{pluginList.map((plugin, index) => (
<PluginItem key={index} payload={plugin as any} onDelete={handleDelete} />
))}
</div>
<h2 className='my-3'>Install Plugin / Package under bundle</h2>
@ -32,14 +35,25 @@ const PluginList = async () => {
/>
</div>
<h3 className='my-1'>Install model provide</h3>
<div className='grid grid-cols-2 gap-3'>
{pluginList.map((plugin, index) => (
<InstallModelItem key={index} payload={plugin as any} />
))}
</div>
<div className='my-3 h-[px] bg-gray-50'></div>
<h2 className='my-3'>Marketplace Plugin list</h2>
<div className='grid grid-cols-4 gap-3'>
<Card payload={toolNotion as any} />
<Card payload={extensionDallE as any} />
<Card payload={modelGPT4 as any} />
<Card payload={toolNotion as any} />
<Card payload={toolNotion as any} />
{pluginList.map((plugin, index) => (
<Card
key={index}
payload={plugin as any}
footer={
<CardMoreInfo downloadCount={index % 2 === 0 ? 1234 : 6} tags={index % 2 === 0 ? ['Search', 'Productivity'] : []} />
}
/>
))}
</div>
</div>
</div>