Nicholai/jan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add cover image model hub screen

Browse Source
This commit is contained in:
Faisal Amir 2023-12-06 12:46:31 +07:00
parent f3fbade975
commit d63c9c3d46
2 changed files with 23 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
core/src/types/index.ts
View File

@ -240,6 +240,7 @@ export type ModelMetadata = {
author: string; author: string;
tags: string[]; tags: string[];
size: number; size: number;
cover?: string;
}; };
/** /**

37
web/screens/ExploreModels/ExploreModelItemHeader/index.tsx
View File

@ -98,23 +98,30 @@ const ExploreModelItemHeader: React.FC<Props> = ({ model, onClick, open }) => {
return ( return (
<div <div
className="flex cursor-pointer items-center justify-between rounded-t-md bg-background/50 px-4 py-4" className="cursor-pointer rounded-t-md bg-background/50"
onClick={onClick} onClick={onClick}
> >
<div className="flex items-center gap-2"> {model.metadata.cover && (
<span className="font-bold">{model.name}</span> <div className="relative h-full w-full">
</div> <img src={model.metadata.cover} alt={`Cover - ${model.id}`} />
<div className="inline-flex items-center space-x-2"> </div>
<span className="mr-4 font-semibold text-muted-foreground"> )}
{toGigabytes(model.metadata.size)} <div className="flex items-center justify-between p-4">
</span> <div className="flex items-center gap-2">
{downloadButton} <span className="font-bold">{model.name}</span>
<ChevronDownIcon </div>
className={twMerge( <div className="inline-flex items-center space-x-2">
'h-5 w-5 flex-none text-gray-400', <span className="mr-4 font-semibold text-muted-foreground">
open === model.id && 'rotate-180' {toGigabytes(model.metadata.size)}
)} </span>
/> {downloadButton}
<ChevronDownIcon
className={twMerge(
'h-5 w-5 flex-none text-gray-400',
open === model.id && 'rotate-180'
)}
/>
</div>
</div> </div>
</div> </div>
) )