refactor: remove unused fetchInstalledPluginList function and integrate useInstalledPluginList hook

This commit is contained in:
twwu
2024-11-07 16:52:22 +08:00
parent c7f8a0fc7b
commit 3f8a10613d
10 changed files with 62 additions and 46 deletions

View File

@ -1,9 +1,9 @@
'use client'
import { useMemo } from 'react'
import type { PluginDetail } from '../types'
import type { FilterState } from './filter-management'
import FilterManagement from './filter-management'
import List from './list'
import { useInstalledPluginList, useInvalidateInstalledPluginList } from '@/service/use-plugins'
import PluginDetailPanel from '@/app/components/plugins/plugin-detail-panel'
import { usePluginPageContext } from './context'
import { useDebounceFn } from 'ahooks'
@ -12,9 +12,8 @@ import Loading from '../../base/loading'
const PluginsPanel = () => {
const [filters, setFilters] = usePluginPageContext(v => [v.filters, v.setFilters]) as [FilterState, (filter: FilterState) => void]
const pluginList = usePluginPageContext(v => v.installedPluginList) as PluginDetail[]
const isPluginListLoading = usePluginPageContext(v => v.isPluginListLoading)
const mutateInstalledPluginList = usePluginPageContext(v => v.mutateInstalledPluginList)
const { data: pluginList, isLoading: isPluginListLoading } = useInstalledPluginList()
const invalidateInstalledPluginList = useInvalidateInstalledPluginList()
const { run: handleFilterChange } = useDebounceFn((filters: FilterState) => {
setFilters(filters)
@ -22,7 +21,7 @@ const PluginsPanel = () => {
const filteredList = useMemo(() => {
const { categories, searchQuery, tags } = filters
const filteredList = pluginList.filter((plugin) => {
const filteredList = pluginList?.plugins.filter((plugin) => {
return (
(categories.length === 0 || categories.includes(plugin.declaration.category))
&& (tags.length === 0 || tags.some(tag => plugin.declaration.tags.includes(tag)))
@ -40,16 +39,16 @@ const PluginsPanel = () => {
onFilterChange={handleFilterChange}
/>
</div>
{isPluginListLoading ? <Loading type='app' /> : filteredList.length > 0 ? (
{isPluginListLoading ? <Loading type='app' /> : (filteredList?.length ?? 0) > 0 ? (
<div className='flex px-12 items-start content-start gap-2 flex-grow self-stretch flex-wrap'>
<div className='w-full'>
<List pluginList={filteredList} />
<List pluginList={filteredList || []} />
</div>
</div>
) : (
<Empty />
)}
<PluginDetailPanel onDelete={() => mutateInstalledPluginList()}/>
<PluginDetailPanel onDelete={() => invalidateInstalledPluginList()}/>
</>
)
}