93 lines
2.9 KiB
TypeScript
93 lines
2.9 KiB
TypeScript
import { Tooltip, Button, Badge } from '@janhq/joi'
|
|
|
|
import { useAtom } from 'jotai'
|
|
|
|
import { useActiveModel } from '@/hooks/useActiveModel'
|
|
|
|
import { toGibibytes } from '@/utils/converter'
|
|
|
|
import { localEngines } from '@/utils/modelEngine'
|
|
|
|
import { serverEnabledAtom } from '@/helpers/atoms/LocalServer.atom'
|
|
|
|
const Column = ['Model', 'Size', '']
|
|
|
|
const TableActiveModel = () => {
|
|
const { activeModel, stateModel, stopModel } = useActiveModel()
|
|
|
|
const [serverEnabled, setServerEnabled] = useAtom(serverEnabledAtom)
|
|
|
|
return (
|
|
<div className="w-1/2">
|
|
<div className="overflow-hidden border-b border-[hsla(var(--app-border))]">
|
|
<table className="w-full px-8">
|
|
<thead className="w-full border-b border-[hsla(var(--app-border))] bg-[hsla(var(--tertiary-bg))]">
|
|
<tr>
|
|
{Column.map((col, i) => {
|
|
return (
|
|
<th
|
|
key={i}
|
|
className="px-4 py-2 text-left font-normal last:text-center"
|
|
>
|
|
{col}
|
|
</th>
|
|
)
|
|
})}
|
|
</tr>
|
|
</thead>
|
|
{activeModel && localEngines.includes(activeModel.engine) ? (
|
|
<tbody>
|
|
<tr>
|
|
<td
|
|
className="max-w-[200px] px-4 py-2 font-bold"
|
|
title={activeModel.name}
|
|
>
|
|
<p className="line-clamp-2">{activeModel.name}</p>
|
|
</td>
|
|
<td className="px-4 py-2">
|
|
<Badge theme="secondary">
|
|
{activeModel.metadata.size
|
|
? toGibibytes(activeModel.metadata.size)
|
|
: '-'}
|
|
</Badge>
|
|
</td>
|
|
<td className="px-4 py-2 text-center">
|
|
<Tooltip
|
|
trigger={
|
|
<Button
|
|
theme={
|
|
stateModel.state === 'stop'
|
|
? 'destructive'
|
|
: 'primary'
|
|
}
|
|
onClick={() => {
|
|
stopModel()
|
|
window.core?.api?.stopServer()
|
|
setServerEnabled(false)
|
|
}}
|
|
>
|
|
Stop
|
|
</Button>
|
|
}
|
|
content="The API server is running, stop the model will
|
|
also stop the server"
|
|
disabled={!serverEnabled}
|
|
/>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
) : (
|
|
<tbody>
|
|
<tr className="text-[hsla(var(--text-secondary))]">
|
|
<td className="p-4">No on-device model running</td>
|
|
</tr>
|
|
</tbody>
|
|
)}
|
|
</table>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default TableActiveModel
|