ngskcloud
/
gcgj-dify-1.7.0
17
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

merge feat/plugins

Browse Source
pull/12372/head
StyleZhang 1 year ago
parent 1ce7990df4 69daf4a027
commit b448900bb8
13 changed files with 141 additions and 80 deletions
Show Stats Download Patch File Download Diff File

2
api/core/rag/extractor/word_extractor.py
Unescape Escape View File

@ -50,7 +50,7 @@ class WordExtractor(BaseExtractor):
self.web_path = self.file_path self.web_path = self.file_path
# TODO: use a better way to handle the file # TODO: use a better way to handle the file
self.temp_file = tempfile.NamedTemporaryFile() # noqa: SIM115 self.temp_file = tempfile.NamedTemporaryFile()
self.temp_file.write(r.content) self.temp_file.write(r.content)
self.file_path = self.temp_file.name self.file_path = self.temp_file.name
elif not os.path.isfile(self.file_path): elif not os.path.isfile(self.file_path):

27
web/app/components/base/markdown.tsx
Unescape Escape View File

@ -9,7 +9,6 @@ import RemarkGfm from 'remark-gfm'
import RehypeRaw from 'rehype-raw' import RehypeRaw from 'rehype-raw'
import SyntaxHighlighter from 'react-syntax-highlighter' import SyntaxHighlighter from 'react-syntax-highlighter'
import { atelierHeathLight } from 'react-syntax-highlighter/dist/esm/styles/hljs' import { atelierHeathLight } from 'react-syntax-highlighter/dist/esm/styles/hljs'
import type { RefObject } from 'react'
import { Component, createContext, memo, useContext, useEffect, useMemo, useRef, useState } from 'react' import { Component, createContext, memo, useContext, useEffect, useMemo, useRef, useState } from 'react'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
import CopyBtn from '@/app/components/base/copy-btn' import CopyBtn from '@/app/components/base/copy-btn'
@ -78,28 +77,6 @@ export function PreCode(props: { children: any }) {
) )
} }
const useLazyLoad = (ref: RefObject<Element>): boolean => {
const [isIntersecting, setIntersecting] = useState<boolean>(false)
useEffect(() => {
const observer = new IntersectionObserver(([entry]) => {
if (entry.isIntersecting) {
setIntersecting(true)
observer.disconnect()
}
})
if (ref.current)
observer.observe(ref.current)
return () => {
observer.disconnect()
}
}, [ref])
return isIntersecting
}
const PreContext = createContext({ const PreContext = createContext({
// if children not in PreContext, just leave inline true // if children not in PreContext, just leave inline true
inline: true, inline: true,
@ -138,7 +115,7 @@ const CodeBlock: Components['code'] = memo(({ className, children, ...props }) =
try { try {
return JSON.parse(String(children).replace(/\n$/, '')) return JSON.parse(String(children).replace(/\n$/, ''))
} }
catch { } catch (error) { }
} }
return JSON.parse('{"title":{"text":"ECharts error - Wrong JSON format."}}') return JSON.parse('{"title":{"text":"ECharts error - Wrong JSON format."}}')
}, [language, children]) }, [language, children])
@ -167,7 +144,7 @@ const CodeBlock: Components['code'] = memo(({ className, children, ...props }) =
else { else {
return ( return (
<SyntaxHighlighter <SyntaxHighlighter
{...props} {...props as any}
style={atelierHeathLight} style={atelierHeathLight}
customStyle={{ customStyle={{
paddingLeft: 12, paddingLeft: 12,

4
web/app/components/base/skeleton/index.tsx
Unescape Escape View File

@ -3,7 +3,7 @@ import classNames from '@/utils/classnames'
type SkeletonProps = ComponentProps<'div'> type SkeletonProps = ComponentProps<'div'>
export const SkeletonContanier: FC<SkeletonProps> = (props) => { export const SkeletonContainer: FC<SkeletonProps> = (props) => {
const { className, children, ...rest } = props const { className, children, ...rest } = props
return ( return (
<div className={classNames('flex flex-col gap-1', className)} {...rest}> <div className={classNames('flex flex-col gap-1', className)} {...rest}>
@ -24,7 +24,7 @@ export const SkeletonRow: FC<SkeletonProps> = (props) => {
export const SkeletonRectangle: FC<SkeletonProps> = (props) => { export const SkeletonRectangle: FC<SkeletonProps> = (props) => {
const { className, children, ...rest } = props const { className, children, ...rest } = props
return ( return (
<div className={classNames('h-2 rounded-sm opacity-20 bg-text-tertiary my-1', className)} {...rest}> <div className={classNames('h-2 rounded-sm opacity-20 bg-text-quaternary my-1', className)} {...rest}>
{children} {children}
</div> </div>
) )

12
web/app/components/header/account-setting/model-provider-page/index.tsx
Unescape Escape View File

@ -102,11 +102,9 @@ const ModelProviderPage = ({ searchText }: Props) => {
onSaveCallback: () => { onSaveCallback: () => {
updateModelProviders() updateModelProviders()
if (configurationMethod === ConfigurationMethodEnum.predefinedModel) { provider.supported_model_types.forEach((type) => {
provider.supported_model_types.forEach((type) => { updateModelList(type)
updateModelList(type) })
})
}
if (configurationMethod === ConfigurationMethodEnum.customizableModel && provider.custom_configuration.status === CustomConfigurationStatusEnum.active) { if (configurationMethod === ConfigurationMethodEnum.customizableModel && provider.custom_configuration.status === CustomConfigurationStatusEnum.active) {
eventEmitter?.emit({ eventEmitter?.emit({
@ -218,7 +216,7 @@ const ModelProviderPage = ({ searchText }: Props) => {
</div> </div>
{!collapse && (isPluginsLoading || isAllPluginsLoading) && <Loading type='area' />} {!collapse && (isPluginsLoading || isAllPluginsLoading) && <Loading type='area' />}
{ {
!isPluginsLoading && ( !isPluginsLoading && !collapse && (
<List <List
marketplaceCollections={marketplaceCollections || []} marketplaceCollections={marketplaceCollections || []}
marketplaceCollectionPluginsMap={marketplaceCollectionPluginsMap || {}} marketplaceCollectionPluginsMap={marketplaceCollectionPluginsMap || {}}
@ -231,7 +229,7 @@ const ModelProviderPage = ({ searchText }: Props) => {
) )
} }
{ {
!isAllPluginsLoading && ( !isAllPluginsLoading && !collapse && (
<List <List
marketplaceCollections={[]} marketplaceCollections={[]}
marketplaceCollectionPluginsMap={{}} marketplaceCollectionPluginsMap={{}}

24
web/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item.tsx
Unescape Escape View File

@ -148,7 +148,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
/>} />}
<input <input
ref={numberInputRef} ref={numberInputRef}
className='shrink-0 block ml-4 pl-3 w-16 h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900' className='shrink-0 block ml-4 pl-3 w-16 h-8 appearance-none outline-none rounded-lg bg-components-input-bg-normal text-components-input-text-filled system-sm-regular'
type='number' type='number'
max={parameterRule.max} max={parameterRule.max}
min={parameterRule.min} min={parameterRule.min}
@ -173,7 +173,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
/>} />}
<input <input
ref={numberInputRef} ref={numberInputRef}
className='shrink-0 block ml-4 pl-3 w-16 h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900' className='shrink-0 block ml-4 pl-3 w-16 h-8 appearance-none outline-none rounded-lg bg-components-input-bg-normal text-components-input-text-filled system-sm-regular'
type='number' type='number'
max={parameterRule.max} max={parameterRule.max}
min={parameterRule.min} min={parameterRule.min}
@ -188,12 +188,12 @@ const ParameterItem: FC<ParameterItemProps> = ({
if (parameterRule.type === 'boolean') { if (parameterRule.type === 'boolean') {
return ( return (
<Radio.Group <Radio.Group
className='w-[200px] flex items-center' className='w-[178px] flex items-center'
value={renderValue ? 1 : 0} value={renderValue ? 1 : 0}
onChange={handleRadioChange} onChange={handleRadioChange}
> >
<Radio value={1} className='!mr-1 w-[94px]'>True</Radio> <Radio value={1} className='w-[83px]'>True</Radio>
<Radio value={0} className='w-[94px]'>False</Radio> <Radio value={0} className='w-[83px]'>False</Radio>
</Radio.Group> </Radio.Group>
) )
} }
@ -201,7 +201,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
if (parameterRule.type === 'string' && !parameterRule.options?.length) { if (parameterRule.type === 'string' && !parameterRule.options?.length) {
return ( return (
<input <input
className={cn(isInWorkflow ? 'w-[200px]' : 'w-full', 'ml-4 flex items-center px-3 h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900')} className={cn(isInWorkflow ? 'w-[178px]' : 'w-full', 'ml-4 flex items-center px-3 h-8 appearance-none outline-none rounded-lg bg-components-input-bg-normal text-components-input-text-filled system-sm-regular')}
value={renderValue as string} value={renderValue as string}
onChange={handleStringInputChange} onChange={handleStringInputChange}
/> />
@ -211,7 +211,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
if (parameterRule.type === 'text') { if (parameterRule.type === 'text') {
return ( return (
<textarea <textarea
className='w-full h-20 ml-4 px-1 rounded-lg bg-gray-100 outline-none text-[12px] text-gray-900' className='w-full h-20 ml-4 px-1 rounded-lg bg-components-input-bg-normal text-components-input-text-filled system-sm-regular'
value={renderValue as string} value={renderValue as string}
onChange={handleStringInputChange} onChange={handleStringInputChange}
/> />
@ -222,7 +222,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
return ( return (
<SimpleSelect <SimpleSelect
className='!py-0' className='!py-0'
wrapperClassName={cn(isInWorkflow ? '!w-[200px]' : 'w-full', 'ml-4 !h-8')} wrapperClassName={cn('w-full !h-8')}
defaultValue={renderValue as string} defaultValue={renderValue as string}
onSelect={handleSelect} onSelect={handleSelect}
items={parameterRule.options.map(option => ({ value: option, name: option }))} items={parameterRule.options.map(option => ({ value: option, name: option }))}
@ -232,7 +232,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
if (parameterRule.type === 'tag') { if (parameterRule.type === 'tag') {
return ( return (
<div className={cn(isInWorkflow ? 'w-[200px]' : 'w-full', 'ml-4')}> <div className={cn('w-full !h-8')}>
<TagInput <TagInput
items={renderValue as string[]} items={renderValue as string[]}
onChange={handleTagChange} onChange={handleTagChange}
@ -262,7 +262,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
) )
} }
<div <div
className='mr-0.5 text-[13px] font-medium text-gray-700 truncate' className='mr-0.5 system-xs-regular text-text-secondary truncate'
title={parameterRule.label[language] || parameterRule.label.en_US} title={parameterRule.label[language] || parameterRule.label.en_US}
> >
{parameterRule.label[language] || parameterRule.label.en_US} {parameterRule.label[language] || parameterRule.label.en_US}
@ -271,7 +271,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
parameterRule.help && ( parameterRule.help && (
<Tooltip <Tooltip
popupContent={( popupContent={(
<div className='w-[200px] whitespace-pre-wrap'>{parameterRule.help[language] || parameterRule.help.en_US}</div> <div className='w-[178px] whitespace-pre-wrap'>{parameterRule.help[language] || parameterRule.help.en_US}</div>
)} )}
popupClassName='mr-1' popupClassName='mr-1'
triggerClassName='mr-1 w-4 h-4 shrink-0' triggerClassName='mr-1 w-4 h-4 shrink-0'
@ -281,7 +281,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
</div> </div>
{ {
parameterRule.type === 'tag' && ( parameterRule.type === 'tag' && (
<div className={cn(!isInWorkflow && 'w-[200px]', 'text-gray-400 text-xs font-normal')}> <div className={cn(!isInWorkflow && 'w-[178px]', 'text-text-tertiary system-xs-regular')}>
{parameterRule?.tagPlaceholder?.[language]} {parameterRule?.tagPlaceholder?.[language]}
</div> </div>
) )

37
web/app/components/plugins/card/base/placeholder.tsx
Unescape Escape View File

@ -1,5 +1,6 @@
import { Group } from '../../../base/icons/src/vender/other' import { Group } from '../../../base/icons/src/vender/other'
import Title from './title' import Title from './title'
import { SkeletonContainer, SkeletonPoint, SkeletonRectangle, SkeletonRow } from '@/app/components/base/skeleton'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
type Props = { type Props = {
@ -17,7 +18,7 @@ const Placeholder = ({
}: Props) => { }: Props) => {
return ( return (
<div className={wrapClassName}> <div className={wrapClassName}>
<div className="flex"> <SkeletonRow>
<div <div
className='flex w-10 h-10 p-1 justify-center items-center gap-2 rounded-[10px] className='flex w-10 h-10 p-1 justify-center items-center gap-2 rounded-[10px]
border-[0.5px] border-components-panel-border bg-background-default backdrop-blur-sm'> border-[0.5px] border-components-panel-border bg-background-default backdrop-blur-sm'>
@ -25,24 +26,24 @@ const Placeholder = ({
<Group className='text-text-tertiary' /> <Group className='text-text-tertiary' />
</div> </div>
</div> </div>
<div className="ml-3 grow"> <div className="grow">
<div className="flex items-center h-5"> <SkeletonContainer>
{loadingFileName ? ( <div className="flex items-center h-5">
<Title title={loadingFileName} /> {loadingFileName ? (
) : ( <Title title={loadingFileName} />
<LoadingPlaceholder className="w-[260px]" /> ) : (
)} <SkeletonRectangle className="w-[260px]" />
</div> )}
<div className={cn('flex items-center h-4 space-x-0.5')}> </div>
<LoadingPlaceholder className="w-[41px]" /> <SkeletonRow className="h-4">
<span className='shrink-0 text-text-quaternary system-xs-regular'> <SkeletonRectangle className="w-[41px]" />
· <SkeletonPoint />
</span> <SkeletonRectangle className="w-[180px]" />
<LoadingPlaceholder className="w-[180px]" /> </SkeletonRow>
</div> </SkeletonContainer>
</div> </div>
</div> </SkeletonRow>
<LoadingPlaceholder className="mt-3 w-[420px]" /> <SkeletonRectangle className="mt-3 w-[420px]" />
</div> </div>
) )
} }

16
web/app/components/plugins/marketplace/empty/index.tsx
Unescape Escape View File

@ -29,20 +29,24 @@ const Empty = ({
'mr-3 mb-3 h-[144px] w-[calc((100%-36px)/4)] rounded-xl bg-background-section-burn', 'mr-3 mb-3 h-[144px] w-[calc((100%-36px)/4)] rounded-xl bg-background-section-burn',
index % 4 === 3 && 'mr-0', index % 4 === 3 && 'mr-0',
index > 11 && 'mb-0', index > 11 && 'mb-0',
lightCard && 'bg-background-default-lighter', lightCard && 'bg-background-default-lighter opacity-75',
)} )}
> >
</div> </div>
)) ))
} }
<div {
className='absolute inset-0 bg-marketplace-plugin-empty z-[1]' !lightCard && (
></div> <div
className='absolute inset-0 bg-marketplace-plugin-empty z-[1]'
></div>
)
}
<div className='absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-[2] flex flex-col items-center'> <div className='absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-[2] flex flex-col items-center'>
<div className='relative flex items-center justify-center mb-3 w-14 h-14 rounded-xl border border-dashed border-divider-deep bg-components-card-bg shadow-lg'> <div className='relative flex items-center justify-center mb-3 w-14 h-14 rounded-xl border border-dashed border-divider-deep bg-components-card-bg shadow-lg'>
<Group className='w-5 h-5' /> <Group className='w-5 h-5' />
<Line className='absolute -right-[1px] top-1/2 -translate-y-1/2' /> <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-[-1px] top-1/2 -translate-y-1/2' />
<Line className='absolute top-0 left-1/2 -translate-x-1/2 -translate-y-1/2 rotate-90' /> <Line className='absolute top-0 left-1/2 -translate-x-1/2 -translate-y-1/2 rotate-90' />
<Line className='absolute top-full left-1/2 -translate-x-1/2 -translate-y-1/2 rotate-90' /> <Line className='absolute top-full left-1/2 -translate-x-1/2 -translate-y-1/2 rotate-90' />
</div> </div>

3
web/app/components/plugins/marketplace/list/index.tsx
Unescape Escape View File

@ -14,6 +14,7 @@ type ListProps = {
locale: string locale: string
cardContainerClassName?: string cardContainerClassName?: string
cardRender?: (plugin: Plugin) => JSX.Element | null cardRender?: (plugin: Plugin) => JSX.Element | null
onMoreClick?: () => void
} }
const List = ({ const List = ({
marketplaceCollections, marketplaceCollections,
@ -23,6 +24,7 @@ const List = ({
locale, locale,
cardContainerClassName, cardContainerClassName,
cardRender, cardRender,
onMoreClick,
}: ListProps) => { }: ListProps) => {
return ( return (
<> <>
@ -35,6 +37,7 @@ const List = ({
locale={locale} locale={locale}
cardContainerClassName={cardContainerClassName} cardContainerClassName={cardContainerClassName}
cardRender={cardRender} cardRender={cardRender}
onMoreClick={onMoreClick}
/> />
) )
} }

14
web/app/components/plugins/marketplace/list/list-with-collection.tsx
Unescape Escape View File

@ -12,6 +12,7 @@ type ListWithCollectionProps = {
locale: string locale: string
cardContainerClassName?: string cardContainerClassName?: string
cardRender?: (plugin: Plugin) => JSX.Element | null cardRender?: (plugin: Plugin) => JSX.Element | null
onMoreClick?: () => void
} }
const ListWithCollection = ({ const ListWithCollection = ({
marketplaceCollections, marketplaceCollections,
@ -20,6 +21,7 @@ const ListWithCollection = ({
locale, locale,
cardContainerClassName, cardContainerClassName,
cardRender, cardRender,
// onMoreClick,
}: ListWithCollectionProps) => { }: ListWithCollectionProps) => {
return ( return (
<> <>
@ -29,8 +31,16 @@ const ListWithCollection = ({
key={collection.name} key={collection.name}
className='py-3' className='py-3'
> >
<div className='title-xl-semi-bold text-text-primary'>{collection.label[getLanguage(locale)]}</div> <div className='flex justify-between'>
<div className='system-xs-regular text-text-tertiary'>{collection.description[getLanguage(locale)]}</div> <div>
<div className='title-xl-semi-bold text-text-primary'>{collection.label[getLanguage(locale)]}</div>
<div className='system-xs-regular text-text-tertiary'>{collection.description[getLanguage(locale)]}</div>
</div>
{/* <div
className='system-xs-regular text-text-tertiary cursor-pointer hover:underline'
onClick={() => onMoreClick?.()}
>more</div> */}
</div>
<div className={cn( <div className={cn(
'grid grid-cols-4 gap-3 mt-2', 'grid grid-cols-4 gap-3 mt-2',
cardContainerClassName, cardContainerClassName,

45
web/app/components/tools/marketplace/hooks.ts
Unescape Escape View File

@ -1,6 +1,9 @@
import { import {
useCallback,
useEffect, useEffect,
useMemo, useMemo,
useRef,
useState,
} from 'react' } from 'react'
import { import {
useMarketplaceCollectionsAndPlugins, useMarketplaceCollectionsAndPlugins,
@ -28,10 +31,22 @@ export const useMarketplace = (searchPluginText: string, filterPluginTags: strin
queryPlugins, queryPlugins,
queryPluginsWithDebounced, queryPluginsWithDebounced,
isLoading: isPluginsLoading, isLoading: isPluginsLoading,
total: pluginsTotal,
} = useMarketplacePlugins() } = useMarketplacePlugins()
const [page, setPage] = useState(1)
const pageRef = useRef(page)
const searchPluginTextRef = useRef(searchPluginText)
const filterPluginTagsRef = useRef(filterPluginTags)
useEffect(() => {
searchPluginTextRef.current = searchPluginText
filterPluginTagsRef.current = filterPluginTags
}, [searchPluginText, filterPluginTags])
useEffect(() => { useEffect(() => {
if ((searchPluginText || filterPluginTags.length) && isSuccess) { if ((searchPluginText || filterPluginTags.length) && isSuccess) {
setPage(1)
pageRef.current = 1
if (searchPluginText) { if (searchPluginText) {
queryPluginsWithDebounced({ queryPluginsWithDebounced({
category: PluginType.tool, category: PluginType.tool,
@ -39,6 +54,7 @@ export const useMarketplace = (searchPluginText: string, filterPluginTags: strin
tags: filterPluginTags, tags: filterPluginTags,
exclude, exclude,
type: 'plugin', type: 'plugin',
page: pageRef.current,
}) })
return return
} }
@ -48,6 +64,7 @@ export const useMarketplace = (searchPluginText: string, filterPluginTags: strin
tags: filterPluginTags, tags: filterPluginTags,
exclude, exclude,
type: 'plugin', type: 'plugin',
page: pageRef.current,
}) })
} }
else { else {
@ -63,10 +80,38 @@ export const useMarketplace = (searchPluginText: string, filterPluginTags: strin
} }
}, [searchPluginText, filterPluginTags, queryPlugins, queryMarketplaceCollectionsAndPlugins, queryPluginsWithDebounced, resetPlugins, exclude, isSuccess]) }, [searchPluginText, filterPluginTags, queryPlugins, queryMarketplaceCollectionsAndPlugins, queryPluginsWithDebounced, resetPlugins, exclude, isSuccess])
const handleScroll = useCallback((e: Event) => {
const target = e.target as HTMLDivElement
const {
scrollTop,
scrollHeight,
clientHeight,
} = target
if (scrollTop + clientHeight >= scrollHeight - 5 && scrollTop > 0) {
const searchPluginText = searchPluginTextRef.current
const filterPluginTags = filterPluginTagsRef.current
if (pluginsTotal && plugins && pluginsTotal > plugins.length && (!!searchPluginText || !!filterPluginTags.length)) {
setPage(pageRef.current + 1)
pageRef.current++
queryPlugins({
category: PluginType.tool,
query: searchPluginText,
tags: filterPluginTags,
exclude,
type: 'plugin',
page: pageRef.current,
})
}
}
}, [exclude, plugins, pluginsTotal, queryPlugins])
return { return {
isLoading: isLoading || isPluginsLoading, isLoading: isLoading || isPluginsLoading,
marketplaceCollections, marketplaceCollections,
marketplaceCollectionPluginsMap, marketplaceCollectionPluginsMap,
plugins, plugins,
handleScroll,
page,
} }
} }

28
web/app/components/tools/marketplace/index.tsx
Unescape Escape View File

@ -1,3 +1,7 @@
import {
useEffect,
useRef,
} from 'react'
import { import {
RiArrowRightUpLine, RiArrowRightUpLine,
RiArrowUpDoubleLine, RiArrowUpDoubleLine,
@ -21,15 +25,33 @@ const Marketplace = ({
}: MarketplaceProps) => { }: MarketplaceProps) => {
const locale = getLocaleOnClient() const locale = getLocaleOnClient()
const { t } = useTranslation() const { t } = useTranslation()
const { const {
isLoading, isLoading,
marketplaceCollections, marketplaceCollections,
marketplaceCollectionPluginsMap, marketplaceCollectionPluginsMap,
plugins, plugins,
handleScroll,
page,
} = useMarketplace(searchPluginText, filterPluginTags) } = useMarketplace(searchPluginText, filterPluginTags)
const containerRef = useRef<HTMLDivElement>(null)
useEffect(() => {
const container = containerRef.current
if (container)
container.addEventListener('scroll', handleScroll)
return () => {
if (container)
container.removeEventListener('scroll', handleScroll)
}
}, [handleScroll])
return ( return (
<div className='flex flex-col shrink-0 sticky bottom-[-442px] h-[530px] overflow-y-auto px-12 py-2 pt-0 bg-background-default-subtle'> <div
ref={containerRef}
className='grow flex flex-col shrink-0 sticky bottom-[-442px] h-[530px] overflow-y-auto px-12 py-2 pt-0 bg-background-default-subtle'
>
<RiArrowUpDoubleLine <RiArrowUpDoubleLine
className='absolute top-2 left-1/2 -translate-x-1/2 w-4 h-4 text-text-quaternary cursor-pointer' className='absolute top-2 left-1/2 -translate-x-1/2 w-4 h-4 text-text-quaternary cursor-pointer'
onClick={() => onMarketplaceScroll()} onClick={() => onMarketplaceScroll()}
@ -67,14 +89,14 @@ const Marketplace = ({
</div> </div>
</div> </div>
{ {
isLoading && ( isLoading && page === 1 && (
<div className='absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2'> <div className='absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2'>
<Loading /> <Loading />
</div> </div>
) )
} }
{ {
!isLoading && ( (!isLoading || page > 1) && (
<List <List
marketplaceCollections={marketplaceCollections || []} marketplaceCollections={marketplaceCollections || []}
marketplaceCollectionPluginsMap={marketplaceCollectionPluginsMap || {}} marketplaceCollectionPluginsMap={marketplaceCollectionPluginsMap || {}}

4
web/app/components/tools/provider-list.tsx
Unescape Escape View File

@ -95,7 +95,7 @@ const ProviderList = () => {
</div> </div>
{(filteredCollectionList.length > 0 || activeTab !== 'builtin') && ( {(filteredCollectionList.length > 0 || activeTab !== 'builtin') && (
<div className={cn( <div className={cn(
'relative grid content-start grid-cols-1 gap-4 px-12 pt-2 pb-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 grow shrink-0', 'relative grid content-start grid-cols-1 gap-4 px-12 pt-2 pb-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 shrink-0',
)}> )}>
{activeTab === 'api' && <CustomCreateCard onRefreshData={refetch} />} {activeTab === 'api' && <CustomCreateCard onRefreshData={refetch} />}
{filteredCollectionList.map(collection => ( {filteredCollectionList.map(collection => (
@ -125,7 +125,7 @@ const ProviderList = () => {
</div> </div>
)} )}
{!filteredCollectionList.length && activeTab === 'builtin' && ( {!filteredCollectionList.length && activeTab === 'builtin' && (
<Empty lightCard text={t('tools.noTools')} className='px-12' /> <Empty lightCard text={t('tools.noTools')} className='px-12 h-[224px]' />
)} )}
{ {
enable_marketplace && activeTab === 'builtin' && ( enable_marketplace && activeTab === 'builtin' && (

5
web/package.json
Unescape Escape View File

@ -54,7 +54,8 @@
"dayjs": "^1.11.13", "dayjs": "^1.11.13",
"echarts": "^5.5.1", "echarts": "^5.5.1",
"echarts-for-react": "^3.0.2", "echarts-for-react": "^3.0.2",
"emoji-mart": "^5.6.0", "elkjs": "^0.9.3",
"emoji-mart": "^5.5.2",
"fast-deep-equal": "^3.1.3", "fast-deep-equal": "^3.1.3",
"globals": "^15.11.0", "globals": "^15.11.0",
"i18next": "^23.16.4", "i18next": "^23.16.4",
@ -155,7 +156,7 @@
"@types/uuid": "^10.0.0", "@types/uuid": "^10.0.0",
"autoprefixer": "^10.4.20", "autoprefixer": "^10.4.20",
"bing-translate-api": "^4.0.2", "bing-translate-api": "^4.0.2",
"code-inspector-plugin": "^0.17.4", "code-inspector-plugin": "^0.18.1",
"cross-env": "^7.0.3", "cross-env": "^7.0.3",
"eslint": "^9.13.0", "eslint": "^9.13.0",
"eslint-config-next": "^15.0.0", "eslint-config-next": "^15.0.0",

Write Preview
Loading…
Cancel
Save