46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import { ImportingModel } from '@janhq/core/.'
|
|
import { useSetAtom } from 'jotai'
|
|
|
|
import { setImportModelStageAtom } from '@/hooks/useImportModel'
|
|
|
|
import { toGibibytes } from '@/utils/converter'
|
|
|
|
import { editingModelIdAtom } from '../EditModelInfoModal'
|
|
import ImportInProgressIcon from '../ImportInProgressIcon'
|
|
import ImportSuccessIcon from '../ImportSuccessIcon'
|
|
|
|
type Props = {
|
|
model: ImportingModel
|
|
}
|
|
|
|
const ImportingModelItem: React.FC<Props> = ({ model }) => {
|
|
const setImportModelStage = useSetAtom(setImportModelStageAtom)
|
|
const setEditingModelId = useSetAtom(editingModelIdAtom)
|
|
const sizeInGb = toGibibytes(model.size)
|
|
|
|
const onEditModelInfoClick = () => {
|
|
setEditingModelId(model.importId)
|
|
setImportModelStage('EDIT_MODEL_INFO')
|
|
}
|
|
|
|
const onDeleteModelClick = () => {}
|
|
|
|
return (
|
|
<div className="flex w-full flex-row items-center space-x-3 rounded-lg border px-4 py-3">
|
|
<p className="line-clamp-1 flex-1">{model.name}</p>
|
|
<p>{sizeInGb}</p>
|
|
|
|
{model.status === 'IMPORTED' || model.status === 'FAILED' ? (
|
|
<ImportSuccessIcon onEditModelClick={onEditModelInfoClick} />
|
|
) : (
|
|
<ImportInProgressIcon
|
|
percentage={model.percentage ?? 0}
|
|
onDeleteModelClick={onDeleteModelClick}
|
|
/>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default ImportingModelItem
|