mrege

docker/docker-compose.yaml

@@ -324,6 +324,8 @@ services:
     environment:
       CONSOLE_API_URL: ${CONSOLE_API_URL:-}
       APP_API_URL: ${APP_API_URL:-}
+      MARKETPLACE_API_URL: ${MARKETPLACE_API_URL:-}
+      MARKETPLACE_URL: ${MARKETPLACE_URL:-}
       SENTRY_DSN: ${WEB_SENTRY_DSN:-}
       NEXT_TELEMETRY_DISABLED: ${NEXT_TELEMETRY_DISABLED:-0}
       TEXT_GENERATION_TIMEOUT_MS: ${TEXT_GENERATION_TIMEOUT_MS:-60000}

web/Dockerfile

@@ -41,6 +41,8 @@ ENV EDITION=SELF_HOSTED
 ENV DEPLOY_ENV=PRODUCTION
 ENV CONSOLE_API_URL=http://127.0.0.1:5001
 ENV APP_API_URL=http://127.0.0.1:5001
+ENV MARKETPLACE_API_URL=http://127.0.0.1:5001
+ENV MARKETPLACE_URL=http://127.0.0.1:5001
 ENV PORT=3000
 ENV NEXT_TELEMETRY_DISABLED=1
 

web/app/(commonLayout)/plugins/test/card/page.tsx

@@ -1,27 +1,51 @@
-import { handleDelete } from './actions'
+'use client'
 import Card from '@/app/components/plugins/card'
 import { customTool, extensionDallE, modelGPT4, toolNotion } from '@/app/components/plugins/card/card-mock'
-import PluginItem from '@/app/components/plugins/plugin-item'
+// import PluginItem from '@/app/components/plugins/plugin-item'
 import CardMoreInfo from '@/app/components/plugins/card/card-more-info'
-import ProviderCard from '@/app/components/plugins/provider-card'
+// import ProviderCard from '@/app/components/plugins/provider-card'
 import Badge from '@/app/components/base/badge'
+import InstallBundle from '@/app/components/plugins/install-plugin/install-bundle'
 
-const PluginList = async () => {
+const PluginList = () => {
   const pluginList = [toolNotion, extensionDallE, modelGPT4, customTool]
 
   return (
     <div className='pb-3 bg-white'>
+      <InstallBundle onClose={() => { }} fromDSLPayload={[
+        {
+          type: 'marketplace',
+          value: {
+            plugin_unique_identifier: 'langgenius/google:0.0.2@dcb354c9d0fee60e6e9c9eb996e1e485bbef343ba8cd545c0cfb3ec80970f6f1',
+          },
+        },
+        {
+          type: 'github',
+          value: {
+            repo: 'YIXIAO0/test',
+            version: '1.11.5',
+            package: 'test.difypkg',
+            github_plugin_unique_identifier: 'yixiao0/test:0.0.1@3592166c87afcf944b4f13f27467a5c8f9e00bd349cb42033a072734a37431b4',
+          },
+        },
+        {
+          type: 'marketplace',
+          value: {
+            plugin_unique_identifier: 'langgenius/openai:0.0.1@f88fdb98d104466db16a425bfe3af8c1bcad45047a40fb802d98a989ac57a5a3',
+          },
+        },
+      ]} />
       <div className='mx-3 '>
-        <h2 className='my-3'>Dify Plugin list</h2>
-        <div className='grid grid-cols-2 gap-3'>
+        {/* <h2 className='my-3'>Dify Plugin list</h2> */}
+        {/* <div className='grid grid-cols-2 gap-3'>
           {pluginList.map((plugin, index) => (
             <PluginItem
               key={index}
               payload={plugin as any}
               onDelete={handleDelete}
             />
           ))}
-        </div>
+        </div> */}
 
         <h2 className='my-3'>Install Plugin / Package under bundle</h2>
         <div className='w-[512px] rounded-2xl bg-background-section-burn p-2'>
@@ -33,21 +57,21 @@ const PluginList = async () => {
             }
           />
         </div>
-        <h3 className='my-1'>Installed</h3>
+        {/* <h3 className='my-1'>Installed</h3>
         <div className='w-[512px] rounded-2xl bg-background-section-burn p-2'>
           <Card
             payload={toolNotion as any}
             descriptionLineRows={1}
             installed
           />
-        </div>
+        </div> */}
 
-        <h3 className='my-1'>Install model provide</h3>
+        {/* <h3 className='my-1'>Install model provide</h3>
         <div className='grid grid-cols-2 gap-3'>
           {pluginList.map((plugin, index) => (
             <ProviderCard key={index} payload={plugin as any} />
           ))}
-        </div>
+        </div> */}
 
         <div className='my-3 h-[px] bg-gray-50'></div>
         <h2 className='my-3'>Marketplace Plugin list</h2>
@@ -67,8 +91,8 @@ const PluginList = async () => {
   )
 }
 
-export const metadata = {
-  title: 'Plugins - Card',
-}
+// export const metadata = {
+//   title: 'Plugins - Card',
+// }
 
 export default PluginList

web/app/components/app/configuration/base/feature-panel/index.tsx

@@ -23,7 +23,7 @@ const FeaturePanel: FC<IFeaturePanelProps> = ({
   children,
 }) => {
   return (
-    <div className={cn('rounded-xl border-t-[0.5px] border-l-[0.5px] bg-background-section-burn pb-3', noBodySpacing && '!pb-0', className)}>
+    <div className={cn('rounded-xl border-t-[0.5px] border-l-[0.5px] bg-background-section-burn pb-3', noBodySpacing && 'pb-0', className)}>
       {/* Header */}
       <div className={cn('px-3 pt-2', hasHeaderBottomBorder && 'border-b border-divider-subtle')}>
         <div className='flex justify-between items-center h-8'>

web/app/components/app/configuration/config/agent/agent-tools/index.tsx

@@ -92,6 +92,7 @@ const AgentTools: FC = () => {
         tool_name: tool.tool_name,
         tool_label: tool.tool_label,
         tool_parameters: tool.params,
+        notAuthor: !tool.is_team_authorization,
         enabled: true,
       })
     })
@@ -101,7 +102,7 @@ const AgentTools: FC = () => {
   return (
     <>
       <Panel
-        className="mt-2"
+        className={cn('mt-2', tools.length === 0 && 'pb-2')}
         noBodySpacing={tools.length === 0}
         headerIcon={
           <RiHammerFill className='w-4 h-4 text-primary-500' />

web/app/components/app/create-from-dsl-modal/index.tsx

@@ -21,6 +21,7 @@ import AppsFull from '@/app/components/billing/apps-full-in-dialog'
 import { NEED_REFRESH_APP_LIST_KEY } from '@/config'
 import { getRedirection } from '@/utils/app-redirection'
 import cn from '@/utils/classnames'
+import { useMutationCheckDependenciesBeforeImportDSL } from '@/service/use-plugins'
 
 type CreateFromDSLModalProps = {
   show: boolean
@@ -43,6 +44,7 @@ const CreateFromDSLModal = ({ show, onSuccess, onClose, activeTab = CreateFromDS
   const [fileContent, setFileContent] = useState<string>()
   const [currentTab, setCurrentTab] = useState(activeTab)
   const [dslUrlValue, setDslUrlValue] = useState(dslUrl)
+  const { mutateAsync } = useMutationCheckDependenciesBeforeImportDSL()
 
   const readFile = (file: File) => {
     const reader = new FileReader()
@@ -78,11 +80,21 @@ const CreateFromDSLModal = ({ show, onSuccess, onClose, activeTab = CreateFromDS
       let app
 
       if (currentTab === CreateFromDSLModalTab.FROM_FILE) {
+        const leakedData = await mutateAsync({ dslString: fileContent })
+        if (leakedData?.leaked.length) {
+          isCreatingRef.current = false
+          return
+        }
         app = await importApp({
           data: fileContent || '',
         })
       }
       if (currentTab === CreateFromDSLModalTab.FROM_URL) {
+        const leakedData = await mutateAsync({ url: dslUrlValue })
+        if (leakedData?.leaked.length) {
+          isCreatingRef.current = false
+          return
+        }
         app = await importAppFromUrl({
           url: dslUrlValue || '',
         })

web/app/components/base/audio-gallery/AudioPlayer.module.css

@@ -2,15 +2,15 @@
   display: flex;
   flex-direction: row;
   align-items: center;
-  background-color: #ffffff;
+  background-color: var(--color-components-chat-input-audio-bg-alt);
   border-radius: 10px;
   padding: 8px;
   min-width: 240px;
   max-width: 420px;
   max-height: 40px;
   backdrop-filter: blur(5px);
-  border: 1px solid rgba(16, 24, 40, 0.08);
-  box-shadow: 0 1px 2px rgba(9, 9, 11, 0.05);
+  border: 1px solid var(--color-components-panel-border-subtle);
+  box-shadow: 0 1px 2px var(--color-shadow-shadow-3);
   gap: 8px;
 }
 
@@ -19,8 +19,8 @@
   width: 16px;
   height: 16px;
   border-radius: 50%;
-  background-color: #296DFF;
-  color: white;
+  background-color: var(--color-components-button-primary-bg);
+  color: var(--color-components-chat-input-audio-bg-alt);
   border: none;
   cursor: pointer;
   align-items: center;
@@ -30,16 +30,15 @@
 }
 
 .playButton:hover {
-  background-color: #3367d6;
+  background-color: var(--color-components-button-primary-bg-hover);
 }
 
 .playButton:disabled {
-  background-color: #bdbdbf;
+  background-color: var(--color-components-button-primary-bg-disabled);
 }
 
 .audioControls {
   flex-grow: 1;
-
 }
 
 .progressBarContainer {
@@ -76,8 +75,8 @@
 
 .timeDisplay {
   /* position: absolute; */
-  color: #296DFF;
-  border-radius: 2px;
+  color: var(--color-text-accent-secondary);
+  font-size: 12px;
   order: 0;
   height: 100%;
   width: 50px;
@@ -97,7 +96,6 @@
 } */
 
 .duration {
-  background-color: rgba(255, 255, 255, 0.8);
   padding: 2px 4px;
   border-radius: 10px;
 }
@@ -114,6 +112,6 @@
 }
 
 .playButton svg path,
-.playButton svg rect{
-   fill:currentColor;
-}
+.playButton svg rect {
+  fill: currentColor;
+}

web/app/components/base/icons/src/image/llm/BaichuanTextCn.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './BaichuanTextCn.module.css'
 import cn from '@/utils/classnames'
+import s from './BaichuanTextCn.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/Minimax.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './Minimax.module.css'
 import cn from '@/utils/classnames'
+import s from './Minimax.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/MinimaxText.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './MinimaxText.module.css'
 import cn from '@/utils/classnames'
+import s from './MinimaxText.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/Tongyi.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './Tongyi.module.css'
 import cn from '@/utils/classnames'
+import s from './Tongyi.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/TongyiText.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './TongyiText.module.css'
 import cn from '@/utils/classnames'
+import s from './TongyiText.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/TongyiTextCn.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './TongyiTextCn.module.css'
 import cn from '@/utils/classnames'
+import s from './TongyiTextCn.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/Wxyy.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './Wxyy.module.css'
 import cn from '@/utils/classnames'
+import s from './Wxyy.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/WxyyText.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './WxyyText.module.css'
 import cn from '@/utils/classnames'
+import s from './WxyyText.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },

web/app/components/base/icons/src/image/llm/WxyyTextCn.tsx

@@ -2,8 +2,8 @@
 // DON NOT EDIT IT MANUALLY
 
 import * as React from 'react'
-import s from './WxyyTextCn.module.css'
 import cn from '@/utils/classnames'
+import s from './WxyyTextCn.module.css'
 
 const Icon = React.forwardRef<HTMLSpanElement, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>((
   { className, ...restProps },