mirror of
https://github.com/langgenius/dify.git
synced 2026-05-11 09:03:04 -04:00
8581a68174
Co-authored-by: CodingOnStar <hanxujiang@dify.com> Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: yyh <yuanyouhuilyz@gmail.com> Co-authored-by: yyh <92089059+lyzno1@users.noreply.github.com>
49 lines
1.7 KiB
TypeScript
49 lines
1.7 KiB
TypeScript
'use client'
|
|
import type { FC } from 'react'
|
|
import { Dialog, DialogCloseButton, DialogContent, DialogTitle } from '@langgenius/dify-ui/dialog'
|
|
import * as React from 'react'
|
|
import { useTranslation } from 'react-i18next'
|
|
import KeyValueItem from '../base/key-value-item'
|
|
import { convertRepoToUrl } from '../install-plugin/utils'
|
|
|
|
const i18nPrefix = 'pluginInfoModal'
|
|
type Props = {
|
|
repository?: string
|
|
release?: string
|
|
packageName?: string
|
|
onHide: () => void
|
|
}
|
|
|
|
const PlugInfo: FC<Props> = ({
|
|
repository,
|
|
release,
|
|
packageName,
|
|
onHide,
|
|
}) => {
|
|
const { t } = useTranslation()
|
|
const labelWidthClassName = 'w-[96px]'
|
|
return (
|
|
<Dialog
|
|
open
|
|
onOpenChange={(open) => {
|
|
if (!open)
|
|
onHide()
|
|
}}
|
|
>
|
|
<DialogContent className="w-full max-w-[480px]! overflow-hidden! border-none text-left align-middle">
|
|
<DialogCloseButton data-testid="modal-close-button" />
|
|
<DialogTitle className="title-2xl-semi-bold text-text-primary">
|
|
{t(`${i18nPrefix}.title`, { ns: 'plugin' })}
|
|
</DialogTitle>
|
|
|
|
<div className="mt-5 space-y-3">
|
|
{repository && <KeyValueItem label={t(`${i18nPrefix}.repository`, { ns: 'plugin' })} labelWidthClassName={labelWidthClassName} value={`${convertRepoToUrl(repository)}`} valueMaxWidthClassName="max-w-[190px]" />}
|
|
{release && <KeyValueItem label={t(`${i18nPrefix}.release`, { ns: 'plugin' })} labelWidthClassName={labelWidthClassName} value={release} />}
|
|
{packageName && <KeyValueItem label={t(`${i18nPrefix}.packageName`, { ns: 'plugin' })} labelWidthClassName={labelWidthClassName} value={packageName} />}
|
|
</div>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|
|
export default React.memo(PlugInfo)
|