|
|
|
|
@ -1,4 +1,5 @@
|
|
|
|
|
import React, { useMemo, useRef, useState } from 'react'
|
|
|
|
|
'use client'
|
|
|
|
|
import React, { useEffect, useMemo, useRef, useState } from 'react'
|
|
|
|
|
import { MagicBox } from '@/app/components/base/icons/src/vender/solid/mediaAndDevices'
|
|
|
|
|
import { FileZip } from '@/app/components/base/icons/src/vender/solid/files'
|
|
|
|
|
import { Github } from '@/app/components/base/icons/src/vender/solid/general'
|
|
|
|
|
@ -13,12 +14,18 @@ import { SUPPORT_INSTALL_LOCAL_FILE_EXTENSIONS } from '@/config'
|
|
|
|
|
import { noop } from 'lodash-es'
|
|
|
|
|
import { useGlobalPublicStore } from '@/context/global-public-context'
|
|
|
|
|
|
|
|
|
|
type InstallMethod = {
|
|
|
|
|
icon: React.FC<{ className?: string }>
|
|
|
|
|
text: string
|
|
|
|
|
action: string
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const Empty = () => {
|
|
|
|
|
const { t } = useTranslation()
|
|
|
|
|
const fileInputRef = useRef<HTMLInputElement>(null)
|
|
|
|
|
const [selectedAction, setSelectedAction] = useState<string | null>(null)
|
|
|
|
|
const [selectedFile, setSelectedFile] = useState<File | null>(null)
|
|
|
|
|
const { enable_marketplace } = useGlobalPublicStore(s => s.systemFeatures)
|
|
|
|
|
const { enable_marketplace, plugin_installation_permission } = useGlobalPublicStore(s => s.systemFeatures)
|
|
|
|
|
const setActiveTab = usePluginPageContext(v => v.setActiveTab)
|
|
|
|
|
|
|
|
|
|
const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
|
|
|
|
@ -38,6 +45,22 @@ const Empty = () => {
|
|
|
|
|
return t('plugin.list.notFound')
|
|
|
|
|
}, [pluginList?.plugins.length, t, filters.categories.length, filters.tags.length, filters.searchQuery])
|
|
|
|
|
|
|
|
|
|
const [installMethods, setInstallMethods] = useState<InstallMethod[]>([])
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
const methods = []
|
|
|
|
|
if (enable_marketplace)
|
|
|
|
|
methods.push({ icon: MagicBox, text: t('plugin.source.marketplace'), action: 'marketplace' })
|
|
|
|
|
|
|
|
|
|
if (plugin_installation_permission.restrict_to_marketplace_only) {
|
|
|
|
|
setInstallMethods(methods)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
methods.push({ icon: Github, text: t('plugin.source.github'), action: 'github' })
|
|
|
|
|
methods.push({ icon: FileZip, text: t('plugin.source.local'), action: 'local' })
|
|
|
|
|
setInstallMethods(methods)
|
|
|
|
|
}
|
|
|
|
|
}, [plugin_installation_permission, enable_marketplace, t])
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className='relative z-0 w-full grow'>
|
|
|
|
|
{/* skeleton */}
|
|
|
|
|
@ -70,15 +93,7 @@ const Empty = () => {
|
|
|
|
|
accept={SUPPORT_INSTALL_LOCAL_FILE_EXTENSIONS}
|
|
|
|
|
/>
|
|
|
|
|
<div className='flex w-full flex-col gap-y-1'>
|
|
|
|
|
{[
|
|
|
|
|
...(
|
|
|
|
|
(enable_marketplace)
|
|
|
|
|
? [{ icon: MagicBox, text: t('plugin.list.source.marketplace'), action: 'marketplace' }]
|
|
|
|
|
: []
|
|
|
|
|
),
|
|
|
|
|
{ icon: Github, text: t('plugin.list.source.github'), action: 'github' },
|
|
|
|
|
{ icon: FileZip, text: t('plugin.list.source.local'), action: 'local' },
|
|
|
|
|
].map(({ icon: Icon, text, action }) => (
|
|
|
|
|
{installMethods.map(({ icon: Icon, text, action }) => (
|
|
|
|
|
<div
|
|
|
|
|
key={action}
|
|
|
|
|
className='flex cursor-pointer items-center gap-x-1 rounded-lg border-[0.5px] bg-components-button-secondary-bg
|
|
|
|
|
|