96dba2690d
chore: add facades refactor: core module export refactor: inference plugin - deprecate function registering (#537) * refactor: revamp inference plugin as class - deprecate function registering * refactor: monitoring plugin - deprecate service registering (#538) refactor: revamp inference plugin as class - deprecate function registering chore: update import refactor: plugin revamp - model management chore: update build steps and remove experimental plugins refactor: remove pluggable electron chore: add sorting for conversations chore: build plugins for testing chore: consistent plugin directory name chore: docs chore: fix CI chore: update conversation prefix
67 lines
1.8 KiB
TypeScript
67 lines
1.8 KiB
TypeScript
import DownloadModelContent from '../DownloadModelContent'
|
|
import ModelDownloadButton from '../ModelDownloadButton'
|
|
import ModelDownloadingButton from '../ModelDownloadingButton'
|
|
import { useAtomValue } from 'jotai'
|
|
import { modelDownloadStateAtom } from '@helpers/atoms/DownloadState.atom'
|
|
import { Model } from '@janhq/core/lib/types'
|
|
|
|
type Props = {
|
|
model: Model
|
|
isRecommend: boolean
|
|
required?: string
|
|
onDownloadClick?: (model: Model) => void
|
|
}
|
|
|
|
const AvailableModelCard: React.FC<Props> = ({
|
|
model,
|
|
isRecommend,
|
|
required,
|
|
onDownloadClick,
|
|
}) => {
|
|
const downloadState = useAtomValue(modelDownloadStateAtom)
|
|
|
|
let isDownloading = false
|
|
let total = 0
|
|
let transferred = 0
|
|
|
|
if (model._id && downloadState[model._id]) {
|
|
isDownloading =
|
|
downloadState[model._id].error == null &&
|
|
downloadState[model._id].percent < 1
|
|
|
|
if (isDownloading) {
|
|
total = downloadState[model._id].size.total
|
|
transferred = downloadState[model._id].size.transferred
|
|
}
|
|
}
|
|
|
|
const downloadButton = isDownloading ? (
|
|
<div className="flex w-1/5 items-start justify-end">
|
|
<ModelDownloadingButton total={total} value={transferred} />
|
|
</div>
|
|
) : (
|
|
<div className="flex w-1/5 items-center justify-end">
|
|
<ModelDownloadButton callback={() => onDownloadClick?.(model)} />
|
|
</div>
|
|
)
|
|
|
|
return (
|
|
<div className="rounded-lg border border-gray-200">
|
|
<div className="flex justify-between gap-2.5 px-3 py-4">
|
|
<DownloadModelContent
|
|
required={required}
|
|
author={model.author}
|
|
description={model.shortDescription}
|
|
isRecommend={isRecommend}
|
|
name={model.name}
|
|
type={'LLM'}
|
|
/>
|
|
{downloadButton}
|
|
</div>
|
|
{/* <ViewModelDetailButton callback={handleViewDetails} /> */}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default AvailableModelCard
|