youngkingdom/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-04-25 13:16:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: install package from GitHub

Browse Source
This commit is contained in:
Yi
2024-11-01 14:55:56 +08:00
parent b5be6bacef
commit c503e8ebc9
10 changed files with 239 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
web/app/components/plugins/install-plugin/install-from-github/steps/loaded.tsx Normal file
View File

@ -0,0 +1,55 @@
'use client'
import React from 'react'
import Button from '@/app/components/base/button'
import type { PluginDeclaration } from '../../../types'
import Card from '../../../card'
import Badge, { BadgeState } from '@/app/components/base/badge/index'
import { pluginManifestToCardPluginProps } from '../../utils'
import { useTranslation } from 'react-i18next'
type LoadedProps = {
isLoading: boolean
payload: PluginDeclaration
onBack: () => void
onInstall: () => void
}
const i18nPrefix = 'plugin.installModal'
const Loaded: React.FC<LoadedProps> = ({ isLoading, payload, onBack, onInstall }) => {
const { t } = useTranslation()
return (
<>
<div className='text-text-secondary system-md-regular'>
<p>{t(`${i18nPrefix}.readyToInstall`)}</p>
</div>
<div className='flex p-2 items-start content-start gap-1 self-stretch flex-wrap rounded-2xl bg-background-section-burn'>
<Card
className='w-full'
payload={pluginManifestToCardPluginProps(payload)}
titleLeft={<Badge className='mx-1' size="s" state={BadgeState.Default}>{payload.version}</Badge>}
/>
</div>
<div className='flex justify-end items-center gap-2 self-stretch mt-4'>
<Button
variant='secondary'
className='min-w-[72px]'
onClick={onBack}
>
{t('plugin.installModal.back')}
</Button>
<Button
variant='primary'
className='min-w-[72px]'
onClick={onInstall}
disabled={isLoading}
>
{t('plugin.installModal.next')}
</Button>
</div>
</>
)
}
export default Loaded

39
web/app/components/plugins/install-plugin/install-from-github/steps/setVersion.tsx → web/app/components/plugins/install-plugin/install-from-github/steps/selectPackage.tsx
View File

@ -1,18 +1,32 @@
'use client'
import React from 'react'
import type { Item } from '@/app/components/base/select'
import { PortalSelect } from '@/app/components/base/select'
import Button from '@/app/components/base/button'
import { useTranslation } from 'react-i18next'
type SetVersionProps = {
type SelectPackageProps = {
selectedVersion: string
versions: Item[]
onSelect: (item: Item) => void
onSelectVersion: (item: Item) => void
selectedPackage: string
packages: Item[]
onSelectPackage: (item: Item) => void
onNext: () => void
onBack: () => void
}
const SetVersion: React.FC<SetVersionProps> = ({ selectedVersion, versions, onSelect, onNext, onBack }) => {
const SelectPackage: React.FC<SelectPackageProps> = ({
selectedVersion,
versions,
onSelectVersion,
selectedPackage,
packages,
onSelectPackage,
onNext,
onBack,
}) => {
const { t } = useTranslation()
return (
<>
@ -24,11 +38,24 @@ const SetVersion: React.FC<SetVersionProps> = ({ selectedVersion, versions, onSe
</label>
<PortalSelect
value={selectedVersion}
onSelect={onSelect}
onSelect={onSelectVersion}
items={versions}
placeholder={t('plugin.installFromGitHub.selectVersionPlaceholder') || ''}
popupClassName='w-[432px] z-[1001]'
/>
<label
htmlFor='package'
className='flex flex-col justify-center items-start self-stretch text-text-secondary'
>
<span className='system-sm-semibold'>{t('plugin.installFromGitHub.selectPackage')}</span>
</label>
<PortalSelect
value={selectedPackage}
onSelect={onSelectPackage}
items={packages}
placeholder={t('plugin.installFromGitHub.selectPackagePlaceholder') || ''}
popupClassName='w-[432px] z-[1001]'
/>
<div className='flex justify-end items-center gap-2 self-stretch mt-4'>
<Button
variant='secondary'
@ -41,7 +68,7 @@ const SetVersion: React.FC<SetVersionProps> = ({ selectedVersion, versions, onSe
variant='primary'
className='min-w-[72px]'
onClick={onNext}
disabled={!selectedVersion}
disabled={!selectedVersion || !selectedPackage}
>
{t('plugin.installModal.next')}
</Button>
@ -50,4 +77,4 @@ const SetVersion: React.FC<SetVersionProps> = ({ selectedVersion, versions, onSe
)
}
export default SetVersion
export default SelectPackage

53
web/app/components/plugins/install-plugin/install-from-github/steps/setPackage.tsx
View File

@ -1,53 +0,0 @@
import React from 'react'
import type { Item } from '@/app/components/base/select'
import { PortalSelect } from '@/app/components/base/select'
import Button from '@/app/components/base/button'
import { useTranslation } from 'react-i18next'
type SetPackageProps = {
selectedPackage: string
packages: Item[]
onSelect: (item: Item) => void
onInstall: () => void
onBack: () => void
}
const SetPackage: React.FC<SetPackageProps> = ({ selectedPackage, packages, onSelect, onInstall, onBack }) => {
const { t } = useTranslation()
return (
<>
<label
htmlFor='package'
className='flex flex-col justify-center items-start self-stretch text-text-secondary'
>
<span className='system-sm-semibold'>{t('plugin.installFromGitHub.selectPackage')}</span>
</label>
<PortalSelect
value={selectedPackage}
onSelect={onSelect}
items={packages}
placeholder={t('plugin.installFromGitHub.selectPackagePlaceholder') || ''}
popupClassName='w-[432px] z-[1001]'
/>
<div className='flex justify-end items-center gap-2 self-stretch mt-4'>
<Button
variant='secondary'
className='min-w-[72px]'
onClick={onBack}
>
{t('plugin.installModal.back')}
</Button>
<Button
variant='primary'
className='min-w-[72px]'
onClick={onInstall}
disabled={!selectedPackage}
>
{t('plugin.installModal.install')}
</Button>
</div>
</>
)
}
export default SetPackage

2
web/app/components/plugins/install-plugin/install-from-github/steps/setURL.tsx
View File

@ -1,3 +1,5 @@
'use client'
import React from 'react'
import Button from '@/app/components/base/button'
import { useTranslation } from 'react-i18next'